JavaScript Interview Questions that made me think — Do I really know JavaScript? — Part 4

Unraveling the Enigma: JavaScript Interview Questions That Test Your Mastery

Photo by Rahul Mishra on Unsplash

“JavaScript is like that quirky friend who brings their own rules to the party — one minute it’s coercing strings into numbers, the next it’s declaring variables before they even exist.

It’s like a mad scientist mixing objects with functions and occasionally summoning mysterious ‘NaN’ creatures.

Just when you think you’ve got it all figured out, it throws a ‘TypeError’ tantrum and refuses to play nice. But hey, it keeps life interesting, like a code adventure with unexpected twists at every corner!”

With that said, there I am listing few questions which might make you go awwww 🏄 about JS.

Q1. What will be logged in the console?

function phoo(){ 
  return phoo; 
}

const phoObject = new phoo();

console.log(phoObject instanceof phoo);

.

.

.

Output: false

Explanation: phoo function is invoked with new keyword. When we call a function with new , JS engine creates a brand new object, assigns the this binding to newly created object, and if there is not explicit return, the newly created object is returned.

In above code, we have a explicit return. We are returning the phoo (same function itself).

instanceofchecks the type of an object at the run time. It returns true or false based on checking the object’s instance type.

instanceof also takes inheritance into account, it checks the whole prototype chain to match the instance. To understand this let’s take this example:

const fruits = ["Orange", "Kiwi", "Banana"]; 

console.log(fruits instanceof Array);  // true
console.log(fruits instanceof Object);  // true (Array is inherited from Object)
console.log(fruits instanceof Number); // false
console.log(fruits instanceof String); // false

2. What will be the output?

var y = 1;
  if (function f(){}) {
    y += typeof f;
  }
  console.log(y);

.

.

.

Output: 1undefined.

In the if statement, an anonymous function function f(){} is used as the condition. While this might seem like a function declaration, it is actually a function expression. The difference between function declarations and function expressions lies in how they are parsed and treated by the JavaScript engine during the initial code compilation phase.

In above code, function f(){} is treated as a function expression because it's used within an expression context (as part of the if condition). Function expressions do not get hoisted to the top of the scope like function declarations do. Instead, they are only defined and available for use after the point where they are defined in the code.

if (function f(){}) { ... }: The anonymous function function f(){} is treated as a function expression. It is not hoisted to the top of the scope, and it's only defined from this point onward. Therefore, it's not available before or after this line.

3. What will be the value of y?

var z = 1, y = z = typeof y;
console.log(y);

The output would be undefined. According to the associativity rule, operators with the same precedence are processed based on the associativity property of the operator.

Here, the associativity of the assignment operator is Right to Left, so typeof y will evaluate first , which is undefined. It will be assigned to z, and then y would be assigned the value of z and then z would be assigned the value 1.

4. What will be printed in the console?

const x = y = {};

y.name = 'JS';

console.log(x);
console.log(y)

.

.

.

Output: {name:'JS'} {name:'JS'}

Explaination: x and y both are assigned to same object.
If we break down above code, then we get something like this:

const y = {};

const x = y;

Hence in the console {name:’JS’} will be printed twice . One time for x and one time for y

Q5. What will be the order of logs in the console?

function foo1() {
  console.log("A");
  foo2();
  console.log("D");
}

async function foo2() {
  await foo3();
  console.log("C");
}

async function foo3() {
  console.log("B");
}

foo1();

.

.

.

Output: A B D C

Explanation: whatever code we have written after await will run on the microtask queue. As soon as foo3() is executed, next line console.log("C") will be pushed to microtask queue, and once callstack is empty then it will get executed.

Q6. Which option will execute console after 3000ms?

Option A: setTimeout(console.log("A"), 3000)

Option B: setTimeout.call(null, ()=> console.log("YES"), 3000);

Option C: setTimeout.call(null, console.log("YES"), 3000);

.

.

.

Correct option: Option B

Explanation: In all other option we aren’t passing function, instead we are calling it.

7. What will be the length of array?

const array = [{name:'JS'}, '2', 'Hello'];
delete array[1];

console.log(array.length); // ??

.

.

.

Output: 3

Explanation: delete operator will delete the element from the array, leaving a empty slot in place of deleted element. In order to delete element prefer to use pop, slice or splice.

8. Will this code throw error?

function fetchA() {
  A = 7;
  console.log(A);
}

let A;
fetchA();

.

.

.

Output: No, this code logs 7.

Explanation:

1. Function Declaration (fetchA): The fetchA function is defined. This function takes no arguments and performs two actions:

• It assigns the value 7 to the variable A.
• It logs the value of the variable A to the console.

2. Variable Declaration (let A): Variable named A is declared using the let keyword. This variable is declared in the global scope (or the scope of the block containing it). Importantly, variables declared with let are not initialized with any value during the hoisting process. They are in a "temporal dead zone" until they are explicitly assigned a value.

3. Function Call (fetchA()): The fetchA function is invoked (called). This triggers the execution of the function's code.

• Inside the function, the line A = 7; assigns the value 7 to the global variable A. This variable A is the same one that was declared using let in the outer scope.
• After assigning 7 to A, the line console.log(A); logs the value of A (which is now 7) to the console.

9. What will be logged in the console?

const obj= { name: "JS" };
obj.ref = obj;

JSON.stringify(obj);

.

.

.

Output:

  Uncaught TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    --- property 'ref' closes the circle
    at JSON.stringify (<anonymous>)
    at app2.js:16:6

Explanation: We get the above error because JSON does not support circular references. JSON is a data interchange format, and circular references cannot be represented in it.

Here are the other three parts of this series:

JavaScript Interview Questions that made me think — Do I really know JavaScript? — Part 5

JavaScript Interview Questions that made me think — Do I really know JavaScript? — Part 3

JavaScript Interview Questions that made me think — Do I really know JavaScript? — Part 2

JavaScript Interview Questions that made me think — Do I really know JavaScript.