如何使用 arr.reduce() 访问对象的值 [关闭]答案

【问题标题】：How to access an Object's values using arr.reduce() [closed]如何使用 arr.reduce() 访问对象的值 [关闭]
【发布时间】：2022-01-24 13:05:38
【问题描述】：

我正在努力实现以下目标：

var arr = [
 {name: 'width', value: 10}, 
 {name: 'height', value: 20}, 
]

arr.reduce((ack, item)=>{
  ack.width = item.value
  ack.height = item.value
  return ack
},{})

//Expected output:

{width: 10, height: 20}

//Actual output:

{width: 20, height: 20}

也许我不明白 .reduce() 如何 100% 工作？

提前感谢您的帮助

【问题讨论】：

您的函数会依次用数组中每个项目的值覆盖宽度和。如果你想根据item.name有条件地做，那么你必须注意item.name！
这是对reduce的滥用。我希望人们停止使用reduce，它真的没那么酷：twitter.com/jaffathecake/status/1213077702300852224?lang=en
@morganney。我正在练习这个练习，因为我在几天前的编码面试中失败了。我同意你和 Twitter 上的帖子，即这种方法比其他专门针对像我这样的 Jr Dev 的方法更难阅读。我也希望人们不要再以这种方式使用reduce，尤其是在面试时。

标签： javascript arrays javascript-objects

【解决方案1】：

reduce 方法对数组的每个元素执行回调函数，因此在您的问题中，在每次迭代中，您都有一个包含 name 和 value 属性的对象。你可以这样实现你的目标：

let arr = [
 {name: 'width', value: 10}, 
 {name: 'height', value: 20}, 
]

let result = arr.reduce((ack, item)=>{
  ack[item.name] = item.value
  return ack
},{})

console.log(result);

【讨论】：

【解决方案2】：

也许我不明白 .reduce() 如何 100% 工作？

看起来如此。阅读docs

每次调用reducer 函数时-ack 是最后一次从reducer 返回的（如果是第一次传递，则返回初始值）并且 item 是当前 item。

这样做会有所帮助：

arr.reduce((ack, item)=>{
  console.log(ack); // this will help you understand
  ack[item.name] = ack[item.value]
  return ack
},{})

【讨论】：

【解决方案3】：

你需要把name作为key。

const
    array = [{ name: 'width', value: 10 }, { name: 'height', value: 20 }],
    result = array.reduce(
        (object, { name, value }) => ({ ...object, [name]: value }),
        {}
    );

console.log(result);

【讨论】：