在 JavaScript 中，apply 和 call 是函數的兩個方法，用於顯式設置函數的 this 值，並傳遞參數來執行函數。它們的主要區別是傳遞參數的方式不同：

• call：參數逐個傳入。
• apply：參數以數組形式傳入。

適用情況

1. 動態設置 this 的上下文：當函數需要應用在不同的對象上時，可以使用 call 或 apply 修改。
2. 方法借用（Method Borrowing）：使用其他對象的方法處理當前對象的數據。
3. 多參數傳遞（apply）：當參數是數組或類似數組的結構（如 arguments）時，apply 非常方便。
4. 執行構造函數的代理（apply）：模擬 new 關鍵字的行為來創建對象。

apply 和 call 的範例

範例 1：動態設置 this

假設有一個通用的函數，我們希望在不同對象上使用它。

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

const person1 = { name: "Alice" };
const person2 = { name: "Bob" };

greet.call(person1, "Hello", "!"); // Hello, Alice!
greet.apply(person2, ["Hi", "."]); // Hi, Bob.

範例 2：方法借用

借用其他對象的方法來處理當前對象。

const arrayLike = {
  0: "a",
  1: "b",
  2: "c",
  length: 3
};

// 使用 Array.prototype 方法處理類數組對象
const result = Array.prototype.slice.call(arrayLike);
console.log(result); // ["a", "b", "c"]

範例 3：處理參數是數組的情況（apply 的優勢）

當參數已經是數組時，apply 可以直接使用它。

const numbers = [5, 6, 2, 3, 7];

// 使用 Math.max 和 apply 找出數組中的最大值
const max = Math.max.apply(null, numbers);
console.log(max); // 7

// 使用 Math.min 和 apply 找出數組中的最小值
const min = Math.min.apply(null, numbers);
console.log(min); // 2

範例 4：模擬 new 關鍵字（apply 的進階用法）

用 apply 來執行構造函數。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

function createNew(Constructor, args) {
  const obj = Object.create(Constructor.prototype);
  Constructor.apply(obj, args);
  return obj;
}

const person = createNew(Person, ["Alice", 25]);
console.log(person.name); // Alice
console.log(person.age); // 25

範例 5：結合 call 和 apply 的靈活性

用 call 和 apply 動態地修改函數行為。

function sum(a, b, c) {
  return a + b + c;
}

// 使用 call 傳遞逐個參數
console.log(sum.call(null, 1, 2, 3)); // 6

// 使用 apply 傳遞數組參數
console.log(sum.apply(null, [1, 2, 3])); // 6

區別和總結

• call：適合在參數固定，且需要一個接一個地傳入時使用。
• apply：適合參數是數組或類數組時，尤其在需要動態傳遞多個參數的情況下使用。

何時用 call，何時用 apply？

當你已經知道參數一個一個地傳入，使用 call：

someFunction.call(context, arg1, arg2, arg3);

當參數以數組形式存在時，使用 apply：

someFunction.apply(context, [arg1, arg2, arg3]);

兩者用途非常相似，可以根據數據形式選擇合適的方法。