為什麼有些箭頭函數回傳'undefined”，而有些則不回傳？

理解箭頭函數的回傳值：顯式與隱式的困境

ES6 中引入的箭頭函數因其語法簡潔，靈活性強。然而，在處理回傳值時，困擾新手程式設計師的一個常見陷阱會出現。

考慮以下箭頭函數：

const f = arg => { arg.toUpperCase(); };

呼叫時，此函數意外傳回 undefined。為什麼會發生這種情況？

簡潔箭頭函數中的隱式回傳

箭頭函數提供兩種不同的語法變體：沒有大括號的簡潔形式和帶有大括號的更詳細形式大括號。簡潔的形式隱式傳回主體表達式的結果，無需顯式的 return 語句。因此，像 arg => 這樣的箭頭函數arg.toUpperCase();自動傳回大寫的參數。

花括號箭頭函數中的明確傳回

另一方面，帶有花括號的箭頭函數使用傳統的函數體。在這種情況下，沒有隱式返回。若要從這類箭頭函數取得值，必須使用明確 return 語句。修改我們先前的範例：

const f = arg => { return arg.toUpperCase(); };

現在，該函數將正確傳回大寫的參數。或者，我們可以透過省略大括號來使用更簡潔的形式：

const f = arg => arg.toUpperCase();

在這種情況下，箭頭函數隱式傳回表達式的結果，也就是大寫的參數。

透過了解箭頭函數中隱式傳回和明確傳回之間的區別，您可以避免在處理它們的傳回值時出現的陷阱。

以上是為什麼有些箭頭函數回傳'undefined”，而有些則不回傳？的詳細內容。更多資訊請關注PHP中文網其他相關文章！