JS数组方法

学习链接：
【JavaScript】——JS数组的方法（全且详细）

一、创建数组

1、使用数组字面量方法

var arr1 = [];     // 创建一个数组
var arr2 = [10];   // 创建一个数组长度为10的数组
var arr3 = ['a','b','c'];  // 创建一个包含3个字符串的数组

2、使用Array构造函数

无参构造

var arr1 = new Array();   // 创建一个空数组

---

带参构造

如果只传一个数值参数，则表示创建一个初始长度为指定数组的空数组

var arr2 = new Array(10);     // 创建一个数组长度为10的数组

---

如果传入一个非数值的参数或者参数大于1，则表示创建一个包含指定元素的数组

  var arr3 = new Array('a','b','c');     // 创建一个包含3个字符串的数组

3、Array.of方法创建数组(es6新增)

**Array.of()**方法会创建一个包含所有传入参数的数组，而不管参数的数量与类型

let arr1 = Array.of(1,2);console.log(arr1.length);   // 2 let arr2 = Array.of(3);console.log(arr2.length);   // 1console.log(arr2[0]);   // 3

4、Array.from方法创建数组(es6新增)

在js中将非数组对象转换为真正的数组是非常麻烦的。在es6中，将可迭代对象或者类数组对象作为第一个参数传入，**Array.from()**就能返回一个数组

function arga(...args){  // ...args剩余参数数组，由传递给函数的实际参数提供     let arg = Array.from(args);     console.log(arg);} arga(arr1,26,from);     // [arr1,26,from]

---

二、数组方法

1. 改变数组本身的方法

push，向数组的尾新增一个元素，可以添加一个或多个元素，返回值是改变后的该数组的length值

pop，从数组的最后删除一个元素，返回值是被删除的元素

var arr1 = ['lily','lucy','Tom'];var count = arr1.push('Jack','Sean');console.log(count);   // 5console.log(arr1);   // ['lily','lucy','Tom','Jack','Sean'] var item = arr1.pop();console.log(item);   // Seanconsole.log(arr1);   // ['lily','lucy','Tom','Jack']

---

unshift，向数组的头新增一个或更多元素，返回值是改变后的该数组的length值
shift，从数组的头部删除第一个元素，返回值是被删除的元素

var arr1 = ['lily','lucy','Tom'];var count = arr1.unshift('Jack','Sean');console.log(count);   // 5console.log(arr1);   // ['Jack','Sean','lily','lucy','Tom'] var item = arr1.shift();console.log(item);   // Jackconsole.log(arr1);   // [''Sean','lily','lucy','Tom']

---

splice(index, num, item1, item2, …)，index是指定开始处理的索引位置，num指定删除多少项，从第三个元素开始都是新增的元素项。可以实现从指定的索引位置新增、删除、替换元素。返回值是被删除的元素组成的数组。

//替换var a=['a','b','c'];var b=a.splice(1,1,'e','f');    //a=['a','e','f','c'],b=['b'] //删除var arr1 = [1,3,5,7,9,11];var arrRemoved = arr1.splice(0,2);console.log(arr1);   // [5,7,9,11]console.log(arrRemoved);   // [1,3] // 添加元素var arr1 = [22,3,31,12];arr1.splice(1,0,12,35);console.log(arr1);   // [22,12,35,3,31,12]

---

sort，对数组排序，默认按照升序排列，可以传递函数类型的参数决定排序的方式

用于对数组的元素进行排序。排序顺序可以是字母或数字，并按升序或降序，默认排序顺序为按字母升序

var arr1 = ['a','d','c','b'];console.log(arr1.sort());   // ['a','b','c','d'] function compare(value1,value2){     if(value1 < value2){          return -1;     }else if(value1 > value2){          return 1;     }else{          return 0;     }} var arr2 = [13,24,51,3];console.log(arr2.sort(compare));   // [3,13,24,51] // 如果需要通过比较函数产生降序排序的结果，只要交后比较函数返回的值即可

---

reverse，反转数组

var arr1 = [13,24,51,3];console.log(arr1.reverse());   // [3,51,24,13]console.log(arr1);   // [3,51,24,13](原数组改变)

---

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

var arr1 = [1,2,3,4,5];var sum = arr1.reduce((prev,cur,index,array) => {     return prev + cur;},10);   // 数组一开始加了一个初始值10，可以不设默认0console.log(sum);   // 25

2. 不改变数组本身返回新数组的方法

concat，concat的参数，可以是单个/多个基本类型的值，也可以是数组。对原数组和参数拼接，返回拼接后形成的新数组。

var arr1 = [1,3,5,7];var arrCopy = arr1.concat(9,[11,13]);console.log(arrCopy);   // [1,3,5,7,9,11,13]console.log(arr1);   // [1,3,5,7](原数组未被修改)

---

slice(startIndex, endIndex)，截取原数组的片段，前闭后开区间，包含startIndex索引的元素开始截取，一直到endIndex索引之前的那个元素

截取区间：[startIndex,endIndex)

var arr1 = [1,3,5,7,9,11];var arrCopy = arr1.slice(1);var arrCopy2 = arr1.slice(1,4);var arrCopy3 = arr1.slice(1,-2);   // 相当于arr1.slice(1,4);var arrCopy4 = arr1.slice(-4,-1);   // 相当于arr1.slice(2,5);console.log(arr1);   // [1,3,5,7,9,11](原数组没变)console.log(arrCopy);   // [3,5,7,9,11]console.log(arrCopy2);   // [3,5,7]console.log(arrCopy3);   // [3,5,7]console.log(arrCopy4);   // [5,7,9] //如果不传入参数二，那么将从参数一的索引位置开始截取，一直到数组尾var a=[1,2,3,4,5,6];var b=a.slice(0,3);    //[1,2,3]var c=a.slice(3);       //[4,5,6] //如果两个参数中的任何一个是负数，array.length会和它们相加，试图让它们成为非负数，举例说明：//当只传入一个参数，且是负数时，length会与参数相加，然后再截取var a=[1,2,3,4,5,6];var b=a.slice(-1);    //[6] //当只传入一个参数，是负数时,并且参数的绝对值大于数组length时，会截取整个数组var a=[1,2,3,4,5,6];var b=a.slice(-6);    //[1,2,3,4,5,6]var c=a.slice(-8);    //[1,2,3,4,5,6] //当传入两个参数一正一负时，length也会先于负数相加后，再截取var a=[1,2,3,4,5,6];var b=a.slice(2,-3);    //[3] //当传入一个参数，大于length时，将返回一个空数组var a=[1,2,3,4,5,6];var b=a.slice(6);　　//[]

3. 循环遍历相关的方法

这些方法也可以在循环的过程中 间接的改变数组自身的元素

forEach((item, index) => {})方法，遍历数组的每个元素，参数为一个函数，参数函数的两个参数为数组项和对应的索引

forEach方法中的function回调有三个参数：

第一个参数是遍历的数组内容，

第二个参数是对应的数组索引，

第三个参数是数组本身

var arr = [1,2,3,4];var sum =0;arr.forEach(function(value,index,array){  array[index] == value; //结果为true  sum+=value;   }); console.log(sum); //结果为 10

---

**includes()**方法，es7新增，用来判断一个数组、字符串是否包含一个指定的值，使用===运算符来进行值比较，如果是返回true，否则false，参数有两个，第一个是(必填)需要查找的元素值，第二个是(可选)开始查找元素的位置.

var arr1 = [22,3,31,12,58];var includes = arr1.includes(31);console.log(includes);   // true var includes2 = arr1.includes(31,3);   // 从索引3开始查找31是否存在console.log(includes2);   // false

---

**map((item, index) => {})**方法，遍历数组的每个元素，参数为一个函数，参数函数的两个参数为数组项和对应的索引，根据参数函数的执行结果，把这些结果组成一个新数组返回。

会按照原始数组元素顺序依次处理元素。

let array = [1, 2, 3, 4, 5]; let newArray = array.map((item) => {    return item * item;}) console.log(newArray)  // [1, 4, 9, 16, 25]

---

**filter((item, index) => {})**方法，遍历数组的每个元素，执行参数函数，将符合参数函数中定义条件的那些项留下，组成一个新数组返回

const array = [14, 17, 18, 32, 33, 16, 40];const newArr = array.filter(num => num > 14)console.log(newArr);//打印 [17,18,32,33,16,40] // 查找某个值-------------------------const array = [14, 17, 18, 32, 33, 16, 40];const newArr = array.filter(num => num == 14)console.log(newArr);//打印 [14] //返回大于某个值和小于某个值的元素const array = [14, 17, 18, 32, 33, 16, 40];const newArr = array.filter(num => num > 14 && num < 33)console.log(newArr);//打印 [17, 18, 32, 16]

---

find()和findIndex()

都接受两个参数：一个回调函数，一个可选值用于指定回调函数内部的this

该回调函数可接受3个参数：数组的某个元素、该元素对应的索引位置、数组本身，在回调函数第一次返回true时停止查找。

二者的区别是：find()方法返回匹配的值，而findIndex()方法返回匹配位置的索引

let arr = [1,2,3,4,5];let num = arr.find(item => item > 1);console.log(num) // 2 let arr = [1,2,3,4,5];let num = arr.findIndex(item => item > 1);console.log(num) // 1

---

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 arr1 = [a,b,c];let entries = arrr1.entries();console.log(entries.next().value);   // [0,a]console.log(entries.next().value);   // [1,b]console.log(entries.next().value);   // [2,c]

---

indexOf()

indexof方法可以在字符串和数组上使用。
indexOf() 方法可返回某个指定的字符串值在字符串、数组中首次出现的位置。

    arr = ['mfg', '2017', '2016'];     console.log(arr.indexOf('mfg')); // 0    console.log(arr.indexOf('m')); // -1    console.log(arr.indexOf('2017'));// 1    console.log(arr.indexOf(2017)); // -1，这里不会做隐式类型转换

---

**some((item, index) => {})**方法，循环数组，对每一项执行参数函数中的条件，有符合条件的项则立即返回true，不再继续遍历；如果全部遍历完还没有找到符合项则返回false

判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回true。

var arr1 = [1,2,3,4,5];var arr2 = arr1.some(x => {     return x < 3;});console.log(arr2);   // true var arr3 = arr1.some(x => {     return x < 1;});console.log(arr3);   // false

---

every((item, index) => {})，与some相反，every需要是数组中每一项都符合参数函数中的条件才返回true，如果遇见任何一项不符合立即返回false，也不再继续遍历后续项。

判断数组中每一项都是否满足条件，只有所有项都满足条件，才会返回true。

var arr1 = [1,2,3,4,5];var arr2 = arr1.every(x => {     return x < 10;});console.log(arr2);   // true var arr3 = arr1.every(x => {     return x < 3;});console.log(arr3);   // false

4.其他数组的方法

join()：用指定的分隔符将数组每一项拼接为字符串

join()方法用于把数组中的所有元素转换一个字符串，默认使用逗号作为分隔符

var arr1 = [1,2,3];console.log(arr1.join());   // 1,2,3console.log(arr.join('-'));   // 1-2-3console.log(arr);   // [1,2,3](原数组不变)

---

**toLocaleString()和toString()**都是将数组转换为字符串

var arr1 = [22,3,31,12];let str = arr1.toLocaleString();var str2 = arr1.toString(); console.log(str);   // 22,3,31,12console.log(str2);   // 22,3,31,12## 目标