改变自身值的方法(9个)

基于ES6，改变自身值的方法一共有9个，分别为pop、push、reverse、shift、sort、splice、unshift，以及两个ES6新增的方法copyWithin 和 fill。

不会改变自身的方法(9个)

基于ES7，不会改变自身的方法一共有9个，分别为concat、join、slice、toString、toLocateString、indexOf、lastIndexOf、未标准的toSource以及ES7新增的方法includes。

遍历方法(12个)

基于ES6，不会改变自身的方法一共有12个，分别为forEach、every、some、filter、map、reduce、reduceRight 以及ES6新增的方法entries、find、findIndex、keys、values。

改变自身值的方法(7个):pop、 push、 shift 、unshift 、splice、 reverse 、sort

pop

pop() 方法删除一个数组中的最后的一个元素，并且返回这个元素。如果是栈的话，这个过程就是栈顶弹出。

push

push()方法添加一个或者多个元素到数组末尾，并且返回数组新的长度。如果是栈的话，这个过程就是栈顶压入。

reverse

reverse()方法颠倒数组中元素的位置，第一个会成为最后一个，最后一个会成为第一个，该方法返回对数组的引用。返回一个新数组，并且改变原数组

unshift

unshift() 方法用于在数组开始处插入一些元素(就像是栈底插入)，并返回数组新的长度。

shift

shift()方法删除数组的第一个元素，并返回这个元素。如果是栈的话，这个过程就是栈底弹出。

sort

sort()方法对数组元素进行排序，并返回这个数组。返回一个新数组，并且改变原数组

splice

splice()方法用新元素替换旧元素的方式来修改数组。它是一个常用的方法，复杂的数组操作场景通常都会有它的身影，特别是需要维持原数组引用时，就地删除或者新增元素，splice是最适合的。

start 指定从哪一位开始修改内容。如果超过了数组长度，则从数组末尾开始添加内容；如果是负值，则其指定的索引位置等同于 length+start (length为数组的长度)，表示从数组末尾开始的第 -start 位。

deleteCount 指定要删除的元素个数，若等于0，则不删除。这种情况下，至少应该添加一位新元素，若大于start之后的元素总和，则start及之后的元素都将被删除。

itemN 指定新增的元素，如果缺省，则该方法只删除数组元素。

返回值 由原数组中被删除元素组成的数组，如果没有删除，则返回一个空数组。

arr.splice(  start,  deleteCount[, item1[, item2[, …]]])

vararray = ["apple","boy"];

varsplices = array.splice(1,1);

console.log(array);// ["apple"]

console.log(splices);// ["boy"] ,可见是从数组下标为1的元素开始删除,并且删除一个元素,由于itemN缺省,故此时该方法只删除元素

array = ["apple","boy"];

splices = array.splice(2,1,"cat");

console.log(array);// ["apple", "boy", "cat"]

console.log(splices);// [], 可见由于start超过数组长度,此时从数组末尾开始添加元素,并且原数组不会发生删除行为

array = ["apple","boy"];

splices = array.splice(-2,1,"cat");

console.log(array);// ["cat", "boy"]

console.log(splices);// ["apple"], 可见当start为负值时,是从数组末尾开始的第-start位开始删除,删除一个元素,并且从此处插入了一个元素

array = ["apple","boy"];

splices = array.splice(-3,1,"cat");

console.log(array);// ["cat", "boy"]

console.log(splices);// ["apple"], 可见即使-start超出数组长度,数组默认从首位开始删除

array = ["apple","boy"];

splices = array.splice(0,3,"cat");

console.log(array);// ["cat"]

(12)fill()

语法：arr.fill(value, start[, end = this.length])

fill() 方法同样用于数组元素替换，它可将数组指定区间内的元素替换为某个值。

value 指定被替换的值，start 指定替换元素起始的索引，end 可选，指的是替换元素结束位置的索引。

如果start为负，则其指定的索引位置等同于length+start，length为数组的长度。end也是如此。

不会改变自身的方法(8个)：concat、 join、 slice 、toString 、toLocaleString 、indexOf、 lastIndexOf 、includes

concat

concat() 方法将传入的数组或者元素与原数组合并，组成一个新的数组并返回。

join

join() 方法将数组中的所有元素连接成一个字符串。

语法：arr.join([separator = ‘,’]) separator可选，缺省默认为逗号。

vararray = ['We','are','Chinese'];

console.log(array.join());// "We,are,Chinese"

console.log(array.join('+'));// "We+are+Chinese"

console.log(array.join(''));// "WeareChinese"

slice

slice() 方法将数组中一部分元素浅复制存入新的数组对象，并且返回这个数组对象。

语法：arr.slice([start[, end]])

参数 start 指定复制开始位置的索引，end如果有值则表示复制结束位置的索引（不包括此位置）。

如果 start 的值为负数，假如数组长度为 length，则表示从 length+start 的位置开始复制，此时参数 end 如果有值，只能是比 start 大的负数，否则将返回空数组。

slice方法参数为空时，同concat方法一样，都是浅复制生成一个新数组。

vararray = ["one","two","three","four","five"];

console.log(array.slice());// ["one", "two", "three","four", "five"]

console.log(array.slice(2,3));// ["three"]

toString

toString() 方法返回数组的字符串形式，该字符串由数组中的每个元素的 toString() 返回值经调用 join() 方法连接（由逗号隔开）组成。

vararray = ['Jan','Feb','Mar','Apr'];

varstr = array.toString();

console.log(str);// Jan,Feb,Mar,Apr

toLocaleString

toLocaleString() 类似toString()的变型，该字符串由数组中的每个元素的 toLocaleString() 返回值经调用 join() 方法连接（由逗号隔开）组成。

vararray= [{name:'zz'},123,"abc",

newDate()];

varstr = array.toLocaleString();

console.log(str);// [object Object],123,abc,2016/1/5 下午1:06:23

indexOf

indexOf() 方法用于查找元素在数组中第一次出现时的索引，如果没有，则返回-1。

语法：arr.indexOf(element, fromIndex=0)

element 为需要查找的元素。

fromIndex 为开始查找的位置，缺省默认为0。如果超出数组长度，则返回-1。如果为负值，假设数组长度为length，则从数组的第 length + fromIndex项开始往数组末尾查找，如果length + fromIndex<0 则整个数组都会被查找。

indexOf使用严格相等（即使用 === 去匹配数组中的元素）。

lastIndexOf

lastIndexOf() 方法用于查找元素在数组中最后一次出现时的索引，如果没有，则返回-1。并且它是indexOf的逆向查找，即从数组最后一个往前查找。

语法：arr.lastIndexOf(element, fromIndex=length-1)

element 为需要查找的元素。

fromIndex 为开始查找的位置，缺省默认为数组长度length-1。如果超出数组长度，由于是逆向查找，则查找整个数组。如果为负值，则从数组的第 length + fromIndex项开始往数组开头查找，如果length + fromIndex<0 则数组不会被查找。

同 indexOf 一样，lastIndexOf 也是严格匹配数组元素。

举例请参考 indexOf ，不再详述，兼容低版本IE浏览器（IE6~8），请参考 Polyfill。

includes(ES7)

includes() 方法基于ECMAScript 2016（ES7）规范，它用来判断当前数组是否包含某个指定的值，如果是，则返回 true，否则返回 false。

语法：arr.includes(element, fromIndex=0)

element 为需要查找的元素。

fromIndex 表示从该索引位置开始查找 element，缺省为0，它是正向查找，即从索引处往数组末尾查找。

vararray = [-0,1,2];console.log(array.includes(+0));// trueconsole.log(array.includes(1));// trueconsole.log(array.includes(2,-4));// true

遍历方法(12个) :forEach  、every 、some、 filter、 map 、reduce 、reduceRight、 entries、 find&findIndex 、keys 、values

forEach

forEach() 方法指定数组的每项元素都执行一次传入的函数，返回值为undefined。

语法：arr.forEach(fn, thisArg)

fn 表示在数组每一项上执行的函数，接受三个参数：

value 当前正在被处理的元素的值

index 当前元素的数组索引

array 数组本身

thisArg 可选，用来当做fn函数内的this对象。

forEach 将为数组中每一项执行一次 fn 函数，那些已删除，新增或者从未赋值的项将被跳过（但不包括值为 undefined 的项）。

every

every() 方法使用传入的函数测试所有元素，只要其中有一个函数返回值为 false，那么该方法的结果为 false；如果全部返回 true，那么该方法的结果才为 true。因此 every 方法存在如下规律：

若需检测数组中存在元素大于100 （即 one > 100），那么我们需要在传入的函数中构造 “false” 返回值 （即返回 item <= 100），同时整个方法结果为 false 才表示数组存在元素满足条件；（简单理解为：若是单项判断，可用 one false ===> false）

若需检测数组中是否所有元素都大于100 （即all > 100）那么我们需要在传入的函数中构造 “true” 返回值 （即返回 item > 100），同时整个方法结果为 true 才表示数组所有元素均满足条件。(简单理解为：若是全部判断，可用 all true ===> true）

some

some() 方法刚好同 every() 方法相反，some 测试数组元素时，只要有一个函数返回值为 true，则该方法返回 true，若全部返回 false，则该方法返回 false。some 方法存在如下规律：

若需检测数组中存在元素大于100 (即 one > 100)，那么我们需要在传入的函数中构造 “true” 返回值 (即返回 item > 100)，同时整个方法结果为 true 才表示数组存在元素满足条件；（简单理解为：若是单项判断，可用 one true ===> true）

若需检测数组中是否所有元素都大于100（即 all > 100），那么我们需要在传入的函数中构造 “false” 返回值 （即返回 item <= 100），同时整个方法结果为 false 才表示数组所有元素均满足条件。（简单理解为：若是全部判断，可用 all false ===> false）

filter

filter() 方法使用传入的函数测试所有元素，并返回所有通过测试的元素组成的新数组。它就好比一个过滤器，筛掉不符合条件的元素。

map

map() 方法遍历数组，使用传入函数处理每个元素，并返回函数的返回值组成的新数组。

语法：arr.map(fn, thisArg)

reduce

reduce() 方法接收一个方法作为累加器，数组中的每个值(从左至右) 开始合并，最终为一个值。

语法：arr.reduce(fn, initialValue)

fn 表示在数组每一项上执行的函数，接受四个参数：

previousValue 上一次调用回调返回的值，或者是提供的初始值

value 数组中当前被处理元素的值

index 当前元素在数组中的索引

array 数组自身

initialValue 指定第一次调用 fn 的第一个参数。

当 fn 第一次执行时：

如果 initialValue 在调用 reduce 时被提供，那么第一个 previousValue 将等于 initialValue，此时 item 等于数组中的第一个值；

如果 initialValue 未被提供，那么 previousVaule 等于数组中的第一个值，item 等于数组中的第二个值。此时如果数组为空，那么将抛出 TypeError。

如果数组仅有一个元素，并且没有提供 initialValue，或提供了 initialValue 但数组为空，那么fn不会被执行，数组的唯一值将被返回。

vararray = [1,2,3,4];

vars = array.reduce(function(previousValue, value, index, array){return previousValue * value;},1);console.log(s);// 24// ES6写法更加简洁array.reduce((p, v) => p * v);// 24

reduceRight

reduceRight() 方法接收一个方法作为累加器，数组中的每个值（从右至左）开始合并，最终为一个值。除了与reduce执行方向相反外，其他完全与其一致，请参考上述 reduce 方法介绍。

entries(ES6)

entries() 方法基于ECMAScript 2015（ES6）规范，返回一个数组迭代器对象，该对象包含数组中每个索引的键值对。

语法：arr.entries()

vararray = ["a","b","c"];variterator = array.entries();console.log(iterator.next().value);// [0, "a"]console.log(iterator.next().value);// [1, "b"]console.log(iterator.next().value);// [2, "c"]console.log(iterator.next().value);// undefined, 迭代器处于数组末尾时, 再迭代就会返回undefined

find&findIndex(ES6)

find() 方法基于ECMAScript 2015（ES6）规范，返回数组中第一个满足条件的元素（如果有的话）， 如果没有，则返回undefined。

findIndex() 方法也基于ECMAScript 2015（ES6）规范，它返回数组中第一个满足条件的元素的索引（如果有的话）否则返回-1。

语法：arr.find(fn, thisArg)，arr.findIndex(fn, thisArg)

我们发现它们的语法与forEach等十分相似，其实不光语法，find（或findIndex）在参数及其使用注意事项上，均与forEach一致。因此此处将略去 find（或findIndex）的参数介绍。

keys(ES6)

keys() 方法基于ECMAScript 2015（ES6）规范，返回一个数组索引的迭代器。（浏览器实际实现可能会有调整）

语法：arr.keys()

vararray = ["abc","xyz"];variterator = array.keys();console.log(iterator.next());// Object {value: 0, done: false}console.log(iterator.next());// Object {value: 1, done: false}console.log(iterator.next());// Object {value: undefined, done: false}

索引迭代器会包含那些没有对应元素的索引，如下：

vararray = ["abc", ,"xyz"];varsparseKeys =Object.keys(array);vardenseKeys = [...array.keys()];console.log(sparseKeys);// ["0", "2"]console.log(denseKeys);// [0, 1, 2]

values(ES6)

values() 方法基于ECMAScript 2015（ES6）规范，返回一个数组迭代器对象，该对象包含数组中每个索引的值。其用法基本与上述 entries 方法一致。

语法：arr.values()

遗憾的是，现在没有浏览器实现了该方法，因此下面将就着看看吧。

vararray = ["abc","xyz"];variterator = array.values();console.log(iterator.next().value);//abcconsole.log(iterator.next().value);//xyz

Symbol.iterator(ES6)

该方法基于ECMAScript 2015（ES6）规范，同 values 方法功能相同。

语法：arr[Symbol.iterator]()

vararray = ["abc","xyz"];variterator = array[Symbol.iterator]();console.log(iterator.next().value);// abcconsole.log(iterator.next().value);// xyz

https://www.cnblogs.com/goforxiaobo/p/12623589.html

https://juejin.cn/post/6916167190060367886