Interview Questions (Javascript)

Hi guys. In this post, I discuss some of the common interview questions for Javascript. These questions are taken from this github repository. Not all answers here are written by me. Many of them exist on the WWW. I have just grouped them together here so that you have a one stop for the questions and their answers.

Let’s get started.

Explain event delegation.

JavaScript event delegation is a simple technique by which you add a single event handler to a parent element in order to avoid having to add event handlers to multiple child elements.

Explain how this works in JavaScript. Can you give an example of one of the ways that working with this has changed in ES6?

• Good Read
• Arrow Functions have changed working with this in ES6.

Explain how prototypal inheritance works.

Good Read

What’s the difference between a variable that is: null, undefined or undeclared? How would you go about checking for any of these states?

• Undeclared means that a variable has not been declared yet. It is an error that is thrown by JS. Also, the type of an undeclared variable is undefined.
• undefined is a value that is assigned to variable that have not be initialized. undefined is also a type. A function, not returning anything, returns undefined. undefined is falsy.
• null is a primitive value that represents the intentional absence of any object value. It is assigned by developers intentionally to imply absence of an object. null is falsy.

More Details

What is a closure, and how/why would you use one?

Good Read

What language constructions do you use for iterating over object properties and array items?

const obj = { a: 1, b: 2 };

// Iterating over objects (option 1)
for (const key in obj) {
  if (obj.hasOwnProperty(key)) {
    console.log(`Key: ${key}, Value: ${obj[key]}`);
  }
}

// Iterating over objects (option 2)
for (const key of Object.keys(obj)) {
  console.log(`Key: ${key}, Value: ${obj[key]}`);
}

const arr = [1, 2, 3, 4, 5];

// Iterating over arrays (option 1)
for (const item of arr) {
  console.log(item);
}

// Iterating over arrays (option 1)
arr.forEach((item) => {
  console.log(item);
});

Can you describe the main difference between the Array.forEach() loop and Array.map() methods and why you would pick one versus the other?

Array.forEach() and Array.map() iterate over the array and execute the callback on each item of the array in order.
The key difference is that, forEach ignores the return values of the callback, whereas, map groups the return values in order and returns them as an array.

const arr = [1, 2, 3, 4, 5];

arr.forEach(i => console.log(i));
// 1
// 2
// 3
// 4
// 5

arr.map(i => i * i);
[1, 4, 9, 16, 25]

forEach is used when we just want to execute some function with each item of the array.
map is used when we want to transform the array, like get squares of all the numbers of an array. Although, if we ignore the return value of map, then it behaves like forEach.

map has higher performance than forEach.

What’s a typical use case for anonymous functions?

• Can be used as callbacks

What’s the difference between host objects and native objects?

Good Read

Explain the difference between: function Person(){}, var person = Person(), and var person = new Person().

• function Person(){}
  Declares a named function in memory, but does not execute it. This is also hoisted at the top.
• var person = Person() Invokes the function named Person and stores the return value in person.
• var person = new Person()
  In this case, we have the introduction of the new keyword which means that Person is an object constructor function which returns a new object instance.

Explain the differences on the usage of foo between function foo() {} and var foo = function() {}

Good Read

Can you explain what Function.call and Function.apply do? What’s the notable difference between the two?

Good Read

Explain Function.prototype.bind.

Good Read

What’s the difference between feature detection, feature inference, and using the UA string?

Good Read

Explain “hoisting”.

Good Read

Describe event bubbling and capturing.

Good Read

What’s the difference between an “attribute” and a “property”?

Good Read

What are the pros and cons of extending built-in JavaScript objects?

Good Read

What is the difference between == and ===?

Good Read

Explain the same-origin policy with regards to JavaScript.

Good Read

Why is it called a Ternary operator, what does the word “Ternary” indicate?

This operator acts on 3 parameters (hence the name).

param1 ? param2 : param3

If param1 is truthy, then the entire expression returns param2, else, it returns param3.

What is strict mode? What are some of the advantages/disadvantages of using it?

Good Read

What are some of the advantages/disadvantages of writing JavaScript code in a language that compiles to JavaScript?

• Pros
  • We get some access to features like classes and types.
  • We even get syntactic sugar for many things like Annotations/Decorators for wrapping our methods.
• Cons
  • You’ll probably need webpack or gulp to automate all your transpiling and bundling.
  • Developers joining your team will have to learn specifics of the framework you are using.

What tools and techniques do you use debugging JavaScript code?

• Logging
• Chrome Dev tools (& Debugger)
• Following the stack trace
• Writing tests for smaller chunks to rule out possibilities of having bugs in it and then incrementally moving towards complex functions.

Explain the difference between mutable and immutable objects

Good Read

Explain the difference between synchronous and asynchronous functions.

Good Read

What is event loop? What is the difference between call stack and task queue?

In brief: Javascript keeps running until there is code to run. When it encounters an asynchronous operation like a callback case or a Promise case, it adds the callbacks to a queue and proceeds. Once the code is completed processing, it checks if there is any function left in the queue. If yes, for each function in the queue, it checks if it’s requirement is completed or not(like network request, file system interaction, etc. ). If yes, then that function is removed from the queue and executed. If that function also has some async operation, the same process repeats. This is done until the queue is empty. When the queue is empty, the javascript process terminates. This is called event loop and the queue used here is called the task queue.
When you call a function inside of another function, the caller-function gets pushed onto a stack with its state stored. When the callee function completes execution, it pops the last function pushed onto the stack and continues its execution. The stack used here is called the Call Stack.

What are the differences between variables created using let, var or const?

Good Read

What are the differences between ES6 class and ES5 function constructors?

Good Read

Can you offer a use case for the new arrow => function syntax? What advantage is there for using the arrow syntax for a method in a constructor?

Arrow functions don’t have their own this context. This changes how we use the methods. We don’t need to bind them to the object instance.

What is the definition of a higher-order function?

A function that can take functions as arguments and/or returns functions as return value.

Can you give an example for destructuring an object or an array?

const obj = { a1: 1, b1: 2 };
const { a1, b1 } = obj;
console.log(a1);
// 1
console.log(b1);
// 2

const arr = [1, 2];
const [ a2, b2 ] = arr;
console.log(a2);
// 1
console.log(b2);
// 2

Can you give an example of generating a string with ES6 Template Literals?

const a = 123;
console.log(`Number: ${a}`);
// Number: 123

Can you give an example of a curry function and why this syntax offers an advantage?

Good Read

What are the benefits of using spread syntax and how is it different from rest syntax?

Good Read

What is a promise? Where and how would you use promise?

Good Read

Implement your own promise class

Here is a Github Gist link of my implementation