js中 30 种数组方法
三十中数组方法
1.concat()
连接两个数组，返回一个拼接好的新数组，不改变原数组。
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = ['2',2,'test2','a2','b2']
console.log(arr1.concat(arr2))//['1',1,'test1','a1','b1','2',2,'test2','a2','b2']2.copyWithin()
array.copyWithin(target, start, end)，从start开始复制，到end结尾（不包括end），将复制下来的元素放在target位置上，会改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.copyWithin(0,1,3)
console.log(arr3)//[1, 'test1', 'test1', 'a1', 'b1']3.entries()
将数组转换为可迭代对象，可以使用for of进行循环，不改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.entries()//Array Iterator {}
for(let i of arr3){
console.log(i)//[0, '1'],[1, 1],[2, 'test1'],[3, 'a1'],[4, 'b1']
}4.every()
判断所有元素是否符合条件，返回值为布尔值，不改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.every((i)=>{
return typeof(i)==='string'
})//false5.fill()
array.fill(value, start, end)，从start开始，到end结尾（不包括end）的所有元素都换成value，value为静态值，会改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.fill('测试fill',1,3)
console.log(arr3)//['1', '测试fill', '测试fill', 'a1', 'b1']6.filter()
创建新数组，其中填充了所有通过测试的数组元素，通过函数方式传入：
array.filter(function(currentValue,index,arr),thisValue)
其中 currentValue 为必传参数，表示当前元素值；
index 和 arr 为可选参数，表示当前元素的索引和当前数组本身；
thisValue 也是可选参数，表示要传递给函数以用作其 "this" 值的值，如果此参数为空，则值 "undefined" 将作为其 "this" 值传递。
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.filter((i)=>{
return i>0
})
console.log(arr3)//['1', 1]filter(Boolean) 这种写法，可以直接过滤掉数组内为 false 的元素。
const arr1 = ['1',0,'test1','a1','b1']
const arr3=arr1.filter(Boolean)//['1', 'test1', 'a1', 'b1']7.find()
接收一个函数,返回第一个符合条件的值，不改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.find((i)=>{
return i === 'test1'
})
console.log(arr3)//test18.findIndex()
接收一个函数,返回第一个符合条件的值的索引，不改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.findIndex((i)=>{
return i === 'test1'
})
console.log(arr3)//29.forEach()
按顺序为数组中的每个元素调用一次函数
const arr1 = ['1',1,'test1','a1','b1']
arr1.forEach((i)=>{
i = i+'forEach';
console.log(i)//1forEach,1forEach,test1forEach,a1forEach,b1forEach
})10.from()
form()，Array.from(object, mapFunction, thisValue)，从具有 length 属性或可迭代对象的任何对象返回 Array 对象。用法：Array.from()
const arr1 = ['1',1,'test1','a1','b1']
const str1 = 'test from'
const arr2 = Array.from(str1)//['t', 'e', 's', 't', ' ', 'f', 'r', 'o', 'm']
const arr3 = Array.from(str1,(i)=>{
return i=i+'from'
})// ['tfrom', 'efrom', 'sfrom', 'tfrom', ' from', 'ffrom', 'rfrom', 'ofrom', 'mfrom']11.includes()
返回布尔值，判断数组内有没有某个元素，两个参数，第一个为搜索的值，第二个为起始位置（可选）。
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = arr1.includes(1,1)//true
const arr3 = arr1.includes(1,2)//false12.indexOf()
检测数组中有无某元素，有则返回下标，没有返回-1，可传第二个参数，为搜索的起始位置，如果有多个元素则只返回第一个符合的下标。
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = arr1.indexOf('a1')//3
const arr3 = arr1.indexOf('aa')//-113.isArray()
检查对象是否为数组，返回布尔值。用法：Array.isArray()
const arr1 = ['1',1,'test1','a1','b1']
const str1 = 'test isArray'
console.log(Array.isArray(arr1))//true
console.log(Array.isArray(str1))//false14.join()
将数组以字符串形式返回，将以指定参数进行分隔，不改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = arr1.join('')//11test1a1b1
const arr3 = arr1.join(',')//1,1,test1,a1,b1
const arr4 = arr1.join(' ')//1 1 test1 a1 b1
const arr5 = arr1.join('~')//1~1~test1~a1~b115.keys()
返回带有数组键的 Array Iterator 对象。可以之后进行遍历。
const arr1 = ['1',1,'test1','a1','b1']
const arrKey = arr1.keys();
console.log(arrKey)//Array Iterator {}
for(let i of arrKey){
console.log(i)//0 1 2 3 4
}16.lastIndexOf()
从尾到头查找，只返回查找到的第一个元素的下标，没有返回-1。
const arr1 = ['1',1,'test1','a1','b1','1']
console.log(arr1.lastIndexOf(1))//1
console.log(arr1.lastIndexOf(0))//-1
console.log(arr1.lastIndexOf('1'))//517.map()
按顺序为数组中的每个元素调用一次提供的函数，并返回一个新数组。
array.map(function(currentValue,index,arr),thisValue)
其中 currentValue 为必传参数，表示当前元素值；
index 和 arr 为可选参数，表示当前元素的索引和当前数组本身；
thisValue 也是可选参数，表示要传递给函数以用作其 "this" 值的值，如果此参数为空，则值 "undefined" 将作为其 "this" 值传递。
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = arr1.map((i)=>{
return i+'map'
})
console.log(arr1)//['1', 1, 'test1', 'a1', 'b1']
console.log(arr2)//['1map', '1map', 'test1map', 'a1map', 'b1map']18.pop()
移除数组的最后一个元素，并返回该元素。
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.pop()
console.log('arr1:',arr1)// ['1', 1, 'test1', 'a1']
console.log(arr3)//b119.push()
向数组末尾添加新项目，并返回新长度。
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.push('testpush')
console.log('arr1:',arr1)// ['1', 1, 'test1', 'a1', 'b1', 'testpush']
console.log(arr3)//620.reduce()
从左到右累加，接收两个参数（函数，初始值），第一个函数参数必选，函数参数可传四个参数（total, currentValue, currentIndex, arr），前两个必选，不改变原数组
array.reduce(function(total, currentValue, currentIndex, arr),initialValue)
其中 total 和 currentValue 为必传参数，
total 表示初始值或函数先前返回的值；
currentValue 表示当前元素值；
index 和 arr 为可选参数，表示当前元素的索引和当前数组本身；
initialValue 也是可选参数，表示初始值。
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = arr1.reduce((total,curr)=>{
console.log('total',total) //reduce~,reduce~1,reduce~11,reduce~11test1,reduce~11test1a1
console.log('curr',curr)//'1',1,'test1','a1','b1'
return total+curr
},'reduce~')//reduce~11test1a1b1
const arr3 = arr1.reduce((total, curr) => {
console.log('total', total) //reduce~,reduce~1,reduce~11,reduce~111,reduce~1111
console.log('curr', curr)//'1',1,'test1','a1','b1'
return total+1
}, 'reduce~')//reduce~1111121.reduceRight()
从右到左累加，其他的和 reduce() 一致。
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.reduceRight((total,curr)=>{
console.log('total',total) //reduceRight~,reduceRight~b1,reduceRight~b1a1,reduceRight~b1a1test1,reduceRight~b1a1test11
console.log('curr',curr)//'b1','a1','test1',1,'1'
return total+curr
},'reduceRight~')//reduceRight~b1a1test11122.reverse()
反转数组中元素的顺序，改变原数组。
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.reverse()//['b1', 'a1', 'test1', 1, '1']
console.log('arr1:', arr1)//['b1', 'a1', 'test1', 1, '1']23.shift()
头部删除元素，返回被删除的元素
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.shift()//1
console.log('arr1:', arr1)// [1, 'test1', 'a1', 'b1']24.slice()
选取元素，从start开始，到end结尾（不包括end），为负数时则从尾到头选取。
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = arr1.slice(0,2)//['1', 1]
const arr3 = arr1.slice(0,8)//['1', 1, 'test1', 'a1', 'b1']
const arr4 = arr1.slice(-2)// ['a1', 'b1']
const arr5 = arr1.slice(-3,-1)// ['test1', 'a1']只有一个参数时
const arr1 = ['1',1,'test1','a1','b1']
const arr2 = arr1.slice(2)
console.log(arr2)//['test1', 'a1', 'b1']25.some()
判断数组内是否有元素符合条件，返回布尔值，不改变原数组。
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.some((i)=>{
return i>0
})//true26.sort()
排序，出现数字时，传入函数
可以注意到 arr2 直接使用.sort()排序时结果并不正确，此时需要传入一个比较函数进行处理，例中的 a-b 是升序排列，而 b-a 就变为了降序排列。
const arr2 = [1,11,21,31,101]
const arr3 = [1,4,2,8,6]
arr2.sort()
arr3.sort()
console.log('arr2:', arr2)//[1, 101, 11, 21, 31]
console.log('arr3:', arr3)// [1, 2, 4, 6, 8]
const arr4 = arr2.sort((a,b)=>{
return a-b
})
console.log(arr4)//[1, 11, 21, 31, 101]27.splice()
可以进行删除和新增操作，改变原数组。
array.splice(index, howmany, item1, ....., itemX)
index 必传，表示为需要操作的位置；
howmany 可选，表示删除的元素数量；
item1, ....., itemX，可选，表示新增的元素
const arr1 = ['1',1,'test1','a1','b1']
//一个参数时：指定操作位置，该下标后元素删除，包含该位置自身元素
arr1.splice(2)//['1', 1]
arr1.splice(-2)//['1', 1, 'test1']
//两个参数时：从参数一位置，删除参数二个元素
arr1.splice(2,2)//['1', 1, 'b1']，从下标为2处删除两个元素
//三个及以上参数：从参数一位置，删除参数二个元素，增加参数三的值
arr1.splice(3,1,'newValue')//['1', 1, 'test1', 'newValue', 'b1']
arr1.splice(3,1,'newValue1','newValue2','newValue3')//['1', 1, 'test1', 'newValue1', 'newValue2', 'newValue3', 'b1']28.toString()
返回包含所有数组值的字符串，以逗号分隔，不改变原数组。
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.toString()//1,1,test1,a1,b129.unshift()
将新项添加到数组的开头，并返回新的长度，改变原数组
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.unshift('test unshift')//6
console.log('arr1:', arr1)//['test unshift', '1', 1, 'test1', 'a1', 'b1']30.valueOf()
返回数组本身
const arr1 = ['1',1,'test1','a1','b1']
const arr3 = arr1.valueOf()//['1', 1, 'test1', 'a1', 'b1']改变原数组的方法
- copyWithin() 三个参数，复制元素并放入数组；
- fill() 三个参数，向数组内添加静态元素；
- pop() 尾删，返回删除元素；
- push() 尾插，返回数组新长度；
- reverse() 反转数组内元素；
- shift() 头删，返回删除元素；
- sort() 排序，数字选择传入比较函数；
- splice() index，howmany，item...根据参数数量进行删除和插入元素；
- unshift() 头插，返回数组新长度；
不改变原数组的方法
- concat() 连接两个数组；
- entries() 将数组转换为可迭代对象；
- every() 传入函数参数，判断所有元素是否符合函数内条件，返回布尔值；
- filter() 传入函数参数，将所有符合函数内条件的元素作为新数组返回；
- find() 传入函数参数，返回第一个符合条件的值；
- findIndex() 传入函数参数，返回第一个符合条件的值的索引；
- join() 将数组以字符串形式返回，并以指定参数进行分隔；
- keys() 返回带有数组键的 Array Iterator 对象。
- map() 传入函数参数，将所有元素进行函数内处理后作为新数组返回；
- reduce() 传入函数参数，数组缩减为单个值，从左到右处理。
- reduceRight() 同上，从右到左处理。
- slice() 两个参数，选取元素；
- some() 传入函数参数，判断是否有元素是否符合函数内条件，返回布尔值；
- toString() 返回包含所有数组值的字符串，以逗号分隔