js中Array方法合集

Array()

Array的方法有很多,包括自身原型方法以及从Object中继承而来的方法,本文只介绍Array的原型方法。
1、join()
将数组中的元素全部组成一个字符串,join()里边只有一个参数,就是分隔符,默认是逗号(,),返回一个字符串,不会修改原数组

var a=[1,4,2,3]
console.log(a.join())//1,4,2,3 数组中的元素之间用,分隔开形成一个字符串
console.log(a.join('#')) //1#4#2#3

2、concat()
数组相连,返回新数组,不会修改原数组
concat()参数既可接受多个数组,也可接受列举数组中的所有元素,同时也不接受参数,就是返回一个与原数组相同的新数组。

var a=[1,4,2,3];
console.log(a.concat()) //[1,4,2,3]
console.log(a.concat(4,5));	// [1,4,2,3,4,5]
console.log(a.concat([6,7]));	// [1,4,2,3,6,7]
console.log(a.concat([4,5],[6,7,[8,9]])) /[1,4,2,3,4,5,6,7,[8,9]]

3、push()
将参数添加至数组末尾,对原数组进行修改,返回修改后的数组长度。push()接受任意数量的参数。

var a=[1,4,2,3]
var result=a.push(4,5,6)
console.log(result)  //7
console.log(a)   //[1,4,2,3,4,5,6]

4、unshift()
将参数添加至数组开头,对原数组进行修改,返回修改后的数组长度。unshift()接受任意数量的参数。

var a=[1,4,2,3]
var result=a.push(4,5,6)
console.log(result)  //7
console.log(a)   //[4,5,6,1,4,2,3]

5、pop()
删除数组末尾最后一项,对原数组进行修改,返回被移除的项,不接受参数。数组为空返回undefined

var a=[1,4,2,3]
var item=a.pop()
console.log(item)   //3
console.log(a)   //[1,4,2]

6、shift()
删除数组第一项,对原数组进行修改,返回被移除的项,不接受参数。数组为空返回undefined。

var a=[1,4,2,3]
var item=a.shift()
console.log(item)   //1
console.log(a)   //[4,2,3]

7、sort()
将数组中的元素进行从小到大的排列,改变原数组。比较函数为可选参数

var a=[1,4,2,3]
console.log(a.sort())  //[1,2,3,4]
console.log(a)   //[1,2,3,4] 原数组改变

拓展:将数组中的元素从大到小排列

function reSort(a,b){
	if(a<b){
		return 1
	}else if(a>b){
		return -1
	}else{
		return 0
	}
}
var a=[1,4,2,3]
console.log(a.sort(reSort))  //[4,3,2,1]
console.log(a)   //[4,3,2,1] 原数组改变

8、reverse()
数组顺序反转,修改原数组。不接受参数

var a=[1,4,2,3]
console.log(a.reverse())  //[3,2,4,1]
console.log(a)   //[3,2,4,1] 原数组改变

9、slice()
截取数组中的几个元素组成新数组,返回被截取后的数组,不会修改原数组。slice(start,end)接受两个参数,start为截取数组元素的起始索引值,end为截取数组元素的终止索引值(不包括终止索引值的项)。只有一个参数的话默认截取到最后,无参数的话返回一个与原数组一样的新数组。
tips:当start取值为负数时,从数组末尾开始计算。最后一项为-1,end同理。

var a=[1,4,2,3]
var result1=a.slice()
var result2=a.slice(1)
var result3=a.slice(1,2) //不包括索引值为2的元素
console.log(result1)  //[1,4,2,3]
console.log(result2)  //[4,2,3]
console.log(result3)  //[4]
console.log(a)   //[1,4,2,3] 原数组改变
var result4=a.slice(-3)
var result5=a.slice(-3,-1)
console.log(result4) //[4,2,3]  //从倒数第三项开始
console.log(result4) //[4,2] //从第三项到倒数第一项,终止索引值-1的元素不计入

10、splice()
可实现对数组的删除,插入和替换操作,修改原数组,返回被操作的数组元素组成的数组。splice(start[, deleteCount[, item1[, item2[, …]]]])可接受多个参数。第一个参数为要删除的元素的索引值,第二个参数为删除的个数,第三项及之后的为插入元素

var a=[1,4,2,3]
var result1=a.splice(0,2)
console.log(result1)  //[1,4] 返回被删除的两个元素
console.log(a) //[2,3]   //原数组改变
var result2=a.splice(0,0,4,5) //删除0个在索引值为0的元素前边添加元素4,5
console.log(result2)  //[] 并为对原数组中的元素进行操作
console.log(a)  //[4,5,2,3]
var result3=a.splice(0,2,6,7)//删除从索引值为0的元素起的两个元素,然后在索引值为0的元素前边添加元素6,7 
console.log(result3)  //[4,5] 删除元素
console.log(a) //[6,7,2,3]

11、indexOf()
返回元素在数组中的索引值,indexOf(element,fromIndex)接受两个参数,第一个参数为要查找的项,第二个可选,默认为0,为查找起始索引值,当设置的查找起始索引值大于要查找的元素的索引值时返回-1,数组中不存在查找元素也返回-1。当数组中存在多个相同查找元素时只会返回第一个查找到的元素的索引值

var a=[1,4,2,3,6,9,4,5]
console.log(a.indexOf(6)) //4
console.log(a.indexOf(4)) //1  返回查找到的第一个元素的索引值
console.log(a.indexOf(2,4)) //-1 从索引值4开始往后找,没找着

12、lastIndexOf()
跟indexOf()基本一样,不过查找起点为数组末尾,返回值依旧为元素的索引值。

var a=[1,4,2,3,6,9,4,5]
console.log(a.lastIndexOf(6))  //4
console.log(a.lastIndexOf(4))  //6 从数组末尾开始,找到了倒数第二项,因此返回倒数第二项的4元素的索引值
console.log(a.lastIndexOf(9,4))//-1  查找元素9,从倒数第四项开始查找,没找着

13、forEach()
对数组进行遍历,forEach(callbackfn(value,index,array)),包含一个回调函数为参数,回调函数存在三个参数,第一个为当前遍历的元素,第二个为当前遍历的元素的索引值,第三个则是数组本身。对数组中的每个元素都调用callback函数,没有返回值不会修改原数组

var a=[1,4,2,3]
var result=a.forEach((x,index,a)=>{
  return x++
})
console.log(result) //undefined
console.log(a) //[1,4,2,3]

14、map()
与forEach()类型,对每个数组元素调用callback回调函数,回调函数中的参数相同,但是会返回一个新数组不会修改原数组

var a=[1,4,2,3]
var result=a.map((value,index,a)=>{
  return ++value
})
console.log(result) //[2,5,3,4]
console.log(a)  //[1,4,2,3]

15、filter()
对数组中的元素过滤选择,filter(callback())跟map,forEach的参数一样,返回满足过滤条件组成的数组。

var a=[1,4,2,3]
var result=a.filter((x)=>{
  return x>=2&&x<=3
})
console.log(result) //[2,3]
console.log(a) //[1,4,2,3]

16、every()
判断数组中的所有元素是否都满足条件,所有都满足就返回true,否则返回false。every(callback())的参数跟上边的都一样。

var a=[1,4,2,3]
var result=a.every((value)=>{
  return value>=1
})
console.log(result) //true

17、some()
跟every类似,但是只需要数组中的一项满足条件即返回true。

var a=[1,4,2,3]
var result=a.some((value)=>{
  return value>=4
})
console.log(result)

18、reduce()
迭代数组中的所有元素,返回一个最终值。
reduce(callback(previousValue,currentValue,currentIndex,array),number)接受两个参数,第一个为回调函数,回调函数中存在四个参数:第一个为前一个值,第二个为当前值,第三个为当前值的索引值,第\四个则是数组本身; 第二个数组在调用reduce时添加的数值。

var a=[1,4,2,3]
var result=a.reduce((preValue,curValue,curIndex,arr)=>{
  return preValue+curValue //前一个值为当前元素之前所有值的总和,比如2的前一个值为4+1=5
})
console.log(result)  //10
var result1=a.reduce((preValue,curValue,curIndex,arr)=>{
  return preValue+curValue
},10)   //在数组迭代时添加了一个初始值10
console.log(result1)  //20

19、reduceRight()
跟reduce()类型,不过迭代从数组右边开始。

20、copyWithin()
将指定位置的成员复制到其他位置(覆盖原成员),返回改变后的数组,会修改原数组
copyWithin(target,start,end)接受三个参数,target必须,从该位置开始替换数据;start可选,从该位置读取数据,默认为0;end可选,到该位置停止,默认数组长度。

var a=[1,4,2,3,5,6,7,8,9]
console.log(a.copyWithin(1,2,3)) //[1, 2, 2, 3, 5, 6, 7, 8, 9]
从索引值为1开始的元素进行替换,读取从索引值2开始到索引值3位置的所有元素,即(2),只读取了一个,所以只替换一个,将4变为2

console.log(a.copyWithin(1,2))//[1, 2, 3, 5, 6, 7, 8, 9, 9]
在上一个修改后的数组的基础上再次进行替换
从索引值为1开始的元素进行替换,读取从索引值2开始到最后,读取[2,3,5,6,7,8,9],将读取的数据从索引值1开始替换

console.log(a.copyWithin(1))//[1, 1, 2, 3, 5, 6, 7, 8, 9]
在上一个修改后的数组的基础上再次进行替换
从索引值为1开始的元素进行替换,从索引0开始到最后,读取[1, 2, 3, 5, 6, 7, 8, 9, 9],从索引1开始替换

21、entries()
返回数组的迭代对象,类似与generator函数的使用,采用next()来获取。

var a=[1,4,2,3]
var result=a.entries()
console.log(result.next())//{value: Array(2), done: false} array中有两个值,第一个为索引,第二个为值 这个array为[0,1]
console.log(result.next().value) //[1,4]
console.log(result.next().value) //[2,2]
console.log(result.next().value)  //[3,3]
console.log(result.next().value) //undefined

22、fill()
替换数组中的元素。返回修改后的数组,会改变原数组,fill(value,start,end)接受3个参数,第一个为替换值,start为替换开始索引值,默认为0;end为替换结束索引值,默认数组长度。

var a=[1,4,2,3]
console.log(a.fill(6,1,3))//[1,6,6,3]  
console.log(a) //[1,6,6,3]
console.log(a.fill(7)) //[7,7,7,7]

23、includes()
判断数组是否包含某个值,includes(value,fromIndex)

var a=[1,4,2,3]
console.log(a.includes(4))  //true
console.log(a.includes(5))  //false

24、Array.isArray()
判断是否为数组

var a=[1,4,2,3]
console.log(Array.isArray(a)) //true

25、keys()
返回数组的key

var a=[1,4,2,3]
console.log([...a.keys()]) //[0,1,2,3]

26、toString()
将数组变成字符串

var a=[1,4,2,3]
console.log(a.toString()) //1,4,2,3
发布了20 篇原创文章 · 获赞 33 · 访问量 3218

猜你喜欢

转载自blog.csdn.net/qq_42880714/article/details/104710767