JavaScript 中 this 值的確定規則
1. 默認綁定（獨立函數調用）
當函數作為普通函數調用時，this 指向全局對象（瀏覽器中是 window，Node.js 中是 global），嚴格模式下是 undefined。
function showThis() {console.log(this);
}showThis(); // 瀏覽器中: window / 嚴格模式下: undefined
2. 隱式綁定（方法調用）
當函數作為對象的方法調用時，this 指向調用該方法的對象。
const obj = {name: 'Alice',greet: function() {console.log(`Hello, ${this.name}`);}
};obj.greet(); // "Hello, Alice" - this 指向 obj
3. 顯式綁定（call/apply/bind）
使用 call(), apply() 或 bind() 可以顯式設置 this 的值。
function greet() {console.log(`Hello, ${this.name}`);
}const person = { name: 'Bob' };greet.call(person); // "Hello, Bob"
greet.apply(person); // "Hello, Bob"const boundGreet = greet.bind(person);
boundGreet(); // "Hello, Bob"
4. new 綁定（構造函數調用）
使用 new 調用函數時，this 指向新創建的對象。
function Person(name) {this.name = name;
}const alice = new Person('Alice');
console.log(alice.name); // "Alice"
5. 箭頭函數
箭頭函數沒有自己的 this，它會捕獲所在上下文的 this 值。
const obj = {name: 'Charlie',greet: function() {setTimeout(() => {console.log(`Hello, ${this.name}`);}, 100);}
};obj.greet(); // "Hello, Charlie" - this 來自 obj
6. 事件處理函數
在 DOM 事件處理函數中，this 通常指向觸發事件的元素。
button.addEventListener('click', function() {console.log(this); // 指向 button 元素
});
優先級總結
new綁定- 顯式綁定（call/apply/bind）
- 隱式綁定（方法調用）
- 默認綁定
箭頭函數的 this 由外層作用域決定，不受上述規則影響。
