一、簡介
在 JavaScript 中，函數是物件，因此它們有內建方法可以用來控制執行方式。
這些方法包括 .call()、.apply() 和 .bind()，主要用來改變函數執行時的 this 指向或傳遞參數，特別在物件導向或繼承中很有用。
二、主要函數方法
1. .call(thisArg, arg1, arg2, ...)
立即執行函數，並指定 this 的值，參數逐個傳入。
function greet(greeting) {
console.log(`${greeting}, I'm ${this.name}`);
}
const person = { name: "Alice" };
greet.call(person, "Hello"); // "Hello, I'm Alice"
解析：
- thisArg：指定 this 指向 person。
- arg1：傳入 "Hello" 作為 greeting。
實際應用：借用其他物件的方法
const person1 = {
name: "Alice",
greet: function() {
console.log(`Hi, ${this.name}`);
}
};
const person2 = { name: "Bob" };
person1.greet.call(person2); // "Hi, Bob"
2..apply(thisArg, [args])
與 .call() 類似，立即執行函數並指定 this，但參數以陣列形式傳入。
function introduce(greeting, time) {
console.log(`${greeting}, I'm ${this.name}, it's ${time}`);
}
const person = { name: "Bob" };
introduce.apply(person, ["Hey", "morning"]); // "Hey, I'm Bob, it's morning"
解析：
- thisArg：this 指向 person。
- [args]：陣列 ["Hey", "morning"] 分解為 greeting 和 time。
與 .call() 的差異：
- .call()：逐個傳參（arg1, arg2, ...）。
- .apply()：參數用陣列（[arg1, arg2, ...]）。
實際應用：處理動態參數
const numbers = [1, 2, 3, 4];
console.log(Math.max.apply(null, numbers)); // 4
3. .bind(thisArg, arg1, arg2, ...)
不立即執行，而是返回一個新函數，永久綁定指定的 this 和部分參數。
function sayHello(greeting) {
console.log(`${greeting}, I'm ${this.name}`);
}
const person = { name: "Charlie" };
const boundFn = sayHello.bind(person, "Hola");
boundFn(); // "Hola, I'm Charlie"
解析：
- thisArg：this 永久綁定到 person。
- arg1：預設 "Hola" 作為 greeting。
- 返回新函數，可後續調用。
與 .call() / .apply() 的差異：
- .call() 和 .apply() 立刻執行，.bind() 只綁定不執行。
實際應用：事件處理
const obj = {
name: "Dog",
bark: function() {
console.log(`${this.name} says woof`);
}
};
const boundBark = obj.bark.bind(obj);
setTimeout(boundBark, 1000); // 1秒後 "Dog says woof"
三、注意事項
1. .call() 和 .apply() 的 thisArg 若為 null 或 undefined：
在非嚴格模式下，this 指向全域物件（window 或 global）。
在嚴格模式下，this 保持 null 或 undefined。
"use strict";
function checkThis() {
console.log(this);
}
checkThis.call(null); // null
2..bind() 的綁定是永久的：
後續無法用 .call() 或 .apply() 改變 this
const bound = sayHello.bind({ name: "Fixed" });
bound.call({ name: "New" }); // "Hola, I'm Fixed"（不會變成 New）
3.效能考量：
.bind() 創建新函數，若大量使用可能增加記憶體負擔。
四、小結
.call()：立即執行，指定 this，逐個傳參。
.apply()：立即執行，指定 this，陣列傳參。
.bind()：返回新函數，綁定 this 和部分參數。
用途：控制 this，實現方法借用或繼承。
