如今，ES6对数组进行进一步的拓展，给我们带来了更多的特性，使我们开发者在开发过程中更加方便。
总结
ES6为数组带来了很多实用的方法：
Array.of(),Array.from(),find(),findIndex(),fill(),entries(),values(),此外还有一个更简洁的语法：数组推导，能让我们更方便的生成一个新的数组。
Array.of() 函数
函数作用：将一组值，转换成数组。
Array.of(1,2,3,4,5);
//结果： [1,2,3,4,5]
是不是很好理解，传进去的数字是：1~5,最后经过Array.of函数的处理，得到一个数组，而数组的内容就是[1,2,3,4,5]。
Array.from() 函数
函数作用：可以将类似数组的对象或者可遍历的对象装换成真正的数组。
有哪些是类似数组的对象？最常见的就是调用getElementByTagName方法得到的结果，他就是类似数组的结果，getElementByTagName方法一定不陌生吧，我们来看下：
let ele = document.getElementByTagName("div")
ele instanceof Array; //结果：false
ele instanceof Object; //结果：true
看上面的代码，我们调用了document.getElementByTagName()方法，得到的结果存到变量ele中，然后对其进行类型判断，发现变量ele并不是一个数组，而是一个对象Array，一个类似数组的对象Object，接下来我们用Array.from()对其进行处理，并再一次进行类型判断。
Array.from(ele) instanceof Array;
//结果： true，是数组
这个时候我们运行的结果是：true，也就是经过Array.from函数处理返回的结果，已经变成一个真正的数组。
Array.from函数其中一个用处就是将字符串转换成数组。看下面案例：
let str = 'hello';
Array.from(str);
//结果：['h','e','l','l','o']
除了上述的两个静态的方法外，还新增了一些实例方法。
find()函数
函数作用：找出数组中符合条件的第一个元素
let arr = [1,2,3,4,5,6]
arr.find(function(value){
return value > 2
})
//结果 ：value = 3
看上面的代码，find()函数的参数是一个匿名函数，数组的每一个元素都会进入匿名函数执行，知道结果为true，find函数就会返回value值，要是所有的元素都不符合匿名函数的条件，find()函数就会返回undefind。
let arr = [1,2,3,4,5,6]
arr.find(function(value){
return value > 7
})
//结果 ：undefind
上面案例中，数组中没有存在大于7的元素，所以find函数就会返回：undefind。
findIndex()
函数作用：返回符合条件的第一个数组成员的位置。
let arr = [1,2,3,4,5,6]
arr.findIndex(function(value){
return value > 3
})
//结果 ：3
上面代码的结果是：3，因为数组元素中大于3的第一个元素是4。元素4的下标位置是3，要是所有的元素都不符合匿名函数的条件，findIndex()就会返回-1.
fill()函数
函数作用：用指定的值，填充到数组
let arr = [1,2,3];
arr.fill(4);
//结果：[4,4,4]
经过fill()函数处理后的arr已经变成了[4,4,4]；正如函数名fill(填充)一样，所有的元素都被填充为数字4了。当然如果我们只填充部分元素也是可以的。我们稍作调整下上面的案例：
let arr = [1,2,3];
arr.fill(4,1,3);
//结果：[1,4,4]
上面代码中的第二个参数和第三个参数的意思是：从位置1的元素开始填充数字4，截止到位置3之前，所以是位置1和位置2的元素被数字4填充了，得到的结果是[1,4,4]。
entries() 函数
函数作用：对数组的键值对进行遍历，返回一个遍历器，可以用for...of对其进行遍历。
遍历器的for...of也是ES6的新增特性，目前我们还没有介绍到，我们可以先进行一下简单的认知。
回到我们的entries()函数。看个例子:
for(let [i,v] of ['a','b'].entries()){
console.log(i,v);
}
// 0 'a'
// 1 'b'
上面的代码中，我们将entries()函数返回的一个遍历器，用for...of进行遍历，并打印出结果，能得到数组的键值：0和1，以及对应的数组元素： 'a'和'b'
如果只想遍历数组和索引键的话，可以使用另一个实例方法。
keys()函数
函数作用：对数组的索引值进行遍历，返回一个遍历器。
for(let index of ['a','b'].keys()){
console.log(index)
}
// 0
// 1
正如上面的运行结果一样，我们打印出了数组的索引值：0和1.
如果我们想只对数组的元素进行遍历，我们可以使用两一个实例方法。
values()函数
作用：对数组的元素进行遍历，返回一个遍历器。
for(let value of ['a','b'].values()){
console.log(value);
}
// a
// b
上面的代码运行结果也是我们意料之中的，最终打印出了数组的元素：a和b
除了新增函数以外，ES6还为数组带来了一个新的概念：数组推导。
数组推导
数组推导：用简洁的写法，直接通过现有的数组生成新的数组。
举个例子：假如我们有一个数组，我们在这个数组的基础上，每个元素乘以2，得到一个新的数组。
我们看看传统的实现方法：
var arr1 = [1,2,3,4];
var arr2 = [];
for(let i = 0;i<arr1.length; i++){
arr2.push(arr1[i]*2);
}
console.log(arr2)
//结果为：[2,4,6,8]
传统的方式，除了以上的方式，我们还可以用forEach方法实现。但我们现在介绍的主要是利用ES6提供的新写法：数组推导。
var arr1 = [1,2,3,4]
var arr2 = [for(i of arr1) i*2];
console.log(arr2)
//结果： [2,4,6,8]
我们同样可以的到数组arr2，他的值和上一段代码一样，并且代码量大大地减少了。这就是数组推导给我们带来的遍历。
在数组推导中，for...of后面还可以加上if语句，我们看看代码案例：
var arr1 = [1,2,3,4]
var arr2 = [for(i of arr1) if(i>3) i];
console.log(arr2)
//结果： [4]
在上面代码中，我们不再对数组的元素乘以2，而是用if做了个判断：数组的元素要大于3.所以运行的结果是：[4].
网友评论