js数组的方法

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

• 一、push()&&pop() unshift()&&shift()
• • 1、push()：向数组的末尾添加一个或多个元素，并返回新的长度
  • 2、pop()：删除并返回数组的最后一个元素
  • 3、unshift()：向数组的开头添加一个或多个元素，并返回新的长度
  • 4、shift()：删除并返回数组的第一个元素
• 二、splice():可进行增，删，改操作
• • 1、增：splice(start,0,item)：向数组内添加/插入元素，并返回空数组
  • 2、删：splice(start,deleteNum)：删除元素，并返回包含删除元素的数组
  • 3、改：splice(start,deleteNum,item) ：从start下标开始,删除几个,并在该位置添加item。返回包含删除元素的数组。
• 三、slice()
• • slice(start,end):返回的是被截取（删除的元素），不影响原数组。
• 四、concat()&&join()
• • 1、concat():可以把两个数组里的元素拼接成一个新的数组,返回拼接后的新数组
  • 2、 join():数组转字符串，参数默认为逗号分隔符
• 五、查
• • 1、indexOf(ele，start):用来查找元素在数组中第一次出现的位置，没找到返回-1。
  • 2、lastIndexOf(ele,start):从数组的末尾开始向前查找,没找到返回-1
  • 3、includes(ele,start) 用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。
  • 4、find(function(currentValue,index,arr){}) 返回数组内符合条件的第一个值
  • 5、findIndex() 返回数组内符合条件的第一个值,默认返回的是索引，如果没有符合条件的元素返回 -1，Es6
• 六、排序和数组反转
• • 1、sort()排序
  • 2、reverse()数组反转
• 七、迭代（不改变原数组）
• • 1.some()：数组中只要有一个元素通过了函数测试，就会返回true,否则返回false
  • 2.every(): 数组中只有所有元素通过了函数测试，才返回true,否则返回false
  • 3.forEach():没有返回值，只用来操作数据
  • 4.map():返回一个新数组
  • 5.filter():过滤数组成员，返回过滤后的新数组，遍历数组时将返回值为true的元素放在新数组中，如果没有符合条件的元素则返回空数组。
• 八、reduce()&&reduceRight()【待完善】
• • 1、reduce():从左到右处理数组的每个成员，最终累计为一个值
  • 2、reduceRight():从右到左处理数组的每个成员，最终累计为一个值

一、push()&&pop() unshift()&&shift()

1、push()：向数组的末尾添加一个或多个元素，并返回新的长度

let arr=['html','css','js']let len=arr.push('vue');console.log(arr);// ['html', 'css', 'js', 'vue']console.log(len);//4

2、pop()：删除并返回数组的最后一个元素

let arr=[1,2,3,4,5]let r=arr.pop(5)console.log(arr);//[1, 2, 3, 4]console.log(r);//5

3、unshift()：向数组的开头添加一个或多个元素，并返回新的长度

 let arr = ['html', 'css', 'js']letln= arr.unshift('vue');console.log(arr);// ['vue', 'html', 'css', 'js']console.log(ln);//4

4、shift()：删除并返回数组的第一个元素

let arr = [1, 2, 3, 4, 5]let r = arr.shift(1)console.log(arr);//[ 2, 3, 4,5]console.log(r);//1

二、splice():可进行增，删，改操作

语法：arr.splice(start,deleteNum,item)start:开始的下标deleteNum：要删除元素数量item：要插入数组的元素

1、增：splice(start,0,item)：向数组内添加/插入元素，并返回空数组

 let arr = ['html', 'css', 'js']arr.splice(1,0,'vue')console.log(arr);// ['html', 'vue', 'css', 'js']console.log(arr.splice(1, 0, 'vue'));//[]

2、删：splice(start,deleteNum)：删除元素，并返回包含删除元素的数组

let arr=[1,2,3,4,5,6]let a=arr.splice(0,3)console.log(arr);//[4,5,6]console.log(a);//[1,2,3]

3、改：splice(start,deleteNum,item) ：从start下标开始,删除几个,并在该位置添加item。返回包含删除元素的数组。

let arr=[1,2,3]let a=arr.splice(0,2,6,7)console.log(arr);//[6, 7, 3]console.log(a);//[1, 2]

三、slice()

slice(start,end):返回的是被截取（删除的元素），不影响原数组。

start开始下标，end结束下标。从start下标开始截取,一直到end结束,不包括end。

let arr=[1,2,3,4,5,6]let a=arr3.slice(0,2)console.log(arr);//[1, 2, 3, 4, 5, 6]console.log(a);//[1,2]

四、concat()&&join()

1、concat():可以把两个数组里的元素拼接成一个新的数组,返回拼接后的新数组

let arr=[1,2,3]let arr1=[4,5,6]let newArr=arr.concat(arr1)console.log(newArr);//[1, 2, 3, 4, 5, 6]

2、 join():数组转字符串，参数默认为逗号分隔符

let arr=[5,6,7,8]console.log(arr.join());//5,6,7,8console.log(arr.join(';'))//5;6;7;8console.log(arr);//[5,6,7,8]

五、查

1、indexOf(ele，start):用来查找元素在数组中第一次出现的位置，没找到返回-1。

ele:要查找的元素，start：可选的整数参数。规定在数组中开始检索的位置

2、lastIndexOf(ele,start):从数组的末尾开始向前查找,没找到返回-1

let arr = [1, 2, 3, 4, 5,4,2]console.log(arr.indexOf(7));//-1console.log(arr.indexOf(4));//3console.log(arr.indexOf(2));//1console.log(arr.indexOf(4,2));//3console.log(arr.lastIndexOf(7));//-1console.log(arr.lastIndexOf(4));//5console.log(arr.lastIndexOf(2));//6

3、includes(ele,start) 用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。

ele:要查找的元素start：可选的整数参数。规定在数组中开始检索的位置,如果为负值，则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。ES6新增

let arr1=[1,2,3,4,5,4,2]console.log(arr.includes(3));//trueconsole.log(arr.includes(6));//falseconsole.log(arr.includes(3,-1));//falseconsole.log(arr.includes(3,-6));//true

4、find(function(currentValue,index,arr){}) 返回数组内符合条件的第一个值

当前的值（currentValue）、当前的位置（index）、原数组（arr）Es6新增

let arr2=[4,5,6,7,8,1,2]let fResult=arr2.find(function(currentVal,index,arr2){return currentVal>5})let fResult1 = arr2.find(function (currentVal, index, arr2) {return currentVal >8})console.log(fResult);//6console.log(fResult1);//undefined

5、findIndex() 返回数组内符合条件的第一个值,默认返回的是索引，如果没有符合条件的元素返回 -1，Es6

let arr2=[4,5,6,7,8,1,2]let result=arr2.findIndex(function(currentVal,index,arr2){return currentVal>5})let result1 = arr2.findIndex(function (currentVal, index, arr2) {return currentVal > 8})console.log(result);//2console.log(result1);//-1

六、排序和数组反转

1、sort()排序

方法用于对数组的元素进行排序

let arr=[1,300,150,2]let newArr=arr.sort()console.log(newArr);//[1, 150, 2, 300]console.log(arr);//[1, 150, 2, 300]

此时数组并没有按照数字大小顺序排序，而是按照字符编码顺序进行排序，要是完成排序，要使用排序函数

let arr=[1,300,150,2]function sortNumber(a, b) { return a - b }//升序function decreaseNumber(a,b){return b - a}//降序let arr1=arr.sort(sortNumber)console.log(arr1);//[1, 2, 150, 300]let arr2=arr.sort(decreaseNumber)console.log(arr2);//[300, 150, 2, 1]

2、reverse()数组反转

let arr = [1, 300, 150, 2]console.log(arr.reverse());//[2, 150, 300, 1]console.log(arr);//2, 150, 300, 1]

七、迭代（不改变原数组）

ele : 必需。当前元素index： 可选。当前元素的索引值。arr :可选。当前元素所属的数组对象。thisArg： 可选。传递给函数的值一般用 "this" 值。如果这个参数为空， "undefined" 会传递给 "this" 值

1.some()：数组中只要有一个元素通过了函数测试，就会返回true,否则返回false

1.some()不会对空数组进行检测，不会改变原始数组，收到空数组返回false2.语法：arr.some(function(ele,index,arr){},thisArg)

let arr=[4,5,6,7,8,9]let boo=arr.some(function(ele,index,arr){return ele>5})console.log(boo);//truelet boo1=arr.some(function(ele,index,arr){return ele<4})console.log(boo1);//false

2.every(): 数组中只有所有元素通过了函数测试，才返回true,否则返回false

1.语法：arr.every(function(ele,index,arr){},thisArg)2.every()不会对空数组进行检测，不会改变原始数组，收到空数组返回true

let arr=[4,5,6,7,8,9]let result=arr.every(function(ele,index,arr){return ele>5})console.log(result);//falselet result1=arr.every(function(ele,index,arr){return ele<10})console.log(result1);//true

3.forEach():没有返回值，只用来操作数据

语法：arr.forEach(function(ele,index,arr){},thisArg)

let arr=[7,8,9,6,2,1,3]arr.forEach(function(ele,index,arr){if(ele>5){console.log(ele);//7 89 6}})

4.map():返回一个新数组

语法：arr.map(function(ele,index,arr){},thisArg)

let arr=[7,8,9,6,2,1,3]let newArr=arr.map(function(ele,index,arr){return ele*2})console.log(newArr);//[14, 16, 18, 12, 4, 2, 6]

5.filter():过滤数组成员，返回过滤后的新数组，遍历数组时将返回值为true的元素放在新数组中，如果没有符合条件的元素则返回空数组。

语法：arr.filter(function(ele,index,arr){},thisArg)

let arr=[7,8,9,6,2,1,3]let newArr1=arr.filter(function(ele,index,arr){return ele>7})console.log(newArr1);//[8, 9]

八、reduce()&&reduceRight()【待完善】

1、reduce():从左到右处理数组的每个成员，最终累计为一个值

语法：arr.reduce(function(total , cur , index , arr){}, initialValue)total ：必需。初始值, 或者计算结束后的返回值。cur ：必需。当前元素。index ：可选。当前元素的索引。arr：可选。当前元素所属的数组对象。initialValue：可选。传递给函数的初始值。

var arr = [1, 2, 3, 4, 5];var result = arr.reduce(function (total, cur, index, arr) {console.log("total:" + total + ",cur:" + cur + ",index:" + index);return total + cur;});console.log(result);//15 

2、reduceRight():从右到左处理数组的每个成员，最终累计为一个值

 语法：arr.reduceRight(function(total , cur , index , arr){}, initialValue)