What is the difference between .call and .apply in JavaScript?
Answer
The difference between .call() and .apply() in JavaScript lies in how they pass arguments to the function they invoke.
1. Function.prototype.call()
- Invokes a function with a specified this value and arguments passed individually.
- Arguments are listed one by one, separated by commas.
Syntax:
func.call(thisArg, arg1, arg2, ...);Example:
function greet(greeting, punctuation) {
console.log(`${greeting}, ${this.name}${punctuation}`);
}
const person = { name: 'Alice' };
greet.call(person, 'Hello', '!'); // Output: Hello, Alice!
2. Function.prototype.apply()
- Invokes a function with a specified this value and arguments passed as an array.
- Useful when arguments are already in array form.
Syntax:
func.apply(thisArg, [arg1, arg2, ...]);Example:
function greet(greeting, punctuation) {
console.log(`${greeting}, ${this.name}${punctuation}`);
}
const person = { name: 'Bob' };
greet.apply(person, ['Hi', '?']); // Output: Hi, Bob?
When to Use?
- Use
.call()when arguments are known explicitly. - Use
.apply()when arguments are already in an array or need to be constructed dynamically.