2016-06-24 51 views
14

我最近切換到es6並開始在我的代碼中使用箭頭函數。 雖然重構我來到下面的代碼如何從javascript中的一個班輪箭頭函數返回匿名對象?

data.map(function(d) { 
    return {id: d.id, selected: bool}; 
}); 

跨越我上面的代碼更改爲這 -

data.map((d) => {id: d.id, selected: bool}); 

但我從上面的代碼中收到錯誤。我不知道這裏有什麼問題嗎? 我知道如果沒有代碼塊,那麼由箭頭函數提供隱式返回。

但不知道如何返回空對象或匿名對象的一些屬性初始化?

編輯:

,如果我這樣做有什麼不對這種方式?只是爲了好奇。

data.map((d) => new {id: d.id, selected: bool}); 
+2

這裏是一個有趣的稍微相關的閱讀,我在研究這個主題時發現https://rainsoft.io/when-not-to-use-arrow-functions-in-javascript/(尤其是第2點和第4點) – cregox

回答

27

看跌的括號周圍對象初始值:

data.map((d) => ({id: d.id, selected: bool})); 

括號對它們內部的表達式的值沒有影響,但他們有消除第一的歧義的句法作用包含表達式的標記。如果沒有括號,JavaScript解析器必須決定{標記是否意味着「Here starts a function body」或「Here starts a object initializer。」。它總是選擇前者(即一塊代碼)。

介紹了括號,因此,消除了困惑:是一家領先的(可以指的僅僅是「這裏來表達」,讓{括號只能是「來了一個對象初始化。」 (換句話說,不能在表達式中間放一段代碼;換句話說,如果你嘗試,那麼你會得到一個語法錯誤。)

+2

請問解釋編輯過的部分? – WitVault

+1

@WitVault使用'new'是錯誤的,因爲'new'只有當它是一個函數引用後才起作用。如果你嘗試過,你也會得到一個錯誤。 – Pointy

+1

你是對的我得到了錯誤。但只是想了解發生的事情。 – WitVault

0

({FOO巴})

您還可以使用

data.map((d) => { 
    return {id: d.id, selected: bool} 
});