Questions
5 of 19
1Explain the 5 rules that determine the value of this in JavaScript. Walk through each with an example.
2What is the default binding of this? How does strict mode change it?
3What is the difference between implicit and explicit binding? When does implicit binding get lost?
4How does this behave differently in arrow functions vs regular functions? Why?
5What does new binding do to this? What happens internally when you use new?
6Can this inside an arrow function be changed using .call(), .apply(), or .bind()? Why or why not?
7What is the value of this in a class constructor? What about in a class method called as a callback?
8What is the difference between call, apply, and bind? When would you use each?
9Explain how this works in event listeners. How do you preserve the correct this when using class methods as event handlers?
10How does this behave in a module (ESM) at the top level vs CommonJS?
11What is 'context loss' and what are the three most common ways to fix it in production code?
12How does Function.prototype.bind work under the hood? Can you implement a polyfill for it?
13How does this behave in prototype chain method calls? Does it refer to the instance or the prototype?
14When mixing ES6 classes with prototype manipulation, how can this become unpredictable?
15How do React class components use this, and why did binding in the constructor become a common pattern? How did arrow function class fields solve it?
16In what real-world scenarios have you encountered this-related bugs? How did you debug and fix them?
17What are the trade-offs between using arrow functions everywhere to avoid this confusion vs using regular functions with explicit binding?
18How would you explain the this keyword to a junior developer in one analogy?
19Can you think of a scenario where using .bind() causes a memory issue? How would you address it?
05 / 19

What does new binding do to this? What happens internally when you use new?

new binding creates a new empty object, sets that object as this, links the object to the function's prototype, executes the function, and returns the object (unless the function returns another object).

When a function is called with the new keyword, the following steps occur internally: (1) a new empty object is created, (2) the this inside the function is bound to this new object, (3) the object's prototype is set to the function's prototype property, (4) the function is executed with this set to the new object, and (5) if the function doesn't return an object, the new object is returned. Example: function Car(model) { this.model = model; } const tesla = new Car('Model S'); console.log(tesla.model); // 'Model S'.