这是我参与8月更文挑战的第2天，活动详情查看：8月更文挑战
前言
ES6中新增了一些数组的方法，有些方法弥补了ES5中的一些不足，具体哪些不足下面会讲到。这次就先浅谈一下ES6中新增的一些常用的数组方法，做个总结，说的有问题的地方，大家可以在评论区指出。具体的其他新增方法的定义及使用也可以去看ES6官网，点这里
扩展运算符
- 扩展运算符是三个点（
...）,将一个数组转为用逗号分隔的参数序列。console.log(...[1, 2, 3]) // 1 2 3 console.log([...[1, 2, 3]]) // [1, 2, 3] function fun(x, y) { console.log(x + y) // 32 } fun(...[4, 28])const arr1 = [1, 2, 3] const arr2 = arr1 // 浅拷贝 arr1[0] = 5 console.log(arr2) // [5, 2, 3],修改值会相互影响ES5中实现数组的深拷贝const arr1 = [1, 2, 3] const arr2 = arr1.concat() arr1[0] = 5 console.log(arr2) // [1, 2, 3]ES6中实现数组的深拷贝const arr1 = [1, 2, 3] const arr2 = [...arr1] arr1[0] = 5 console.log(arr2) // [1, 2, 3]
Array.from()
-
该方法是
Array对象上的方法，非原型方法。将类似数组的对象（数组是特殊的对象）装化为数组。类数组对象：一个普通的对象,（数组是特殊的对象）,里面的属性名也是由有序数字组成，并且也有一个
length属性，那这个对象就是一个类数组对象。比如常见的DOM集合，或者手写的一个对象，里面包含数字属性，和length属性。<p class="p">1</p> <p class="p">2</p> <p class="p">3</p> <p class="p">4</p>const items = document.getElementsByClassName('p') console.log(items) // ES5中的方法 console.log([].slice.call(items)); // 这两个都是ES6中的方法 console.log(Array.from(items)) console.log([...items])
Array.of()
Array.of()方法用于将一组值，转换为数组。Array.of(3, 4,5) // [3,4,5] Array.of(3) // [3] Array.of(3).length // 1ES6中，Array.of()基本上可以用来替代Array()或new Array()，并且不存在由于参数不同而导致的数组差异。它的行为非常统一。Array(3) // [,,,] Array(1, 3) // [1,3] Array(1, 3, 4) // [1,3,4]
find()和findIndex()
-
find()是找出第一个符合条件的数组成员，它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。 -
findIndex()是返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。 -
indexOf()是在ES5中，提供了来查找数组元素的位置。该方法有个缺陷就是，如果数组中包含元素NaN，也是找不到，返回-1。const arr = [1, 2, 4, NaN] console.log(arr.find(e => e < 4)) // 返回该成员 1 console.log(arr.indexOf(4)) // 2 console.log(arr.indexOf(NaN)) // -1,没找到 console.log(arr.findIndex(e => Object.is(NaN, e))) // 3扩展：
Object.is(value1, value2)):判断value1,value2是否相等，返回一个布尔值，这个“相等”的规则，既不是===,也不是==。可以判断出NaN相等于NaN。（其实NaN与任何一个数都不相等）,indexOf()它内部使用严格相等运算符（===）进行判断，这会导致对NaN的误判。所以可以将
ES6中的findIndex()来替代ES5的indexOf()。
Array.prototype.fill()
-
用一个固定值，替换数组的所有元素，可以写位置，从哪里替换掉哪里，但是不包括终止位置。
['a', 'b', 'c'].fill(7) // [7, 7, 7] new Array(3).fill(7) // [7, 7, 7]这里要注意一下的就是，如果要替换为对象或者数组，因为是浅拷贝过去的，所以操作的是同一块内存地址，修改某一方的值会受到影响。
const arr = [1, 2, 4, NaN] const obj = { aaa: 111 } arr.fill(obj, 0, 1) console.log(arr) // [{aaa:111},2,4,NaN] arr[0].aaa = 222 console.log(obj) // {aaa:222}
Array.prototype.includes()
- 该方法返回一个布尔值，表示某个数组是否包含给定的值。与字符串的
includes()方法类似。[1, 2, 3].includes(2) // true [1, 2, 3].includes(4) // false // ES6中 [1, 2, NaN].includes(NaN) // true // ES5中 [1, 2, NaN].indexOf(NaN) // -1 if([1, 2, NaN].indexOf(e) !== -1){ // 找到了 }ES5中，使用的是上文提到过的indexOf(),而且还不能判断能不能找得到NaN。
最后
方法总是在不断更新，可以通过比较差异，来思考一下，为什么会新增这些方法，优化了哪些的功能。
