使用带有箭头函数参数的 filter() 方法 [重复]答案

【问题标题】：Using filter() Method with Arrow-Function Arguments [duplicate]使用带有箭头函数参数的 filter() 方法 [重复]
【发布时间】：2018-08-18 13:04:35
【问题描述】：

我已经了解如何使用filter，但是看到这个练习的答案：Eloquent JavaScript 让我感到困惑（当您单击“查看解决方案”时，您可以看到代码。这两者之间有什么区别：

let counted = countBy(text, char => {
  let script = characterScript(char.codePointAt(0));
  return script ? script.direction : "none";
}).filter(({name}) => name != "none");

和：

let counted = countBy(text, char => {
    let script = characterScript(char.codePointAt(0));
    return script ? script.direction : "none";
}).filter(name => name != "none"); //The difference is here and when I tried this, it did not work

我熟悉的是使用... .filter(something => condition);，它会从原始数组中返回满足上述条件的所有项目的数组。我尝试将上面的代码更改为 ... .filter(script => script.name != "none") 并且它有效。那么({name}) 究竟做了什么让我不用输入那么长的内容呢？

【问题讨论】：

它看起来像解构。但我不确定{name} => name 是否有效。
我认为对象解构在箭头函数参数中使用时必须用括号括起来。
@CameronMartin 我已经修复了代码。如果没有大括号，它就不起作用，这只是在箭头函数参数中使用对象解构的规则吗？
@WealthyPlayer 我认为唯一可以省略括号的情况是参数只是一个标识符。所以在使用数组解构、对象解构和默认参数时需要括号。
@CameronMartin 我明白了，谢谢！

标签： javascript filter arrow-functions

【解决方案1】：

这就是对象解构的作用。不是将对象 x 传递到过滤器然后与 x.name 进行比较，而是直接解构 name。

.filter(({name}) => name != "none");

等价于

.filter(x => x.name != "none");

更多关于解构here

【讨论】：

我明白了，谢谢！之前在书上学过的对象解构忘记了，我再看一遍。