当前位置：首页 > news >正文

面试题之介绍下call，apply，bind相同点和不同点

news 来源：原创 2025/5/30 5:34:00

call、apply 和 bind 是 JavaScript 中用于改变函数执行时 this 指向的方法。

1. `call` 方法

call 方法允许你调用一个函数，并显式地指定函数内部的 this 值，同时可以传递参数。

语法：

JavaScript复制

function.call(thisArg, arg1, arg2, ...);

thisArg：函数内部的 this 值。
arg1, arg2, ...：传递给函数的参数。

示例：

function greet(...message) {
console.log(`${message}, my name is ${this.name}`);
}

const person = { name: "Alice" };

greet.call(person, "Hello","hi","嘻嘻"); // 输出: Hello,hi,嘻嘻, my name is Alice

2. `apply` 方法

apply 方法与 call 类似，也用于调用一个函数并显式地指定函数内部的 this 值，但它的参数是以数组的形式传递的。

语法：

JavaScript复制

function.apply(thisArg, [argsArray]);

thisArg：函数内部的 this 值。
[argsArray]：一个数组，包含要传递给函数的参数。

示例：

function greet(...message) {
console.log(`${message}, my name is ${this.name}`);
}

const person = { name: "Alice" };

greet.apply(person, ["Hello","hi","嘻嘻"]); // 输出: Hello,hi,嘻嘻, my name is Alice

3. `bind` 方法

bind 方法用于创建一个新的函数，并将该函数的 this 值永久绑定到指定的对象上。与 call 和 apply 不同，bind 不会立即调用函数，而是返回一个新的函数。

语法：

const newFunction = function.bind(thisArg, arg1, arg2, ...);

thisArg：绑定到新函数的 this 值。
arg1, arg2, ...：预绑定的参数（可选）。

示例：

function greet(...message) {
console.log(`${message}, my name is ${this.name}`);
}

const person = { name: "Alice" };

const greetAlice = greet.bind(person, "Hello","hi");
greetAlice("嘻嘻"); // 输出: Hello,hi,嘻嘻, my name is Alice

相同点

目的相同：call、apply 和 bind 都用于改变函数执行时的上下文（this 值）。
参数传递：都可以传递参数给目标函数（call 和 apply 是直接调用，bind 是预绑定）。
用途广泛：都可以用于继承、函数借用、模拟私有方法等场景。

不同点

调用方式：
- call：直接调用函数，参数逐个传递。
- apply：直接调用函数，参数以数组形式传递。
- bind：返回一个新的函数，this 值和参数被预绑定，需要手动调用。
是否立即执行：
- call 和 apply：立即调用目标函数。
- bind：返回一个新的函数，不会立即执行。
参数传递方式：
- call：参数逐个传递。
- apply：参数以数组形式传递。
- bind：预绑定参数，后续调用时可以补充参数。
应用场景：
- call 和 apply：通常用于立即调用函数并改变上下文。
- bind：用于创建一个上下文固定的函数，常用于事件处理、回调函数等场景。