11.6 参数解构示例

11.6.1 提示：箭头函数中单个参数两边的括号

在后面的内容中，我会偶尔使用箭头函数。因此，一个快速的提示：如果一个箭头函数只有一个参数，并且那个参数是一个标识符，你可以省略参数两边的括号。例如，在下面的 REPL 交互中， x 两边没有括号：

> [1,2,3].map(x => 2 * x)
[ 2, 4, 6 ]

然而，当单个参数不是一个标识符的时候必须带上括号：

> [[1,2], [3,4]].map(([a,b]) => a + b)
[ 3, 7 ]

> [1, undefined, 3].map((x='yes') => x)
[ 1, 'yes', 3 ]

更多详细内容在箭头函数那一章有讲解。

11.6.2 forEach() 和解构

在 ECMAScript 6 中你可能将会大量使用 for-of 循环，但是数组方法 forEach() 同样从解构中获益。更精确地说，它的回调函数获益了。

第一个例子：在数组中解构数组。

let items = [ ['foo', 3], ['bar', 9] ];
items.forEach(([word, count]) => {
    console.log(word+' '+count);
});

第二个例子：解构数组中的对象。

let items = [
    { word:'foo', count:3 },
    { word:'bar', count:9 },
];
items.forEach(({word, count}) => {
    console.log(word+' '+count);
});

11.6.3 转换 Map

一个 ECMAScript 6 Map 没有 map() 方法（像数组一样的）。因此，必须要这样：

• 1、转换成一个 [key,value] 对的数组。
• 2、在数组上调用 map() 方法。
• 3、将结果转换回 Map 。

这个过程看起来像下面这样。

let map0 = new Map([
    [1, 'a'],
    [2, 'b'],
    [3, 'c'],
]);

let map1 = new Map( // step 3
    [...map0] // step 1
    .map(([k, v]) => [k*2, '_'+v]) // step 2
);
// Resulting Map: {2 -> '_a', 4 -> '_b', 6 -> '_c'}

11.6.4 处理通过 Promise 返回的数组

工具方法 Promise.all() 以如下方式运作：

• 输入：一组 Promises 。
• 输出：在最后输入的 Promise 返回了的时候，就会有一个 Promise 返回一个数组，这个数组包含了输入的 Promises 返回的结果。

解构可以帮助处理 Promise.all() 最终返回的数组：

let urls = [
    'http://example.com/foo.html',
    'http://example.com/bar.html',
    'http://example.com/baz.html',
];

Promise.all(urls.map(downloadUrl))
.then(([fooStr, barStr, bazStr]) => {
    ···
});

// This function returns a Promise that resolves to
// a string (the text)
function downloadUrl(url) {
    return fetch(url).then(request => request.text());
}

fetch() 就是一个基于 Promise 的 XMLHttpRequest 。这是 Fetch 标准的一部分。