ES6等同於lodash _.mapValues

Question

將lodash _.mapValues轉換為ES6有哪些不同的方法。

碼：

var fruits= {
  'apple':    { 'name': 'apple',    'number': 5},
  'orange': { 'name': 'orange', 'number': 10 }
};

_.mapValues(fruits, 'number');

輸出：

{ 'apple': 5, 'orange': 10 }

Answer 1

將對象的entries reduce到另一個對象中，僅從值中提取number ：

 var fruits= { 'apple': { 'name': 'apple', 'number': 5}, 'orange': { 'name': 'orange', 'number': 10 } }; console.log(Object.entries(fruits) .reduce((a, [key, { number }]) => { a[key] = number; return a; }, {} )); 

在較新的環境中，可以改為使用Object.fromEntries來映射到鍵值對數組數組，從而使其更加美觀：

 var fruits= { 'apple': { 'name': 'apple', 'number': 5}, 'orange': { 'name': 'orange', 'number': 10 } }; console.log(Object.fromEntries( Object.entries(fruits).map(([key, { number }]) => [key, number]) )); 

Answer 2

您可以使用for..in循環並將鍵和值從舊對象添加到新對象

 var fruits = { 'apple': { 'name': 'apple', 'number': 5 }, 'orange': { 'name': 'orange', 'number': 10 } }; let newObj = {}; for (let keys in fruits) { newObj[keys] = fruits[keys].number; } console.log(newObj) 

Answer 3

使用Array.reduce ， Object.entries和Object.assign

 var fruits= {'apple': { 'name': 'apple', 'number': 5},'orange': { 'name': 'orange', 'number': 10 }}; let result = Object.entries(fruits).reduce((a,[k,{number}]) => Object.assign(a, {[k]:number}), {}); console.log(result); 

Answer 4

ES6

您還可以使用Object.keys()和reduce()獲得所需的結果。

演示

 var fruits= { 'apple': { 'name': 'apple', 'number': 5}, 'orange': { 'name': 'orange', 'number': 10 } }; let result = Object.keys(fruits).reduce((r,v)=>Object.assign(r,{[v]:fruits[v].number}),{}); console.log(result); 

 .as-console-wrapper {max-height: 100% !important;top: 0;} 

Answer 5

以下是對其他答案的一些后續介紹，以便減速器不會使累加器對象發生變異。

const newObject = Object.entries(fruits)
  .reduce((acc, [fruitKey, { number }]) => ({
    ...acc,
    [fruitKey]: number,
  }), {}
));

使用spread ...acc語法是用於減少方法的功能更強大的編程樣式方法。