ES6のjavascriptの構文エラーアレイマップのハッシュ

Question

これは愚かな質問ですが、ここではちょっと迷っています。

前提

let groups = [ 
    {id: 1, name: '123'}, 
    {id: 2, name: '456'} 
] 

そして、私はそれがエラーを起こし、なぜ私は理解していないこの

[ 
    {value: 1, label: '123'}, 
    {value: 2, label: '456'} 
] 

出力したいです。

groupOptions = groups.map(item => 
    {value: item.id, label: item.name} 
) 

Answer 1

()に返されたオブジェクトをラップします。 With ()中括弧は矢印関数の本体とみなされ、本文の中で式は無効です。

let groups = [ 
 
    {id: 1, name: '123'}, 
 
    {id: 2, name: '456'} 
 
] 
 

 
var groupOptions = groups.map(item => 
 
    ({value: item.id, label: item.name}) 
 
); 
 

 
console.log(groupOptions);

Answer 2

let groups = [ 
 
    {id: 1, name: '123'}, 
 
    {id: 2, name: '456'} 
 
] 
 
var output = groupOptions = groups.map(item => 
 
    {return {value: item.id, label: item.name}} 
 
) 
 

 
console.log(output);

あなたは{}で地図のコールバックのコードをラップする必要があります。

let groups = [ 
    {id: 1, name: '123'}, 
    {id: 2, name: '456'} 
] 
groupOptions = groups.map(item => 
    {return {value: item.id, label: item.name}} 
) 

Answer 3

あなたはdestructure場合、それはもう少しきれいですitemあなたのmapコールバックの議論：

let groups = [ 
    {id: 1, name: '123'}, 
    {id: 2, name: '456'} 
] 
var output = groupOptions = groups.map(({id,name}) => 
    ({value:id, label:name}) 
); 

// or you can do the mapping right in the arguments: 

var output = groupOptions = ggroups.map(({id:value,name:label}) => 
    ({value, label}) 
);