花括号是否改变了这个函数的读法

Question

我正在编写一个函数，使用 concat 和 reduce 方法将 eloquent javascript 中的数组展平。当我这样写代码时：

    function flatten(args){
       return args.reduce((current,i) =>{
           current.concat(i);
       },[] );
   }

   let arrays = [[1, 2, 3], [4, 5], [6]];
   console.log(flatten(arrays));

我收到以下错误：

current.concat(i);
                ^

TypeError: Cannot read property 'concat' of undefined

但是当我去掉本节中的花括号“{}”时：

之前：

return args.reduce((current,i) =>{
        current.concat(i);
    },[] );

之后：

return args.reduce((current,i) =>
        current.concat(i)
    ,[] );
}

它打印出来很好。当查找初始化为 0 的总和时，此格式工作正常。concat 方法是否无法识别位于大括号“{}”内的 []。

Answer 1

简短回答：是的，它是不同的。您的减速器需要 return 函数中的一个值。 current 参数的值等于调用最后一个 reduce 函数调用的最后一个 return。在第一次调用中，current 参数等于 reduce 函数调用的第二个参数中指定的初始值（即 []）。

显式 returning current 与支撑版本也可以解决问题：

function flatten(args) {
   return args.reduce((current, i) => {
       return current.concat(i);
   }, []);
}

没有大括号，return 隐式地 returning 由 concat 表达式编辑的值 return，这是一个新数组。

有关箭头函数如何工作的更多信息，请查看 MDN's Arrow functions article。具体来说，本节讲一下它是如何隐含的：

(param1, param2, …, paramN) => expression
// equivalent to: => { return expression; }

以及本节：

// When the only statement in an arrow function is `return`, we can remove `return` and remove
// the surrounding curly brackets
elements.map(element => element.length); // [8, 6, 7, 9]

花括号是否改变了这个函数的读法

does the curly braces change the reading of this function

javascript

arrays

concat

reduce