JavaScript函数方法 - call()、apply()和bind()
Function.prototype.call()
Function.prototype.call()
用于使用给定的this
上下文和单独提供的任何参数调用函数。例如:
function printThisAndData(...data) {
console.log(this.data, ...data);
}
const obj = { data: 0 };
const data = [1, 2, 3];
printThisAndData.call(obj, data); // 输出:0 [1, 2, 3]
printThisAndData.call(obj, ...data); // 输出:0 1 2 3
Function.prototype.apply()
Function.prototype.apply()
与Function.prototype.call()
几乎相同,因为它使用给定的this
上下文调用函数,但它要求参数以数组的形式提供。例如:
function printThisAndData(...data) {
console.log(this.data, ...data);
}
const obj = { data: 0 };
const data = [1, 2, 3];
## Function.prototype.call()
`Function.prototype.call()` 方法用于调用一个函数,并将一个指定的 `this` 值和单独的参数传递给该函数。例如:
```js
function printThisAndData(...data) {
console.log(this.data, ...data);
}
const obj = { data: 0 };
const data = [1, 2, 3];
printThisAndData.call(obj, data); // 输出:0 [1, 2, 3]
printThisAndData.call(obj, ...data); // 输出:0 1 2 3
Function.prototype.apply()
Function.prototype.apply()
方法也用于调用一个函数,但是它接收一个指定的 this
值和一个参数数组作为参数。参数数组中的每个元素都会作为单独的参数传递给函数。例如:
function printThisAndData(...data) {
console.log(this.data, ...data);
}
const obj = { data: 0 };
const data = [1, 2, 3];
printThisAndData.apply(obj, data); // 输出:0 1 2 3
printThisAndData.apply(obj, ...data); // 抛出 TypeError
Function.prototype.bind()
Function.prototype.bind()
方法与前面两个方法略有不同。它不是直接调用函数并返回结果,而是返回一个绑定了指定 this
值的函数,并且在调用返回的函数时,会将提供的参数逐个添加到调用时的参数之前。例如:
function printThisAndData(...data) {
console.log(this.data, ...data);
}
const obj = { data: 0 };
const data = [1, 2, 3];
const printObjAndData = printThisAndData.bind(obj);
printObjAndData(data); // 输出:0 [1, 2, 3]
printObjAndData(...data); // 输出:0 1 2 3
const printObjTwoAndData = printThisAndData.bind(obj, 2);
printObjTwoAndData(data); // 输出:0 2 [1, 2, 3]
printObjTwoAndData(...data); // 输出:0 2 1 2 3