bind call apply有什么区别？怎么实现一个bind？

bind

• 作用：创建一个新函数，在调用这个新函数时，将 this 关键字设置为提供的值，并在调用新函数时预设一些参数。
• 特点：不会立即执行新函数，而是返回一个新的函数。

示例：

let obj = { name: 'Alice' };

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

let greetAlice = greet.bind(obj, 'Hello');
greetAlice(); // Hello, my name is Alice

call

• 作用：立即调用函数，并指定函数内部 this 的值和参数。
• 特点：参数需要逐个传递。

示例：

let obj = { name: 'Bob' };

function introduce(age, job) {
  console.log(`My name is ${this.name}, I am ${age} years old and I am a ${job}.`);
}

introduce.call(obj, 30, 'developer'); // My name is Bob, I am 30 years old and I am a developer.

apply

• 作用：立即调用函数，并指定函数内部 this 的值和参数。
• 特点：参数以数组形式传递。

示例：

let obj = { name: 'Charlie' };

function introduce(age, job) {
  console.log(`My name is ${this.name}, I am ${age} years old and I am a ${job}.`);
}

introduce.apply(obj, [25, 'designer']); // My name is Charlie, I am 25 years old and I am a designer.

区别

• bind：返回一个新函数，不会立即执行，可以预设参数。
• call：立即执行函数，参数逐个传递。
• apply：立即执行函数，参数以数组形式传递。

实现一个简单的 bind

要实现一个简单的 bind 函数，可以使用以下步骤：

1. 保存原函数和上下文。
2. 返回一个新函数。
3. 在新函数中调用原函数，并传递正确的 this 和参数。

以下是一个简化版本的 bind 实现：

if (!Function.prototype.bind) {
  Function.prototype.bind = function(context, ...args) {
    // 保存当前函数引用
    let self = this;

    // 返回一个新函数
    return function(...newArgs) {
      // 在新函数中调用原函数，并传递正确的 this 和参数
      return self.apply(context, args.concat(newArgs));
    };
  };
}

解释 bind 实现细节

1. 检查 Function.prototype 是否已经有 bind 方法：

   • 如果没有 bind 方法，我们才定义它。

2. 保存当前函数引用：

   • let self = this;，这里的 this 是指调用 bind 方法的函数。

3. 返回一个新函数：

   • 新函数会在调用时接收额外的参数 newArgs。

4. 在新函数中调用原函数：

   • 使用 self.apply(context, args.concat(newArgs)); 调用原函数，将 context 作为 this，并传递预设的参数 args 和新函数的参数 newArgs。

通过这种方式，我们实现了一个简单的 bind 方法，可以将函数的 this 绑定到指定的对象，并预设部分参数。