Question

之间有什么区别

function updateSomething(item) {}

和

function updateSomething({items}) {}

？第一个中的item变量也可以是一个对象，为什么第二个使用对象表示法呢？我什么时候应该使用第一个和后一个？

Answer 1

这是参数解构，来自ES2015。在第二种情况下，您将局部变量初始化为参数的items属性的值。

function updateSomething({items}) {

大致相当于

function updateSomething(obj) {
     var items = obj.items;

其他一些示例here和here。

来自MDN：Pulling fields from objects passed as function parameter

请注意，此语法在Edge或Safari中尚未提供（请参阅compatibility map），因此您可能希望使用Babel之类的转录程序。

Answer 2

第二个例子是使用ES6参数解构的简写来从第一个参数中提取item属性，假设它是一个对象：

function destructure({item}) {
  console.log(item);
}

destructure({item: 3}); // logs "3"

ES5的等价物是：

function destructure(arg1) {
  var item = arg1.item; // or throw
  ...
}

This blog post by 2ality有一个很好的解构，参数以及它们如何一起玩的文章。

如果destructure的第一个参数没有item属性，则会抛出错误。

您可以使用以下命令指定要构造的参数或将其与默认值组合：

function ({foo, bar} = param) {
  console.log(foo, bar); // the rest of param is not available
}

function ({foo, bar = 11} = param) {
  console.log(foo, bar); // bar will be 11 if it was not set in param
}

此语法有许多变体，但它与对象速记语法相对应：

const item = 3;
destructure({item}); // creates an object like {item: item}

带有对象表示法的javascript函数参数

2 个答案: