Question

我正在尝试了解Arrow functions上打字稿中的箭头功能

var elements = [
  'Hydrogen',
  'Helium',
  'Lithium',
  'Beryllium'
];

elements.map(function(element) { 
  return element.length; 
}); // [8, 6, 7, 9]

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

elements.map(element => element.length); // [8, 6, 7, 9]

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

除了最后一行，我了解所有内容。在第二行中，它接受一个表达式并返回element.length。等效于{return element.length;}。但是最后一句话对我来说毫无意义。

我不明白的事情：

正在获取对象length。
如果它是单个参数，为什么在()中使用它。

Answer 1

如果您查看最后一行：

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

在{参数周围有大括号}，length。

这称为对象解构分配：
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring

Answer 2

Map正在破坏传递给它的参数。在这种情况下，将字符串传递给map函数，并且字符串具有许多属性，其中之一是length。因此，将字符串解构，并将其属性length设置为解构的length变量。 +1到JulianG ...

了解打字稿中的箭头功能

2 个答案: