JavaScript数组常用操作方法详解

作者:小括号时间:2026-10-30 07:07:09浏览:438

本文系统介绍JavaScript中数组的核心操作方法,涵盖增加元素(push、unshift)、删除元素(pop、shift)、翻转(reverse)、转换字符串(join)、查找索引(indexOf)以及截取与合并(slice、splice、concat)。通过具体代码示例解析各方法的返回值、对原数组的影响及参数用法,帮助开发者高效掌握数组处理技巧。

数组元素的增删操作

pop方法用于移除数组的最后一个元素。

该方法会删除原数组的最后一项,并返回被删除元素的值;若数组为空,则返回undefined。


var a = [1,2,3,4,5];
a.pop();//a:[1, 2, 3, 4]
a.pop();//a:[1, 2, 3]
a.pop();//a:[1, 2] 

shift方法用于移除数组的第一个元素。

该方法会删除原数组的第一项,并返回被删除元素的值;若数组为空,则返回undefined。


var a = [1,2,3,4,5]; 
a.shift(); //a:[2,3,4,5]
a.shift(); //a:[3, 4, 5] 

push方法用于在数组末尾添加一个或多个元素。

调用该方法后,会返回新数组的长度。


var a = [1,2,3,4,5]; 
a.push(6);//[1, 2, 3, 4, 5, 6]
aa.push('xx');//[1, 2, 3, 4, 5, 6, "xx"] 返回长度7
a.push('yy');//[1, 2, 3, 4, 5, 6, "xx", "yy"] 返回长度8 

unshift方法用于在数组开头添加一个或多个元素。

调用该方法后,会返回新数组的长度。


var a = [1,2,3,4,5]; 
a.unshift();//[1, 2, 3, 4, 5]
a.unshift("cc");//["cc", 1, 2, 3, 4, 5] 返回长度6
a.unshift("aaa");//["aaa", "cc", 1, 2, 3, 4, 5] 返回长度7 

数组翻转与字符串转换

reverse方法用于将数组元素顺序翻转。

该方法会直接修改原数组的顺序,并返回翻转后的原数组引用。


var a = [1,2,3,4,5]; 
a.reverse()//a:[5, 4, 3, 2, 1] 返回[5, 4, 3, 2, 1] 

join方法用于将数组元素连接成一个字符串。

该方法返回生成的字符串,原数组保持不变。


var a = [1,2,3,4,5]; 
var b=a.join('||');//b:"1||2||3||4||5" a:[1,2,3,4,5] 

数组索引查找与截取

indexOf方法用于查找指定元素在数组中的索引位置。

该方法返回元素首次出现的索引(从0开始);若未找到该元素,则返回-1。


var a = ['a','b','c','d','e']; 
a.indexOf('a');//0
a.indexOf(a);//-1
a.indexOf('f');//-1
a.indexOf('e');//4

slice方法用于从数组中截取指定范围的元素,生成一个新数组。

该方法返回从起始索引(包含)到结束索引(不包含)之间的元素组成的新数组,原数组保持不变,索引从0开始计算。


var a = ['a','b','c','d','e']; 
a.slice(1,3);//["b", "c"] a:['a','b','c','d','e']
a.slice(0,4);//["a", "b", "c", "d"]
a.slice(3,4);//["d"]

数组剪接与合并

splice方法用于剪切、插入或删除数组元素,会直接修改原数组。它可实现类似shift前删除、pop后删除、unshift前增加及push后增加的效果。

该方法返回被剪切的元素组成的数组,原数组发生变化,索引从0开始。


/*参数是2个*/
//第一参数是索引(从0开始),第二是长度
var a = ['a','b','c','d','e']; 
a.splice(0,2);//["a", "b"] a:["c", "d", "e"]
a.splice(0,2);//["c", "d"] a:["e"]
var a = ['a','b','c','d','e']; 
a.splice(0,1);//["a"] a:["b", "c", "d", "e"] 同shift前删除
var a = ['a','b','c','d','e']
a.splice(a.length-1,1)l//["e"] a:["a", "b", "c", "d"] 同pop前删除
/*参数大于2个*/
//splice(start,deleteCount,val1,val2,...):从start位置开始删除deleteCount项,并从该位置起插入val1,val2,... 
var a = ['a','b','c','d','e']; 
a.splice(3,1,10,21,238,99);//["d"] a:["a", "b", "c", 10, 21, 238, 99, "e"]
var a = ['a','b','c','d','e']; 
a.splice(a.length,100000000,88)//返回 [] 从最后元素后面的元素,截取长度任意个,肯定是空 a:["a", "b", "c", "d", "e", 88] 同push后增加
var a = ['a','b','c','d','e']; 
a.splice(a.length,0,88)//返回 [] 从最后元素后面的元素,截取长度任意个,肯定是空 a:["a", "b", "c", "d", "e", 88] 同push后增加
var a = ['a','b','c','d','e'];
a.splice(0,0,88,99)//返回 [] 从第一个元素,截取长度0个 肯定是空 a:[88, 99, "a", "b", "c", "d", "e"] 同unshift前增加 

concat方法用于合并两个或多个数组。

该方法返回合并后的新数组,原数组保持不变。


var a = ['a','b','c','d','e']; 
a.concat([88,99]);//["a", "b", "c", "d", "e", 88, 99] a:["a", "b", "c", "d", "e"]
var b= [9999,10000]
a.concat(b);// ["a", "b", "c", "d", "e", 9999, 10000] a:["a", "b", "c", "d", "e"]

以上介绍了JavaScript中数组的常见操作,包括增加、删除、翻转、转字符串、取索引、截取(slice)、剪接(splice)及数组合并(concat)。希望这些内容能对您有所帮助,如有疑问欢迎留言,我们将及时回复。感谢支持!

作者最新文章