以下示例展示了詞法作用域的差異：

// 普通函數
function outer() {const outerVariable = "outer variable";// 嵌套箭頭函數const InnerArrow = () => {console.log(outerVariable); // 輸出: "outer variable"};innerArrow();
}outer();

綁定

箭頭函數和普通函數在綁定規則上也有所不同。普通函數中的 this 關鍵字綁定到函數本身，而箭頭函數中的 this 則繼承父作用域中的 this 值。這意味著箭頭函數內的 this 始終指向其外層函數的 this 值。

以下示例展示了綁定規則的差異：

// 普通函數
function outer() {const thisValue = this;// 嵌套普通函數const innerNORMal = function() {console.log(this === thisValue); // 輸出: True};// 嵌套箭頭函數const innerArrow = () => {console.log(this === thisValue); // 輸出: False};innerNormal();innerArrow();
}outer();

默認返回

箭頭函數具有一個默認的顯式返回。如果箭頭函數只有一行表達式，它會自動返回該表達式的結果。普通函數則需要使用 return 關鍵字顯式返回一個值。

以下示例展示了默認返回的差異：

// 箭頭函數
const multiplyArrow = (a, b) => a  b;// 普通函數
function multiplyNormal(a, b) {return a  b;
}console.log(multiplyArrow(2, 3)); // 輸出: 6
console.log(multiplyNormal(2, 3)); // 輸出: 6

何時使用

上一篇：箭頭函數vs普通函數理解它們的優勢和劣勢箭

下一篇：箭頭函數與普通函數之間關鍵差異的深入分析