在函数定义周围参数方括号

Question

我碰到下面的代码在the Ember CLI website传来：

export default Ember.Helper.helper(function([value]) { 
    return value.toUpperCase(); 
}); 

什么困惑我的是周围的value参数的方括号。我可以在函数调用中理解它，但为什么在函数定义中？

Answer 1

这对我来说非常令人惊讶，但它似乎是有效的javascript，根据ECMAScript 2017语言规范，函数声明中的形式参数可以包含任何“绑定元素”，包括数组绑定。

https://tc39.github.io/ecma262/#prod-BindingElement

这个功能的实际行为似乎意味着参数的功能应该是一个数组，value将在数组中的第一个元素的值。

Answer 2

这是一个destructuring assignment。 @recursive描述的行为是正确的，但它可能有助于知道它不限于第一个元素。如果它被写有三个要素：

function xyz([a, b, c]){...}

则A，B和C都将被宣布为功能范围内可用的变量，在这种情况下，将等于第一数组的元素。此外 - 如果作为参数传递的数组没有至少三个元素，则参数（a，b和c）中指定的其余元素将存在作为声明，但将具有值undefined：

// Example 
function destructureThis([a, b, c]){ 
    console.log(a, b, c); 
} 

var shortArray = [1, 25]; 
destructureThis(shortArray); 

// Prints to console: 
// 1 25 undefined 

同样，如果参数数组较大，那么其他元素就会被忽略，正如已经提到的那样。

var longerArray = [1, 5, 9, 50, 60]; 
destructureThis(longerArray); 

// Prints to console: 
// 1 5 9 

而且......这是最近足够除了ECMAScript的规范，它应该在所有目标环境中测试，如果不使用巴贝尔或相当于transpile它向后兼容（你看IE）。