ES6中的簡單解構陣列/對象

我想用選定的鍵返回新對象 - reqProps。我設法通過修復道具prop1，prop3來做到這一點，現在希望能夠通過reqProps數組值來替換prop1，prop3。我嘗試了函數，字符串文字和一些'黑客'。他們沒有工作ES6中的簡單解構陣列/對象

const data = [ 
    { 
    prop1: 1, 
    prop2: 2, 
    prop3: 3 
    }, 
    { 
    prop1: 10, 
    prop2: 20, 
    prop3: 30 
    }, 
    { 
    prop2: 200, 
    prop4: 400 
    }, 
    { 
    prop3: 3000 
    } 
]; 

// to return properties for the following... 
const reqProps = ['prop2','prop3','prop4']; 

// current implementation fixing return object with prop1, prop3 
const obj = data.map(({prop1, prop3}) => { 
    return {prop1, prop3}; 
});

的OBJ暫時的結果是

[{"prop1":1,"prop3":3},{"prop1":10,"prop3":30},{},{"prop3":3000}]

我不想使用循環，很喜歡解構的「權力」！ ;）

來源

2017-09-05 maciejk77

你到底想幹什麼？使用數組中的字符串解構？ – T4rk1n

如果你堅持解構，你必須使用eval：

const reqProps = ['prop2','prop3','prop4']; 

const literalString = '{'+reqProps.join(',')+'}'; 

const obj = data.map(new Function(literalString, 'return '+literalString));

你真的應該使用一個循環 - 你也可以把它藏在一個輔助功能或只是使用reduce。

來源

2017-09-05 22:01:04 Bergi

謝謝@Bergi，只有你的解決方案似乎工作 – maciejk77

正如@Bergi所說，你最好以某種方式使用循環。

下面是與隱式循環變體：

data.map(o => reqProps.filter(p => p in o) 
         .reduce((acc, p) => ({...acc, [p]: o[p]}), {}))

來源

2017-09-05 22:08:47 skovorodkin

ES6中的簡單解構陣列/對象

回答

相關問題