掌握手写call、apply、bind、new的技能，让JavaScript开发游刃有余
2023-11-03 09:16:50
探索 JavaScript 中改变 this 指向的强大函数：call、apply、bind 和 new
在 JavaScript 中，this 指向函数执行时的当前对象。理解如何改变函数的 this 指向对于编写灵活且可扩展的代码至关重要。call、apply、bind 和 new 这四个函数提供了强大的方法来控制 this 指向，从而带来广泛的可能性。
call 和 apply：立即调用，改变 this 指向
call 和 apply 方法非常相似，它们立即调用一个函数，同时允许指定函数的 this 指向。
- call： 使用
function.call(thisArg, arg1, arg2, ..., argN)语法，其中thisArg是要将this指向的对象，后跟要传递给函数的参数。 - apply： 与
call相似，但使用function.apply(thisArg, [args])语法，其中[args]是一个包含要传递给函数的参数的数组。
这两个方法都立即执行函数，并根据提供的 thisArg 设置 this 指向。
bind：返回一个绑定 this 指向的新函数
bind 方法与 call 和 apply 不同，它不会立即调用函数。相反，它返回一个新的函数，该函数的 this 指向已永久绑定到提供的对象。
- 语法：
function.bind(thisArg, arg1, arg2, ..., argN)，其中thisArg是要绑定this指向的对象，后跟要预先传递给新函数的参数（可选）。
这允许您创建可以稍后调用的函数，而无需再次指定 this 指向。
new：创建新对象并绑定 this 指向
new 方法用于创建新对象，并自动将 this 指向设置为该新对象的实例。
- 语法：
new function(arg1, arg2, ..., argN)，其中function是要创建对象的构造函数，后跟要传递给构造函数的参数。
new 方法在创建对象时非常有用，因为它自动设置 this 指向，并允许您使用构造函数来初始化对象的属性和方法。
call、apply、bind 和 new 的区别
虽然这四个函数都用于改变 this 指向，但它们在用法和效果上有细微差别：
- call 和 apply ：立即调用函数，并根据提供的
thisArg设置this指向。 - bind ：返回一个绑定
this指向的新函数，该函数稍后可以调用，无需再次指定thisArg。 - new ：创建新对象并自动将
this指向设置为该新对象的实例。
代码示例
以下是一些代码示例，演示了如何使用这些函数：
// 使用 call 改变 this 指向
function greet() {
console.log(`Hello, ${this.name}!`);
}
const person = {
name: 'John Doe'
};
greet.call(person); // 输出：Hello, John Doe!
// 使用 apply 改变 this 指向，并提供参数数组
function sum(a, b) {
return a + b;
}
const numbers = [1, 2];
const result = sum.apply(null, numbers); // 输出：3
// 使用 bind 绑定 this 指向
function Person(name) {
this.name = name;
}
const person = new Person('John Doe');
const boundGreet = person.greet.bind(person); // 返回一个绑定 this 指向的函数
boundGreet(); // 输出：Hello, John Doe!
// 使用 new 创建对象并绑定 this 指向
function Person(name) {
this.name = name;
}
const person = new Person('Jane Doe');
console.log(person.name); // 输出：Jane Doe
结论
call、apply、bind 和 new 是 JavaScript 中功能强大的工具，可用于控制函数的 this 指向，从而实现各种各样的可能性。理解这些函数的使用方法和区别作用对于编写高效且可维护的代码至关重要。
常见问题解答
-
什么时候应该使用 call 而不是 apply？
- 使用
call当需要显式传递参数时，使用apply当参数存储在数组中时。
- 使用
-
bind 和 call 之间的区别是什么？
bind返回一个绑定this指向的新函数，而call立即执行函数。
-
new 方法与其他方法有何不同？
new方法用于创建新对象，并自动将this指向设置为该新对象的实例。
-
为什么在创建对象时需要 new 方法？
new方法通过调用构造函数来初始化对象的属性和方法，这是创建对象时所需的。
-
这些方法在实际开发中有什么应用场景？
- 这些方法广泛用于：
- 创建自定义对象并控制
this指向 - 实现继承和多态性
- 创建可重用和灵活的函数
- 创建自定义对象并控制
- 这些方法广泛用于：
