常用的数组方法_常用的数组方式-优快云博客

本文链接：https://blog.youkuaiyun.com/yonglingyu/article/details/106574006

本文详细介绍了JavaScript中数组的常见方法，包括改变原数组的方法如unshift、shift、push、pop、splice、reverse、sort，以及不改变原数组的方法如join、slice、concat。同时，还介绍了ES5新增的数组方法，如isArray、forEach、indexOf、lastIndexOf、every、some、filter、map、reduce。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

常见的数组方法

数组是什么

关键词:数组方法

数组是什么

数组是引用数据类型,也是对象的一种,简单来说,就是一组数据的集合,存储在单个变量下的优雅方式,变量保存了单个的值,数组保存了一堆的值,数组是数据的集合。

常用的数组方法

常用的数组方法有两大类：一类是执行后改变原数组,一类是执行后不改变原数组

执行后改变原来的数组

Array.unsift():在数组的开头添加一个或者多个元素,返回新的数组的长度,改变原来的数组

var arr = [1,2,3,4];
console.log(arr.unshift(2))//在数组的开头插入元素2,返回的长度为5
console.log(arr)//将arr打印出来显示的是:[2,1,2,3,4]

Array.shift():删除数组的第一个元素,返回删除的这个元素,直接在原数组操作,不会生成新数组,改变原来的数组

var arr = [1,2,3,4]
console.log(arr.shift())//控制台打印出来的显示1
console.log(arr)//控制台打印出来显示:[2,3,4]

Array.push():在数组的最后添加一个或者多个元素,返回新数组的长度,改变原来的数组

var arr = [1,2,3,4]
console.log(arr.push(5,6))//控制台显示:6
console.log(arr.arr)//控制台打印显示:[1,2,3,4,5,6]

Array.pop():将数组的最后一个元素删除,返回删除的这个元素,直接在原数组操作,不会生成新的数组,改变原来的数组

var arr  = [1,2,3,4]
console.log(arr.pop())//控制台打印显示:1
console.log(arr)//控制台打印显示:[2,3,4]

Array.splice(index):截取插入,从index下标位置开始向后截取元素,直到末尾,返回截取后的元素组成新数组,原数组发生改变

var arr = [1,2,3,4]
console.log(arr.splice(1))//控制台打印显示[2,3,4]
console.log(arr)//控制台打印显示[2,3,4]

Array.splice(index,num):从index下标的位置开始向后截取num个元素,返回值:被删除的元素的集合,截取的这些元素组成一个新的数组返回,原数组改变

var arr = [1,2,3,4]
console.log(arr.splice(1,2))//控制台显示[2,3]
console.log(arr)//控制台打印显示[1,4]

Array.splice(index,num,num2):从index下标位置开始截取num个元素,截取的这些元素组成一个新数组返回,后面所有的参数作为元素从index位置开始插入,也叫添加元素

var arr = [1,2,3,4]
console.log(arr.splice(1,2,3))//控制台打印显示[2,3]
console.log(arr)//控制台打印显示[1,3,4]

Array.reverse():将原数组倒叙排列,返回新的数组

var arr = [1,2,3,4]
console.log(arr.reverse())//控制台打印显示[4,3,2,1]
console.log(arr)//控制台打印显示[4,3,2,1]

Array.sort(fn):按照指定的规则进行排序,如果不写参数,默认是按照字符编码顺序排列的,如果写参数,参数fn是表示排序规则的函数,返回值就是排好序的数组,直接在原数组操作

var arr = [1,2,3,4]
console.log(arr.sort(function(a,b){
	return b-a;//b-a表示从大到小排序
}))//控制台打印显示[4,3,2,1]
console.log(arr)//控制台打印显示[4,3,2,1]

执行后不改变原来的数组

Array.join():将数组转换成字符串,输出结果默认有逗号隔开

var arr = [1,2,3,4]
var str = arr.join()
console.log(str)//控制台打印显示1,2,3,4
console.log(arr)//控制台打印显示[1,2,3,4]

Array.slice():将原数组拷贝

var arr = [1,2,3,4]
var arr2 = arr.slice()
console.log(arr)//控制台打印显示[1,2,3,4]
console.log(arr2)//控制台打印显示[1,2,3,4]

Array.slice(index):从index下标位置开始向后截取元素,直到末尾,返回截取后的元素组成新数组,原数组发生改变,和splice()的第一种用法一样,但是原数组不会发生改变

var arr = [1,2,3,4]
var arr2 = arr.slice(2)
console.log(arr)//控制台打印显示[1,2,3,4]
console.log(arr2)//控制台打印显示[3,4]

Array.slice(startIndex,endIndex):从startIndex位置开始向后截取到endIndex位置(不含结束元素)的元素,截取的这些元素组成新数组返回,原数组不变,含头不含尾

var arr = [1,2,3,4]
var arr2 = arr.slice(1,2)
console.log(arr)//控制台打印显示[1,2,3,4]
console.log(arr2)//控制台打印显示[2]

Array.concat():将一个或者多个数组合并到原数组中,组成新的数组返回

var arr = [1,2,3,4]
var arr2 = arr.slice(1,2)
console.log(arr)//控制台打印显示[1,2,3,4]
console.log(arr2)//控制台打印显示[2]

ES5数组新增方法

Array.isArray(val):判断val是不是一个数组,是数组返回true,不是返回false

var arr = [1,2,3,4]
console.log(Array.isArray(arr))//打印结果为true

Array.forEach(function(value,index){要循环执行的函数}):遍历数组,本质上是一个for循环,不会改变原数组,函数有两个参数,第一个是循环到的那个数组元素的值,第一个形参是循环到的那个数组的下标,没有返回值

var arr = [1,2,3,4]
arr.forEach(function(value,index){
	//这里value表示元素的值,index表示下标
	console.log(index,value)
	/*控制台打印结果为:   0 1  
						1 2
						2 3
						3 4
						*/
})

Array.indexOf(ele):检测元素在数组中是否存在,存在返回所在下标,不存在返回-1

var arr = ["a","b","c","d"]
console.log(arr.indexOf("c"))//控制台打印 2,表示存在

Array.indexOf(ele,index):从index位置开始向后检测元素在数组是否存在,存在返回所在下标,不存在返回-1

var arr = ["a","b","c","d"]
//从下标3开始查找元素c
console.log(arr.indexOf("c",3))//打印显示-1,表示不存在

Array.lastIndexOf(ele):从后往前检测元素在数组中是否存在,存在返回所在下标(从后往前数的下标),不存在返回-1
Array.lastIndexOf(ele,index):从后往前检测元素在数组中是否存在,存在返回所在下标(从后往前数的下标),不存在返回-1

var arr = ["a","b","c","d"]
//从后往前找,从下标3开始找,c
console.log(arr.lastIndexOf("c",3))//打印显示2,表示存在

Array.every(function(value,index){}):判断数组中的所有元素是否满足条件(数组中的每一个元素都要满足条件),方法执行完毕返回布尔值,数组的每一个成员都会支持一个回调,当回调函数返回false,结束循环,只有每一个元素执行的回调都为true的时候,every执行的结果才是true

var arr = [1,2,3,4,5]
console.log(arr.every(function(value,index){
	//查找数组中元素大于0的
	return value > 0
}))//打印显示true

Array.some(function(value,index){}):判断数组中是否存在某个值,只要有一个执行的结果满足条件,就返回true,结束循环

var arr = [1,2,3,4,5]
console.log(arr.some(function(value,index){
	//查找数组中元素大于6的
	return value > 6
}))//打印显示false

Array.filter(function(value,index){}):过滤,执行返回一个新的数组,根据每个元素返回条件的过滤

var arr = [1,2,3,4,5]
console.log(arr.filter(function(value,index){
	//查找数组中元素大于3的
	return value > 3
}))//打印显示[4,5]

Array.map(function(value,index){}):映射,返回一个新的数组,返回值每一次循环你的函数的返回值的集合

var arr = [1,2,3,4,5]
console.log(arr.map(function(value,index){
	//数组中每个值都加2
	return value + 2
}))//打印显示[3,4,5,6,7]

Array.reduce(fucntion(prev,next){}):归并,可用于一组数组的求和,返回值是最后一个循环的返回体

var arr = [1,2,3,4,5]
console.log(arr.reduce(function(prev,next){
	return prev + next
}))//打印显示15