What Is the Difference Between call, apply, and bind?
Learn the exact differences between call, apply, and bind in JavaScript, with examples of explicit `this` binding.
Expected Interview Answer
`call`, `apply`, and `bind` are all methods on `Function.prototype` used to explicitly control what `this` refers to inside a function; `call` and `apply` invoke the function immediately with a given `this`, differing only in how they pass arguments, while `bind` returns a new function permanently bound to that `this`, to be called later.
`fn.call(thisArg, arg1, arg2)` invokes `fn` immediately with `this` set to `thisArg` and arguments passed individually, comma-separated. `fn.apply(thisArg, [arg1, arg2])` does exactly the same thing but takes arguments as a single array, which is useful when arguments already exist as a list, such as spreading `arguments` in older code or forwarding a dynamic array of values. `fn.bind(thisArg, arg1)` differs fundamentally: it does not call `fn` at all — instead it returns a brand-new function with `this` permanently locked to `thisArg` (and optionally some leading arguments pre-filled via partial application), which can be invoked later, stored, or passed as a callback without losing its binding. Once bound, `this` cannot be overridden again, even by using `call` or `apply` on the resulting bound function. The classic real-world use of `bind` is fixing the “detached method” problem — passing `obj.method` to `setTimeout` or as an event handler without losing its `this` connection to `obj`.
- Gives explicit, deliberate control over `this` instead of relying on call-site defaults
- apply is convenient when arguments already exist as an array
- bind solves the classic detached-callback `this`-loss problem permanently
- bind supports partial application by pre-filling leading arguments
AI Mentor Explanation
`call` is like a substitute fielder being told directly, right now, "field at cover point," and running there immediately with that specific instruction. `apply` is the same immediate instruction, just handed over as a pre-written list of positions instead of spoken one at a time. `bind`, by contrast, is like permanently assigning a player to cover point for the rest of the tour — you do not tell them again each ball, the assignment sticks and they take the field with that role fixed whenever selected. That immediate-versus-permanent distinction is exactly the difference between call/apply and bind.
Step-by-Step Explanation
Step 1
Need to call immediately with known args?
Use `call(thisArg, a, b, c)` with arguments passed individually.
Step 2
Need to call immediately with an array of args?
Use `apply(thisArg, [a, b, c])` when arguments already exist as a list.
Step 3
Need to reuse the binding later?
Use `bind(thisArg)` to get a new function permanently bound, without invoking it yet.
Step 4
Store or pass the bound function
Pass the result of `bind` as a callback/handler, confident `this` will not be lost.
What Interviewer Expects
- Correctly distinguishes immediate invocation (call/apply) from deferred (bind)
- Explains the argument-passing difference between call and apply precisely
- Names a real use case for bind (fixing detached method callbacks)
- Knows that a bound function cannot be re-bound by a later call/apply
Common Mistakes
- Saying call and apply behave differently regarding `this`, when they only differ in argument passing
- Forgetting that bind returns a new function instead of invoking immediately
- Assuming you can override a bound function's `this` again with call/apply
- Mixing up which of call/apply takes an array of arguments
Best Answer (HR Friendly)
“call and apply both run a function right away with a `this` value you choose — call takes arguments one by one, apply takes them as an array. bind is different: it does not run the function immediately, it gives you back a new function that is permanently locked to that `this`, which you can call whenever you want, like when passing a method as a callback.”
Code Example
function introduce(greeting, punctuation) {
return `${greeting}, I’m ${this.name}${punctuation}`
}
const person = { name: 'Mia' }
console.log(introduce.call(person, 'Hi', '!')) // immediate, args listed
console.log(introduce.apply(person, ['Hi', '!'])) // immediate, args as array
const boundIntroduce = introduce.bind(person, 'Hi') // not called yet, 'greeting' pre-filled
console.log(boundIntroduce('!')) // called later, 'this’ still locked
setTimeout(boundIntroduce.bind(person, '.'), 1000) // safe as a callback, this stays intactFollow-up Questions
- Why does a bound function ignore a later call() or apply() trying to change its `this`?
- How would you use apply to find the max of an array of numbers?
- How does bind support partial application beyond just fixing `this`?
- How do arrow functions make call/apply/bind less necessary in modern code?
MCQ Practice
1. What is the key difference between call and apply?
Both invoke immediately with a given `this`; they differ only in how arguments are passed.
2. What does bind return?
bind does not invoke the function; it returns a new bound function for later use.
3. What classic problem does bind commonly solve?
bind permanently locks `this`, so passing obj.method.bind(obj) as a callback keeps the binding intact.
Flash Cards
call vs apply? — Both invoke immediately with a given `this`; call takes args individually, apply takes an array.
What does bind return? — A new function with `this` permanently locked, not called immediately.
Can a bound function be re-bound? — No — once bound, later call/apply cannot override its `this`.
Classic use case for bind? — Fixing a detached method callback so it keeps its original `this`.