一. 扩展运算符
扩展运算符（spread）是三个点（...）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。
console.log(...[1, 2, 3]);
//1 2 3
console.log(1, ...[2, 3, 4], 5)
//1 2 3 4 5
//该运算符主要用于函数调用
function push(array, ...items){
array.push(...items)
}
function add(x, y){
return x + y;
}
var number = [4, 38];
add(...number); //42
扩展运算符与正常的函数参数可以结合使用，非常灵活。
function(v, w, x, y, z){}
var args = [0,1];
f(-1, ...args, 2, ...[3]);
//扩展运算符后面还可以放置表达式。
const arr = [
...(x > 0? ['a'] : []),
'b',
];
//如果扩展运算符后面是一个空数组，则不产生任何效果。
[...[], 1]
//[1]
二.替代数组的 apply 方法
由于扩展运算符可以展开数组，所以不再需要apply方法，将数组转为函数的参数了。
// ES5 的写法
function f(x, y, z){
// ...
}
var args = [0, 1, 2];
f.apply(null, args);
//ES6的写法
function f(x, y, z){
//...
}
var args = [0, 1, 2];
f(...args);
//es5的写法
Math.max.apply(null, [14, 3, 77]);
//es6
Math.max(...[14, 3, 77]);
等同于
Math.max(14, 4, 77 );
//es5的写法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
//es6
var arr1 = [0,1,2];
var arr2 = [3,4,5];
arr1.push(...arr2)
三. 扩展运算符的应用
1.合并数组
//es5
[1, 2].concat(more)
//es6
[1,2 ...more]
var arr1 = ['a', 'b'];
var arr2 = ['c'];
var arr3 = ['d', 'e'];
//es5
arr1.concat(arr2, arr3);
//['a', 'b', 'c', 'd', 'e']
//es6
[...arr1, ...arr2, ...arr3]
2.与解构赋值结合
扩展运算符可以与解构赋值结合起来，用于生成数组。
//es5
a = list[0], rest = list.slice(1)
//es6
[a, ...rest] = list
const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest// [2, 3, 4, 5]
const [first, ...rest] = [];
first // undefined
rest // []
const [first, ...rest] = ["foo"];
first // "foo"
rest // []
如果将扩展运算符用于数组赋值，只能放在参数的最后一位，否则会报错。
const [...butlast, last] = [1, 2, 3, 4, 5];
//报错
const [first, ...middle, last] = [1, 2, 3, 4, 5]
//报错
3.字符串
扩展运算符还可以将字符串转为真正的数组。
[...'hello']
//['h', 'e', 'l', 'l', 'o']
4.实现了 Iterator 接口的对象
任何 Iterator 接口的对象（参阅 Iterator 一章），都可以用扩展运算符转为真正的数组
var nodelist = document.querySelectorAll('div');
var array = [...nodeList];
5.Map 和 Set 结构，Generator 函数
扩展运算符内部调用的是数据结构的 Iterator 接口，因此只要具有 Iterator 接口的对象，都可以使用扩展运算符，比如 Map 结构。
let map = new Map(
[[1, 'one'], [2, 'two'], [3, 'three']]
);
let arr = [...map.keys()];
//[1, 2, 3]
Generator 函数运行后，返回一个遍历器对象，因此也可以使用扩展运算符。
var go = function*(){
yield 1;
yield 2;
yield 3;
};
[...go()] // [1, 2, 3]
四. Array.from()
Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map）。
let arrayLike = {
'0' : 'a',
'1' : 'b',
'2' : 'c' ,
length : 3
}
//es5的写法
var arr1 = [].slice.call(arrayLike);
//['a', 'b', 'c']
//es6的写法
var arr2 = Array.from(arrayLike);
//['a', 'b', 'c']
//NodeList对象
let ps = document.querySelectorAll('p');
Array.from(ps).forEach(function(p){
console.log(p);
});
// arguments对象
function foo(){
var args = Array.from(arguments);
//....
}
只要是部署了Iterator接口的数据结构，Array.from都能将其转为数组。
Array.from('hello');
// ['h', 'e', 'l', 'l', 'o']
let namesSet = new Set(['a', 'b']);
let namesSet = new Set(['a', 'b']);
Array.from(namesASet) // ['a', 'b']
Array.from还可以接受第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。
Array.from(arrayLike, x => x * x);
//等同于
Array.from(arrayLike).map(x => x * x)
Array.from([1, 2, 3], (x) => x * x)
//[1, 4, 9]
五 .Array.of()
Array.of方法用于将一组值，转换为数组。
Array.of(3, 11, 8);
//[3, 11, 8]
Array.of(3);
//[3]
Array.of(3).length //1
Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]
Tips:上面代码中，Array方法没有参数、一个参数、三个参数时，返回结果都不一样。只有当参数个数不少于2个时，Array()才会返回由参数组成的新数组。参数个数只有一个时，实际上是指定数组的长度。
Array.of基本上可以用来替代Array()或new Array()，并且不存在由于参数不同而导致的重载。
Array.of() // []
Array.of(undefined)
//[undefined]
Array.of(1) // [1]
Array.of(1, 2) // [1, 2]
Array.of总是返回参数值组成的数组。如果没有参数，就返回一个空数组。
六.数组实例的 copyWithin()
数组实例的copyWithin方法，在当前数组内部，将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组。也就是说，使用这个方法，会修改当前数组。
它接受三个参数。
target（必需）：从该位置开始替换数据。
start（可选）：从该位置开始读取数据，默认为0。如果为负值，表示倒数。
end（可选）：到该位置前停止读取数据，默认等于数组长度。如果为负值，表示倒数。
[1, 2, 3, 4, 5].copyWithin(0, 3);
//[4, 5, 3, 4, 5]
[1, 2, 3, 4, 5].copyWithin(0, 3, 4);
//[4 , 2, 3, 4 , 5]
[1, 2, 3, 4, 5].copyWithin(0, -2, -1);
//[4 , 2, 3, 4 , 5]
六. 数组实例的 find() 和 findIndex()
数组实例的find方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。
[1, 4, -5, 10].find((n) => n < 0)
// -5
//find方法的回调函数可以接受三个参数，依次为当前的值、当前的位置和原数组。
[1, 5, 10, 15].find(function(value, index, arr){
return value > 9;
})
// 10
数组实例的findIndex方法的用法与find方法非常类似，返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。
[1, 5, 10, 15].findIndex(function(value, index, arr){
return value > 9;
});// 2
七. 数组实例的fill()
fill方法使用给定值，填充一个数组。
['a', 'b', 'c'].fill(7);
//[7, 7, 7]
new Array(3).fill(7);
//[7,7,7]
fill方法用于空数组的初始化非常方便。数组中已有的元素，会被全部抹去。
fill方法还可以接受第二个和第三个参数，用于指定填充的起始位置和结束位置。
八 .数组实例的 entries()，keys() 和 values()
ES6 提供三个新的方法——entries()，keys()和values()——用于遍历数组。
可以用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历。
for(let index of ['a', 'b'].keys()){
console.log(index);
}
//0
//1
for(let elem of ['a', 'b'].values()){
console.log(elem);
}
// 'a'
// 'b'
for(let [index, elem] of ['a', 'b'].entries()){
console.log(index, elem);
}
// 0 'a'
// 1 'b'
如果不使用for...of循环，可以手动调用遍历器对象的next方法，进行遍历。
let letter = ['a', 'b', 'c'];
let entries = letter.entries();
console.log(entries.next().value); // [0, 'a']
console.log(entries.next().value);//[1, 'b']
console.log(entries.next().value); //[2, 'c']
九. 数组实例
Array.prototype.includes方法返回一个布尔值，表示某个数组是否包含给定的值，与字符串的includes方法类似。ES2016 引入了该方法。
[1, 2, 3].includes(2) // true
[1, 2, 3].includes(4) // false
[1, 2, NaN].includes(NaN) // true
十. 数组的空位
>数组的空位指,数组的某一个位置没有任何值.比如, Array构造函数返回的数组都是空位.
Array(3) // [, , ,]
//Array返回一个具有3个空位的数组
Tips: 空位不是undefined，一个位置的值等于undefined，依然是有值的。空位是没有任何值，in运算符可以说明这一点。
0 in [undefined, undefined, undefined] // true
0 in [, , ,] // false
forEach(), filter(), every() 和some()都会跳过空位。
map()会跳过空位，但会保留这个值
join()和toString()会将空位视为undefined，而undefined和null会被处理成空字符串。
[, a].forEach((x, i) => console.log(i)); // 1
['a' , , 'b'].filter(x => true) // ['a' , 'b'] // ['a', 'b']
[, 'a'].every(x => x === 'a') // true
[, 'a'].some(x => x !== 'a') // false
[, 'a'].map( x => 1) // [, 1]
[, 'a', undefined, null].join('#') // #a##
[, 'a', undefined, null].toString() // ',a,,'
Array.form(['a', , 'b']);
//['a', undefined, 'b']
//Array.from方法会将数组的空位，转为undefined
[...['a', , 'b']]
//['a', undefiend, 'b']
//扩展运算符（...）也会将空位转为undefined。
[, 'a', 'b', ,].copyWithin(2, 0)
//[, 'a',,'a']
new Array(3).fill('a') // ['a', 'a', 'a']
let = arr = [, , ]
for(let i of arr){
console.log(i);
}
//1
//1
entries()、keys()、values()、find()和findIndex()会将空位处理成undefined。
