数组的API

不改变原数组1、将数组转化为字符串2、数组拼接和获取子数组：3.返回某个指定的字符串值在数组中首次出现的位置（indexOf） 改变原数组1.删除，插入，替换 splice()2.反转数组元素（reverse）3.对数组的元素进行排序（sort）4.结尾出入栈5.开头出入栈 迭代方法全部满足条件部分满足条件过滤forEachmap 归并方法 reduce静态方法（es6）1.Array.of(...args)2.Array.from(arg); 实例方法 （es6）1.find(callback)2.findIndex(callback)3.fill(data)4.copywithin(target,[start],[end])5.includes(data) 数组的遍历 for…of

不改变原数组

1、将数组转化为字符串

String(str); 将数组转化为字符串并分隔每个元素;

var arr = [1,2,3]; String(arr) //"1,2,3" arr //[1, 2, 3]

arr.join("自定义分隔符"); 将数组转化为字符串，可定义分隔符 默认是逗号，也可以自定义连接符

var arr=[1,2,3]; arr.join('')//"123" arr.join('-')//"1-2-3" arr.join()//"1,2,3" arr //[1, 2, 3]

2、数组拼接和获取子数组：

数组拼接（concat） var newArr = arr.concat(值1,值2,arr1,...); 将concat后的内容，和arr拼接，组成新数组返回 concat的参数中包含数组，则打散数组，以单个元素拼接

var arr = [1,2,3]; arr.concat(1,2); // [1, 2, 3, 1, 2] arr.concat(4,[5,6]); //[1,2,3,4,5,6] arr; //[1,2,3]

数组选取，获取子数组（slice 含头不含尾） arr.slice(start,end+1); 获得arr中start位置开始，到end位置的所有元素组成的新数组 含头不含尾 省略第二个参数：表示从start一直取到结尾 可支持负数参数：-n表示倒数第n个元素，相当于length-n

var arr = [1,2,3,4] arr.slice(0); //[1, 2, 3, 4] arr.slice(0,2); //[1, 2] arr.slice(-3); //[2, 3, 4] arr.slice(-3,-1); //[2, 3] arr; //[1, 2, 3, 4]

3.返回某个指定的字符串值在数组中首次出现的位置（indexOf）

没有返回-1

var arr=[1,3,2]; arr.indexOf(3); //1 arr.indexOf(5); //-1 arr; //[1,3,2]

改变原数组

1.删除，插入，替换 splice()

删除：arr.splice(start,n); 删除arr中start位置开始的n个元素 返回被删除的元素组成的临时新数组 支持负数

var arr=[1,2,3,4] arr.splice(0); //[1, 2, 3, 4] arr.splice(-1); //[4] arr.splice(0,3); //[1, 2, 3] arr; //[]

插入：arr.splice(start,0,值1,值2,...); 在arr中start位置，插入新值。旧值被向后顺移 要插入的值，只能以单独的参数传入，不支持打散数组参数 start表示第i个 不是数组索引

var arr = [1,2,3,4]; arr.splice(2,0,22,33); //[] arr; //[1, 2, 22, 33, 3, 4]

替换：arr.splice(start,n,值1,值2,...); 删除arr中start位置开始的n个元素，再在start位置插入新元素 删除的元素个数和插入的新元素个数不必相等

var arr=[1,2,3,4] arr.splice(2,4,33); //[3, 4] arr; // [1, 2, 33]

2.反转数组元素（reverse）

arr.reverse();

var arr=[1,3,2]; var newArr = arr.reverse(); newArr; //[2,3,1] arr; //[2,3,1]

3.对数组的元素进行排序（sort）

将arr中的元素，以字符串方式升序

arr = [1,5,3,2]; arr.sort() //[1, 2, 3, 5] arr; //[1, 2, 3, 5]

自定义排序方法

arr = [1,5,3,2]; var newArr = arr.sort((a,b) => b - a); console.log(newArr);//[5, 3, 2, 1] console.log(arr); //[5, 3, 2, 1]

4.结尾出入栈

入栈：arr.push(值) 向数组的末尾添加一个或多个元素 返回新数组的长度

var arr = [1,2,3,4] arr2 = arr.push(1) //5 arr; //[1, 2, 3, 4, 1]

出栈：arr.pop(); 删除数组最后一个元素 返回删除的元素

var arr=[1,2,3,4] arr.pop() //4 arr; //[1,2,3]

5.开头出入栈

入栈：arr.unshift(值); 向数组的开头添加一个或更多元素 返回新的长度

var arr=[1,3,2]; arr.unshift(4); //4 arr; //[4,1,3,2]

出栈：arr.shift(); 把数组的第一个元素从其中删除 返回第一个元素的值

var arr=[1,3,2]; arr.shift(); //1 arr; //[3,2]

迭代方法

以下方法都不会修改数组中包含的值

全部满足条件

Array.every() 对数组中的每一项运行给定的函数，如果该函数对每一项都返回true，则返回true。

// 是否全部大于0 let a = [1,2,3,4].every(item => { return item > 0; }); console.log(a); // true

部分满足条件

Array.some() 对数组中的每一项运行给定的函数，如果该函数对任一项返回true，则返回true。 一旦找到对应的项，立即停止遍历数组。

// 是否有部分大于3 let a = [1,2,3,4].some(item => { return item > 3; }); console.log(a); // true

过滤

Array.filter() 对数组中的每一项运行给定的函数，返回该函数会返回true的项组成的数组。

const persons = [ {name: 'Jack', age: 18}, {name: 'Amy', age: 17}, {name: 'Lily', age: 22} ] let a = persons.filter(person => { return person.age > 20; }); console.log(a) // [{name: 'Lily', age: 22}]

forEach

Array.forEach 对数组中的每一项运行给定的函数。 这个方法没有返回值。

var numbers = [1,2,3,4,5,4,3,1]; var sum = 0; var forEachResult= numbers.forEach(function(item,index,array){ array[index] == item; //true sum += item; }) console.log(sum); //23

map

Array.map() 对数组中的每一项运行给定的函数，返回每次函数调用的结果组成的数组。

var numbers = [1,2,3,4,5,4,3,1]; var mapResult = numbers.map(function(item,index,array){ return item*2; }) console.log(mapResult); //[2,4,6,8,10,8,6,2]

归并方法 reduce

Array.reduce 从数组中的第一项开始，逐个遍历到最后。 适用场景1：累加

let a = [1,2,3,4].reduce((total, item) => { return total + item; }, 0); console.log(a) // 10

适用场景2：数组处理

const persons = [ {name: 'Jim', age: 22}, {name: 'Alen', age: 17}, {name: 'Lily', age: 20} ] let names = persons.reduce((names, person) => { if (person.age > 18) { names.push(person.name) } return names; }, []); console.log(names) // ['Jim', 'Lily']

适用场景3：将数组转化为对象

const arr = [ {id: '1', name: 'Jim'}, {id: '2', name: 'Lily'}, {id: '3', name: 'Allen'} ] let obj = arr.reduce((acc, current) => { return {...acc, [current.id]: current}; }, {}) console.log(obj) // { // 1: {id: '1', name: 'Jim'}, // 2: {id: '2', name: 'Lily'}, // 3: {id: '3', name: 'Allen'} // }

静态方法（es6）

1.Array.of(…args)

把一堆文本或者变量转换成数组

let arr = Array.of(3,4,5,'zhang','li'); console.log(arr); //[3, 4, 5, "zhang","li"]

2.Array.from(arg);

把类数组，可迭代对象转换数组

const divs = document.getElementsByTagName("div"); const result = Array.from(divs); console.log(result); //之前的写法 // const result = Array.prototype.slice.call(divs,0) // const result = [].slice.call(divs,0)

实例方法 （es6）

1.find(callback)

查找满足条件的元素 在函数中如果找到符合条件的数组元素就return，并停止查找

let arr=[1,2,3,4,5,6,7,8,9]; console.log(arr.find(function(value,index,arr){ return value > 5; })) //6

2.findIndex(callback)

查找满足条件的元素

const arr = [ { name : "a", id : 1 }, { name : "b", id : 2 } ] const resultindex = arr.findIndex(item=>item.id == 2) //1

3.fill(data)

用指定的数据填充数组

const arr = new Array(5); arr.fill("hello") //["hello", "hello", "hello", "hello", "hello"]

4.copywithin(target,[start],[end])

在当前数组内部，将指定位置的成员复制到其他位置，返回当前数组。 第一个参数（从该位置开始替换数据）； 第二个参数（可选 从该位置开始读取数据，默认为0，负值表示倒数）； 第三个参数（可选 到该位置前停止读取，默认为数组长度） 返回替换后的数组(改变了数组)

[1, 2, 3, 4, 5].copyWithin(0, 3) // [4, 5, 3, 4, 5]

5.includes(data)

是否包含data这个数据 第一个参数必选（待检查的给定值） 第二个参数可选，表示搜索的起始位置，默认为0，负数表示倒数的位置　 返回值:Boolean 和indexOf的区别，indexOf进行了运算符的强比对，这个是Object.is()

[1, 2, 3].includes(2); // true [1, 2, 3].includes(4); // false [1, 2, NaN].includes(NaN); // true

数组的遍历 for…of

let arr=['js','java','python','c','c++']; for (let item of arr){ console.log(item);//j java python c c++ }

for…of数组索引

let arr=['js','java','python','c','c++']; for (let index of arr.keys()){ console.log(index);//0 1 2 3 4 }

arr.keys() 方法是对key值得遍历 arr.values() 方法是对value值的遍历 arr.entries() 方法是对键值对的遍历 同时输出数组的内容和索引：使用entries()这个实例方法，配合for…of循环就可以同时输出内容和索引了。

let arr=['js','java','python','c','c++']; for (let [index,val] of arr.entries()){ console.log(index,val); //0 'js' 1 'java' 2 'python' 3 'c' 4 'c++' }

entries( )实例方法 entries()实例方式生成的是Iterator形式的数组，这种形式的好处就是可以在需要时用next()手动跳转到下一个值。

let arr=['js','java','jquery'] let list=arr.entries(); console.log(list.next().value); //[0, "js"] console.log(list.next().value); //[1, "java"] console.log(list.next().value); //[0, "jquery"]