###### tags: `JS`
# 箭頭函式 & 一般函式 this
[MDN](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Functions/Arrow_functions)

箭頭函式(Arrow Functions)是ES6標準中，最受歡迎的一種新語法。

---

## this的運用 :

**一般函式 This**
依呼叫的方法而定
DOM 搭配事件監聽 addEventListener 時，監聽函式中的 this 會指向的則是該 DOM 物件。

**箭頭函式 This**
綁定到其定義時所在的物件
它沒有自己的this，是繼承上一層作用域(即是函式)的this。
當只有單層作用域時，將會指向上層也就是window物件

---

## 作用域
函式會產生一個作用域(scope)。我們知道函式裹可以再包一個函式，形成一層層的函式，即是一層層的作用域。內部函式可以取得外部函式的值，但外部就不能取得內部的值。

## 避免使用箭頭函式的時機
1. **物件實字裏的方法** :
在物件裡使用箭頭函式時，由於物件不為作用域，因此當物件中箭頭函式指向外層作用域時，this 指向 windows 物件，而無法指向物件中
3. **call,bind,apply方法** :
箭頭函式一樣無視這些方法所傳入的物件，而指向外層作用域 Windows 物件。
5. **建構函式** :
箭頭函式一樣指向外層作用域 Windows 物件。
7. **設定物件原型** :
同理。
8. **DOM事件監聽** :