JS: this

this 這個特別的變數或說關鍵字，一樣也是在建立函式的執行環境(execution context)的時候就會一起建立，但因為箭頭函式(arrow function)沒有自己的this，所以只有一般函式（function declaration, function expression）會有this關鍵字。

在介紹不同環境的this究竟是指向誰之前，首先有幾個點要注意：

• 大致來說，this 指的是「有該函式的擁有者」，這一點等會在說明this指向就會一目瞭然；
• this 不會指向函式本身，而且也不會指向函式的variable environment object；
• this 不是靜態(static)的，this 的值取決於函式是如何被呼叫，而且只有在函式真的被呼叫的時候才會有值（意即，函式宣告時this並沒有值）
  

---

接著就來分析函式在不同情況下被呼叫時，this 的值為何？ 以下共分為六種狀況：

1. 物件方法(method)：此時this指的是呼叫這個函式方法的物件本身。

2. 一般的函式呼叫(general function call)：此時的this值為 undefined；不過在嚴格模式(strict mode)下，this是指window object。

3. 箭頭函式(arrow function)：箭頭函式沒有自己的this，箭頭函式的this值是指箭頭函式所在位置(lexical this)或者周圍距離最近函式

   • 譬如箭頭函式是在全域範疇被呼叫，則此時的this值就是window object。
   • 或者箭頭函式是在一個物件方法被呼叫，這時距離這個箭頭函式最近的函式即"物件方法"，物件方法的this會指向物件本身，所以這個箭頭函式的this就是物件本身。

4. 事件監聽器(event listener)：this指的是呼叫這個事件的DOM物件元素。

5. call、apply、bind：一般來說，this的值即是call、apply或bind綁定的物件。

6. new：用new關鍵字創建的物件。

---

References The Complete JavaScript Course 2023: From Zero to Expert!