call, apply, and bind Interview Questions

call, apply, and bind Interview Questions

Q1: What is the output?

const obj = { x: 10 };
function foo(y) { return this.x + y; }
console.log(foo.call(obj, 5));

Answer: 15.

Q2: What is the output?

const obj = { x: 10 };
function foo(y, z) { return this.x + y + z; }
console.log(foo.apply(obj, [5, 3]));

Answer: 18.

Q3: What is the output?

const obj = { x: 10 };
function foo(y) { return this.x + y; }
const bound = foo.bind(obj, 5);
console.log(bound());

Answer: 15.

Q4: Implement a function that borrows slice from Array.

function toArray(arr) {
  return Array.prototype.slice.call(arr);
}

Q5: Can you re-bind a bound function?

No. bound.bind(newObj) does not change this. The first bind wins.

Q6: What happens if you call bind on an arrow function?

Nothing. The arrow's this is lexical and cannot be changed by bind, call, or apply.

The Takeaway

Interview questions: output prediction (call with this + args, apply with array, bind + call later), method borrowing (Array.prototype.slice.call), re-binding (not possible), and arrows (ignore bind). Practice each.