JavaScript数组操作方法详解:push、pop、shift、unshift、concat、join、sort、slice、splice与reverse

作者:闭包旅人

时间:2026-10-23

浏览:583

本文详细解析JavaScript中Array对象的常用操作方法,包括向数组两端添加或移除元素的push、pop、shift、unshift方法,合并数组的concat方法,格式化输出的join方法,排序的sort方法,截取片段的slice与splice方法,以及反转数组的reverse方法。涵盖各方法的参数定义、返回值及版本要求,帮助开发者高效处理数组数据。

文章目录
push 方法

push 方法:添加元素到数组末尾

该方法用于向数组末尾追加新元素,并返回更新后的数组长度。


arrayObj.push([item1 [item2 [. . . [itemN ]]]])


参数说明


arrayObj:必选参数,指代需要操作的 Array 对象。


item, item2,... itemN:可选参数,代表要添加到数组末尾的新元素。


功能说明


push 方法会按照参数中元素出现的顺序依次将它们添加到数组中。若某个参数本身是数组,则该数组将被视为单个元素整体添加。如需合并多个数组的内容,建议使用 concat 方法。


示例代码


 


环境要求


版本 5.5


pop 方法

pop 方法:移除数组最后一个元素

该方法用于移除并返回数组的最后一个元素。


arrayObj.pop()


必选参数 arrayObj 必须是一个 Array 对象的引用。


功能说明


若数组为空,调用此方法将返回 undefined。


示例代码


 


环境要求


版本 5.5


shift 方法

shift 方法:移除数组第一个元素

该方法用于移除并返回数组的第一个元素。


arrayObj.shift( )


参数说明


必选参数 arrayObj 必须是一个 Array 对象的引用。


功能说明


shift 方法会移除数组中的首个元素,并将其作为返回值返回。


环境要求


版本 5.5


unshift 方法

unshift 方法:添加元素到数组开头

该方法用于将一个或多个元素插入到数组的起始位置,并返回修改后的数组。


arrayObj.unshift([item1[, item2 [, . . . [, itemN]]]])


参数说明


arrayObj:必选参数,指代需要操作的 Array 对象。


item1, item2,... itemN:可选参数,代表要插入到数组开头的新元素。


功能说明


unshift 方法将这些元素插入到数组的开始部分,因此它们在数组中的排列顺序与参数序列中的顺序一致。


环境要求


版本 5.5


concat 方法 (Array)

concat 方法:合并数组

该方法用于返回一个新数组,该数组由两个或更多个数组组合而成。


array1.concat([item1[, item2[, . . . [, itemN]]]])


参数说明


array1:必选参数,指代其他所有要进行连接的 Array 对象。


item1,... itemN:可选参数,代表要连接到 array1 末尾的其他项目。


功能说明


concat 方法返回一个 Array 对象,其中包含了 array1 和提供的任意其他项目的连接结果。


要添加的项目(item1 … itemN)会按照从左到右的顺序添加到数组中。如果某一项为数组,那么添加其内容到 array1 的末尾。如果该项目不是数组,就将其作为单个的数组元素添加到数组的末尾。


以下为从源数组复制元素到结果数组:


对于从正被连接到新数组的数组中复制的对象参数,复制后仍然指向相同的对象。不论新数组和源数组中哪一个有改变,都将引起另一个的改变。


对于连接到新数组的数值或字符串,只复制其值。一个数组中值有改变并不影响另一个数组中的值。


示例代码


下面这个例子说明了使用数组时 concat 方法的用法:


代码如下:

function ConcatArrayDemo(){
var a, b, c, d;
a = new Array(1,2,3);
b = "JScript";
c = new Array(42, "VBScript);
d = a.concat(b, c);
// 返回数组 [1, 2, 3, "JScript", 42, "VBScript"]
return(d);
} 

环境要求


版本 3


join 方法

join 方法:数组转字符串

该方法用于返回一个字符串值,其中包含了连接到一起的数组的所有元素,元素由指定的分隔符分隔开来。


arrayObj.join(separator)


参数说明


arrayObj:必选参数,指代 Array 对象。


separator:必选参数,是一个 String 对象,作为最终的 String 对象中对数组元素之间的分隔符。如果省略了这个参数,那么数组元素之间就用一个逗号来分隔。


功能说明


如果数组中有元素没有定义或者为 null,将其作为空字符串处理。


示例代码


下面这个例子说明了 join 方法的用法。


代码如下:

function JoinDemo(){
var a, b;
a = new Array(0,1,2,3,4);
b = a.join("-");
return(b);
} 

环境要求


版本 2


sort 方法

sort 方法:数组排序

该方法用于返回一个元素已经进行了排序的 Array 对象。


arrayobj.sort(sortfunction)


参数说明


arrayObj:必选参数,指代任意 Array 对象。


sortFunction:可选参数,是用来确定元素顺序的函数的名称。如果这个参数被省略,那么元素将按照 ASCII 字符顺序进行升序排列。


功能说明


sort 方法将 Array 对象进行适当的排序;在执行过程中并不会创建新的 Array 对象。


如果为 sortfunction 参数提供了一个函数,那么该函数必须返回下列值之一:


(1)负值,如果所传递的第一个参数比第二个参数小。


(2)零,如果两个参数相等。


(3)正值,如果第一个参数比第二个参数大。


示例代码


 


环境要求


版本 2


slice 方法 (Array)

slice 方法:截取数组片段

该方法用于返回数组的一段切片。


arrayObj.slice(start, [end])


参数说明


arrayObj:必选参数,指代一个 Array 对象。


start:必选参数,arrayObj 中所指定的部分的开始元素是从零开始计算的下标。


end:可选参数,arrayObj 中所指定的部分的结束元素是从零开始计算的下标。


功能说明


slice 方法返回一个 Array 对象,其中包含了 arrayObj 的指定部分。


slice 方法一直复制到 end 所指定的元素,但是不包括该元素。如果 start 为负,将它作为 length + start处理,此处 length 为数组的长度。如果 end 为负,就将它作为 length + end 处理,此处 length 为数组的长度。如果省略 end ,那么 slice 方法将一直复制到 arrayObj 的结尾。如果 end 出现在 start 之前,不复制任何元素到新数组中。


示例代码


在下面这个例子中,除了最后一个元素之外,myArray 中所有的元素都被复制到 newArray 中:


newArray = myArray.slice(0, -1)


splice 方法

splice 方法:增删改数组元素

该方法用于从一个数组中移除一个或多个元素,如果必要,在所移除元素的位置上插入新元素,返回所移除的元素。


arrayObj.splice(start, deleteCount, [item1[, item2[, . . . [,itemN]]]])


参数说明


arrayObj:必选参数,指代一个 Array 对象。


start:必选参数,指定从数组中移除元素的开始位置,这个位置是从 0 开始计算的。


deleteCount:必选参数,要移除的元素的个数。


item1, item2,... itemN:必选参数,要在所移除元素的位置上插入的新元素。


功能说明


splice 方法可以移除从 start 位置开始的指定个数的元素并插入新元素,从而修改 arrayObj。返回值是一个由所移除的元素组成的新 Array 对象。


环境要求


版本 5.5


reverse 方法

reverse 方法:反转数组顺序

该方法用于返回一个元素顺序被反转的 Array 对象。


arrayObj.reverse( )


参数说明


arrayObj:必选参数,该参数为 Array 对象。


功能说明


reverse 方法将一个 Array 对象中的元素位置进行反转。在执行过程中,这个方法并不会创建一个新的 Array 对象。


如果数组是不连续的,reverse 方法将在数组中创建元素以便填充数组中的间隔。这样所创建的全部元素的值都是 undefined。


示例代码


下面这个例子说明了 reverse 方法的用法:


代码如下:

function ReverseDemo(){
var a, l; // 声明变量。
a = new Array(0,1,2,3,4); // 创建数组并赋值。
l = a.reverse(); // 反转数组的内容。
return(l); // 返回结果数组。
} 

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章