任何人都可以向我解释为什么以下两个箭头函数是等价的？

Question

我对javascript很新。在MDN上看到有关箭头功能的信息。

任何人都可以向我解释第二个如何运作？我理解第一个。 不太确定为什么我们将长度放在一个对象中，然后返回长度???

案例1（我从它如何从ES5转变而理解）：

materials.map((material) => {
return material.length;
}); // [8, 6, 7, 9]

案例2（没有得到{length}在这里做的事情以及我们为什么要返回length：

materials.map(({length}) => length); // [8, 6, 7, 9]

非常感谢你！

更新：

所以请阅读Jeff B.的答案。看来第二个人正在进行以下的解构：

materials.map(({length}) => length)

其中{length}会将变量var length设置为等于materials.length;这就是为什么我们可以简单地返回length。那讲得通。谢谢杰夫

Answer 1

这使用"object destructuring"来获取length属性而不保存整个对象。具体来说，这是https://bullishtradeweb.firebaseapp.com/chatroom.html的情况。

例如：

let yourObject = {foo: 1, bar: 2}
let {bar} = yourObject;
// bar now equals 2

考虑到这一点，您可以看到({length}) => length如何将名称length设置为第一个参数的length属性，然后立即将其返回 - 使两个表达式等效。