函数调用方法：call、apply 和 bind 的巧妙运用

2023-10-18 22:15:47

在 JavaScript 的世界里，我们经常需要在不同的对象之间传递函数。为了实现这一目标，call、apply 和 bind 这些强大的方法派上了用场。它们允许我们灵活地控制函数的执行环境，从而实现代码的可复用性和灵活性。

call 和 apply：立即执行的兄弟

call 和 apply 是两兄弟，它们在执行函数时发挥着相似的作用：立即执行。

call(thisArg, arg1, arg2, ...) ：调用函数，并将 this 上下文设置为 thisArg。其他参数作为函数参数传递。
apply(thisArg, [argArray]) ：与 call 类似，但它将参数数组作为第二个参数传递。

示例：

function greet(greeting) {
  console.log(this.name + " says " + greeting);
}

const person = {
  name: "John",
};

greet.call(person, "Hello!"); // 输出：John says Hello!
greet.apply(person, ["Good morning!"]); // 输出：John says Good morning!

bind：创建绑定函数的魔术师

bind 则是一位魔术师，它创建了一个新函数，该函数的 this 上下文已绑定到指定的 thisArg。此新函数在以后调用时才会执行。

语法：

const boundFunction = functionName.bind(thisArg);

示例：

function greetBound(greeting) {
  console.log(this.name + " says " + greeting);
}

const boundGreet = greetBound.bind(person);

setTimeout(boundGreet, 1000, "Howdy!"); // 1 秒后输出：John says Howdy!