為什麼帶有大括號的箭頭函數返回'undefined”，除非明確返回？

箭頭函數：理解缺失的回傳值

在 JavaScript 領域，箭頭函數已成為簡潔且富有表現力的熱門選擇程式碼。然而，使用函數體版本（帶有大括號）時可能會出現一個常見的陷阱。

問題：缺少回傳值

考慮下列箭頭函數：

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

呼叫時，此函數傳回未定義而非預期值。這是為什麼？

揭示隱含回傳

在箭頭函數中，當使用簡潔的函數體（不含花括號）時，會隱含應用 return 語句。這意味著括號內表達式的結果將成為傳回值。

簡明正文範例：

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

現在，呼叫此函數將傳回所需的字串：

console.log(f("testing")); // "TESTING"

函數的明確傳回Body

但是，當使用花括號時，需要明確的 return 語句來指示應該傳回什麼。否則，該函數將傳回未定義。

明確傳回範例：

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

呼叫此修改後的函數會產生相同的結果：

console.log(f("testing")); // "TESTING"

記住：隱式傳回存在於簡潔的箭頭函數體中，而顯式傳回存在在函數體中使用花括號時需要。理解這種差異對於避免程式碼中出現意外的未定義值至關重要。

以上是為什麼帶有大括號的箭頭函數返回'undefined”，除非明確返回？的詳細內容。更多資訊請關注PHP中文網其他相關文章！