javascript数组常用方法有哪些
常用方法：1、push()；2、unshift()；3、pop()；4、shift()；5、splic()；6、slice()；7、sort()；8、concat()；9、reverse()；10、join()；11、forEach()等。
本教程操作环境：windows7系统、javascript1.8.5版、Dell G3电脑。
javascript数组的常用方法
数组提供了一些常用方法，可实现数组元素的添加、删除、替换以及排序等功能。
1) push(元素1,…,元素n)
push() 方法可把参数指定的元素依次添加到数组的末尾，并返回添加元素后的数组长度（该方法必须至少有一个参数）。示例如下：
var arr = [1,2,3]; alert(arr.push(4));//返回最终数组的长度:4 alert(arr);//返回：1,2,3,4 alert(arr.push(5,6,7));//返回最终数组的长度:7 alert(arr);//返回：1,2,3,4,5,6,7
2) unshift(元素1,…,元素n)
unshift() 方法可把参数指定的元素依次添加到数组的前面，并返回添加元素后的数组长度。该方法必须至少有一个参数。注意：IE6、IE7 不支持方法的返回值。示例如下：
var arr = [1,2,3]; alert(arr.unshift('a'));//返回最终数组的长度:4 alert(arr);//返回：a,1,2,3 alert(arr.unshift('b','c','d'));//返回最终数组的长度:7 alert(arr);//返回：b,c,d,a,1,2,3
3) pop()
pop() 方法可弹出（删除）数组最后一个元素，并返回弹出的元素。示例如下：
var arr = ['A','B','C','D']; alert(arr.pop());//返回：D alert(arr);//返回：A,B,C
4) shift()
shift() 方法可删除数组第一个元素，并返回删除的元素。示例如下：
var arr = ['A','B','C','D']; alert(arr.shift());//返回：A alert(arr);//返回：B,C,D
5) splice(index,count[,元素1,…,元素n])
splic() 方法功能比较强，它可以实现删除指定数量的元素、替换指定元素以及在指定位置添加元素。这些不同功能的实现需要结合方法参数来确定：
当参数只有 index 和 count 两个参数时，如果 count 不等于 0，splice() 方法实现删除功能，同时返回所删除的元素：从 index参数指定位置开始删除 count 参数指定个数的元素；
当参数为 3 个以上，且 count 参数不为0时，splice() 方法实现替换功能，同时返回所替换的元素：用第三个及其之后的参数替换 index 参数指定位置开始的 count 参数指定个数的元素；
当参数为 3 个以上，且 count 参数为 0 时，splice() 方法的实现添加功能：用第三个及其之后的参数添加到 index 参数指定位置上。
splice() 方法实现的各个功能示例如下。
① 使用 splice() 从指定位置删除指定个数的元素：
var arr = ['A','B','C','D']; //2个参数，第二个参数不为 0，实现删除功能 alert(arr.splice(0,2)); alert(arr); //返回C,D
② 使用 splice() 用指定元素替换从指定位置开始的指定个数的元素：
var arr = ['A','B','C','D']; //3个参数，第二个参数不为 0，实现替换功能：用 a 替换掉 A，返回：A alert(arr.splice(0,1,'a')); alert(arr); //返回:a,B,C,D alert(arr.splice(0,2,'a or b'));//用a or b替换掉a和B，返回a,B alert(arr); //返回：a or b,C,D
③ 使用 splice() 在指定位置添加指定的元素：
var arr = ['A','B','C','D']; //4个参数，第二个参数为 0，实现添加功能：在下标为 1 处添加 aaa,bbb，没有返回值 alert(arr.splice(1,0,'aaa','bbb')); alert(arr);//返回：A,aaa,bbb,B,C,D
【例 1】使用 splice() 方法实现数组去重。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>使用splice方法实现数组去重</title>
<script>
var arr = [1,2,2,2,4,2];
for(var i = 0; i < arr.length; i++){
for(var j = i + 1; j < arr.length; j++){
if(arr[i] == arr[j]){
arr.splice(j,1);//删除 j 位置处的元素
j--;
}
}
}
alert(arr);//返回1,2,4三个元素
</script>
</head>
<body>
</body>
</html>上述代码使用了具有两个参数的 splice()，实现了删除指定元素的功能。
6) slice(index1[,index2])
slice() 方法返回包含从数组对象中的第 index1～index2-1 之间的元素的数组。index2 参数可以省略，省略时表示返回从 index1 位置开始一直到最后位置的元素。需要注意的是，该方法只是读取指定的元素，并不会对原数组作任何修改。
示例如下：
var arr = ['A','B','C','D']; alert(arr.slice(0,3)); //返回：A,B,C alert(arr); //返回A,B,C,D alert(arr.slice(0)); //返回数组全部元素：A,B,C,D alert(arr); //返回A,B,C,D
7) sort()、sort(compareFunction)
sort() 方法用于按某种规则排序数组：当方法的参数为空时，按字典序（即元素的 Unicode 编码从小到大排序顺序）排序数组元素；当参数为一个匿名函数时，将按匿名函数指定的规则排序数组元素。sort() 排序后将返回排序后的数组，示例如下。
① 按字典序排序数组。
var arr = ['c','d','a','e']; alert(arr.sort()); //返回排序后的数组：a,c,d,e alert(arr); //返回排序后的数组：a,c,d,e
从上述代码，我们可看到没有参数时，sort() 按字典序排列数组中的各个元素。
下面我们再用元素的 sort() 对几个数字排序，看看结果如何：
var arr = [4,3,5,76,2,0,8]; arr.sort(); alert(arr); //返回排序后的数组：0,2,3,4,5,76,8
我们看到排序后，结果并不是所预期的 76 最大应排在最后，反而是 8 排在最后，似乎 8 在这些元素中是最大的，即元素并没按数字大小进行排序。
为什么会出现这样的结果呢？这是因为 sort() 默认是对每个元素按字符串进行排序，排序时会从左到右按位比较元素的每位字符，对应位的 Unicode 编码大的就意味着这个元素大，此时将不再对后面的字符进行比较；对应位字符相同时才比较后面位置的字符。显然上述数组的排序使用了 sort() 的默认排序规则。此时要让数组中的元素按数字大小进行排序，就必须通过匿名函数参数来修改排序规则。
② 按匿名函数参数指定的规则排序数组。
下面通过定义匿名函数来修改 sort() 的默认排序规则，实现对上面数字元素按数字大小进行排序：
var arr = [4,3,5,76,2,0,8];
arr2.sort(function(a,b){
return a-b;//从小到大排序
//return b-a;//从大到小排序
});
alert(arr);//返回排序后的数组：0,2,3,4,5,8,76说明：匿名函数中返回第一个参数减第二个参数的值，此时将按元素数值从小到大的规则排序各个元素：当两个参数的差为正数时，前后比较的两个元素将调换位置排序；否则元素不调换位置。如果返回第二个参数减第一个参数的值，则按元素数值从大到小的规则排序各个元素，元素调换规则和从小到大类似。
当数组元素的前缀为数字而后缀为字符串时，如果希望这些元素能按数字大小进行排序，此时需对匿名函数中的参数作一些变通处理。因为这些参数代表了数组元素，所以它们也是一个包含数字和字符的字符串，因此要按数字大小来排序它们，就需要将参数解析为一个数字，然后再返回这些解析结果的差。
示例如下：
var arrWidth = ['345px','23px','10px','1000px'];
arrWidth.sort(function(a,b){
return parseInt(a)-parseInt(b);
});
alert(arrWidth);//排序后的结果为：10px,23px,345px,1000px此外，我们通过匿名函数，还可以实现随机排序数组元素。示例如下：
var arr = [1,2,3,4,5,6,7,8];
arr.sort(function(a,b){
return Math.random()-0.5;//random()返回：0～1之间的一个值
});
alert(arr);//排序后的结果为：4,3,1,2,6,5,7,8。注意：每次执行的结果可能会不一样上述代码中的匿名函数并没有返回两个参数的差值，而是返回 Math 对象中的 random() 随机函数和 0.5 的差值，这就使得元素的排序将不是根据元素大小来排序。由于 random() 的值为 0～1 之间的一个随机值，所以它和 0.5 的差时正时负，这就导致数组元素位置的调换很随机，所以排序后的数组是随机排序的。
8) concat(数组1,…,数组n)
concat() 将参数指定的数组和当前数组连成一个新数组。示例如下：
var arr1 = [1,2,3]; var arr2 = [4,5,6]; var arr3 = [7,8,9]; alert(arr1.concat(arr2,arr3));//最终获得连接后的数组：1,2,3,4,5,6,7,8,9
9) reverse()
reverse() 方法可返回当前数组倒序排序形式。示例如下：
var arr = [1,2,3,4,5,6]; alert(arr.reverse());//返回：6,5,4,3,2,1
10) join(分隔符)
join() 方法可将数组内各个元素按参数指定的分隔符连接成一个字符串。参数可以省略，省略参数时，分隔符默认为“逗号”。
11) forEach()
forEach() 方法用于对数组的每个元素执行一次回调函数。
语法如下：
array对象.forEach(function(currentValue[,index[,array]])[,thisArg])
forEach() 方法的第一个参数为 array 对象中每个元素需要调用的函数。
forEach() 方法中的各个参数说明如下：
currentValue 参数：必需参数，表示正在处理的数组元素（当前元素）；
index 参数：可选参数，表示正在处理的当前元素的索引；
array 参数：可选参数，表示方法正在操作的数组；
thisArg 参数，可选参数，取值通常为 this，为空时取值为 undefined。
forEach() 函数的返回值为 undefined。示例如下：
var fruit = ["苹果","橙子","梨子"];
fruit.forEach(function(item,index){
console.log("fruit[" + index + "] = " + item);
});上述示例的运行后将在控制台中分别显示：fruit[0]=苹果、fruit[1]=橙子和fruit[2]=梨子。
12) filter()
filter() 方法用于创建一个新的数组，其中的元素是指定数组中所有符合指定函数要求的元素。
语法如下：
array对象.filter(function(currentValue[,index[,array]])[,thisArg])
filter() 方法的第一个参数为回调函数，array 对象中每个元素都需要调用该函数，filter() 会返回所有使回调函数返回值为 true 的元素。
filter() 方法中的各个参数说明如下：
currentValue 参数：必需参数，表示正在处理的数组元素（当前元素）；
index 参数：可选参数，表示正在处理的当前元素的索引；
array 参数：可选参数，表示方法正在操作的数组；
thisArg 参数，可选参数，取值通常为 this，为空时取值为 undefined。
filter() 函数返回一个新数组，其中包含了指定数组中的所有符合条件的元素。如果没有符合条件的元素则返回空数组。
示例如下：
var names1 = ["张山","张小天","李四","张萌萌","王宁","陈浩"];//原数组
function checkName(name){ //定义回调函数，判断名字是否姓“张”
if(name.indexOf("张") != -1){
return true;
}else{
return false;
}
}
var names2 = names1.filter(checkName);//对names1执行回调用函数，返回所有姓张的名字
names2.forEach(function(item,index){//遍历names2数组中的每个元素
console.log("names2[" + index + "] = " + item);
});上述示例运行后将在控制台中分别显示：names2[0]=张山、names2[1]=张小天和names2[2]=张萌萌。
13) map()
map() 方法用于创建一个新的数组，其中的每个元素是指定数组的对应元素调用指定函数处理后的值。
语法如下：
array对象.map(function(currentValue[,index[,array]])[,thisArg])
map() 方法的第一个参数为回调函数，array 对象中每个元素都需要调用该函数。
map() 方法中的各个参数说明如下：
currentValue 参数：必需参数，表示正在处理的数组元素（当前元素）；
index 参数：可选参数，表示正在处理的当前元素的索引；
array 参数：可选参数，表示方法正在操作的数组；
thisArg 参数，可选参数，取值通常为 this，为空时取值为 undefined。
map() 函数返回一个新数组，其中的元素为原始数组元素调用回调函数处理后的值。示例如下：
var number = [1,2,3];//原数组
var num=number.map(function(item){//对原数组中的每个元素*2，将值分别存储在num数组中
return item * 2;
});
num.forEach(function(item,index){//遍历num中的每个元素
console.log("num[" + index + "]=" + item);
});上述示例运行后将在控制台中分别显示：num[0]=2、num[1]=4和num[2]=6。
14) reduce()
reduce() 用于使用回调函数对数组中的每个元素进行处理，并将处理进行汇总返回。语法如下：
array对象.reduce(function(result,currentValue[,index[,array]])[,initialValue])
reduce() 方法的第一个参数为回调函数。
reduce() 方法中的各个参数说明如下。
result 参数：必需参数，表示初始值或回调函数执行后的返回值。在第一次调用回调函数前，result 参数表示初始值；在调用回调函数之后，result 参数表示回调函数执行后的返回值。
需要注意的是，如果指定了 initialValue 参数，则初始值就是 initialValue 参数值，否则初始值为数组的第一个元素。
currentValue 参数：必需参数，表示正在处理的数组元素（当前元素）。
需要注意的是，如果指定了 initialValue 参数，则第一次执行回调函数时的 currentValue 为数组的第一个元素，否则为第二个元素。
index 参数：可选参数，表示正在处理的当前元素的索引。
array 参数：可选参数，表示方法正在操作的数组。
initialValue 参数，可选参数，作为第一次调用回调函数时的第一个参数的值。如果没有提供该参数，第一次调用回调函数时的第一个参数将使用数组中的第一个元素。
需要注意的是：对一个空数组调用 reduce() 方法时，如果没有指定 initialValue 参数此时将会报错。
reduce() 的使用示例如下：
var num1 = [1,3,6,9];
//reduce()没有initialValue参数
var num2 = num1.reduce(function(v1,v2){ //①
return v1 + 2 * v2;//将当前元素值*2后和初始值或函数的前一次执行结果进行相加
});
console.log("num2=" + num2);//输出：num2=37
//reduce()提供了initialValue参数
var num3 = num1.reduce(function(v1,v2){ //②
return v1 + 2 * v2;//将当前元素值*2后和初始值或函数的前一次执行结果进行相加
},2);
console.log("num3=" + num3); //输出：num3=40上述示例中，① 处调用的 reduce() 没有指定 initialValue 参数，因而初始值为数组的第一个元素，即 1，此时 reduce() 的执行过程等效于：1+2*3+2*6+2*9 运算表达式的执行，结果返回 37。② 处调用的 reduce() 指定了值为 2 的 initialValue 参数，因而初始值为 2，此时 reduce() 的执行过程等效于：2+2*1+2*3+2*6+2*9 运算表达式的执行，结果返回 40。
15) find()
find() 用于获取使回调函数值为 true 的第一个数组元素。如果没有符合条件的元素，将返回 undefined。
语法如下：
array对象.find(function(currentValue[,index[,array]])[,thisArg])
filter() 方法的第一个参数为回调函数，array 对象中每个元素都需要调用该函数，filter() 会返回所有使回调函数返回值为 true 的元素。
filter() 方法中的各个参数说明如下：
currentValue 参数：必需参数，表示正在处理的数组元素（当前元素）；
index 参数：可选参数，表示正在处理的当前元素的索引；
array 参数：可选参数，表示方法正在操作的数组；
thisArg 参数，可选参数，取值通常为 this，为空时取值为 undefined。
find() 函数使用示例如下：
var names = ["Tom","Jane","Marry","John","Marissa"];
//定义回调函数
function checkLength(item){
return item.length >= 4;
}
var name = names.find(checkLength);//返回名字数组中名字长度大于或等于4的第一个名字
console.log("name: " + name);上述示例运行后将在控制台中输出 name:Jane。
【相关推荐：javascript学习教程】
以上是javascript数组常用方法有哪些的详细内容。更多信息请关注PHP中文网其他相关文章！
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！
热门文章
热工具
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3汉化版
中文版，非常好用
禅工作室 13.0.1
功能强大的PHP集成开发环境
Dreamweaver CS6
视觉化网页开发工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
热门话题
微信删除的人如何找回（简单教程告诉你如何恢复被删除的联系人）
May 01, 2024 pm 12:01 PM
而后悔莫及、人们常常会因为一些原因不小心将某些联系人删除、微信作为一款广泛使用的社交软件。帮助用户解决这一问题，本文将介绍如何通过简单的方法找回被删除的联系人。1.了解微信联系人删除机制这为我们找回被删除的联系人提供了可能性、微信中的联系人删除机制是将其从通讯录中移除，但并未完全删除。2.使用微信内置“通讯录恢复”功能微信提供了“通讯录恢复”节省时间和精力，用户可以通过该功能快速找回之前被删除的联系人，功能。3.进入微信设置页面点击右下角，打开微信应用“我”再点击右上角设置图标、进入设置页面，，
手机字体大小设置方法（轻松调整手机字体大小）
May 07, 2024 pm 03:34 PM
字体大小的设置成为了一项重要的个性化需求，随着手机成为人们日常生活的重要工具。以满足不同用户的需求、本文将介绍如何通过简单的操作，提升手机使用体验，调整手机字体大小。为什么需要调整手机字体大小-调整字体大小可以使文字更清晰易读-适合不同年龄段用户的阅读需求-方便视力不佳的用户使用手机系统自带字体大小设置功能-如何进入系统设置界面-在设置界面中找到并进入"显示"选项-找到"字体大小"选项并进行调整第三方应用调整字体大小-下载并安装支持字体大小调整的应用程序-打开应用程序并进入相关设置界面-根据个人
手机版龙蛋孵化方法大揭秘（一步一步教你如何成功孵化手机版龙蛋）
May 04, 2024 pm 06:01 PM
手机游戏成为了人们生活中不可或缺的一部分，随着科技的发展。它以其可爱的龙蛋形象和有趣的孵化过程吸引了众多玩家的关注，而其中一款备受瞩目的游戏就是手机版龙蛋。帮助玩家们在游戏中更好地培养和成长自己的小龙，本文将向大家介绍手机版龙蛋的孵化方法。1.选择合适的龙蛋种类玩家需要仔细选择自己喜欢并且适合自己的龙蛋种类，根据游戏中提供的不同种类的龙蛋属性和能力。2.提升孵化机的等级玩家需要通过完成任务和收集道具来提升孵化机的等级，孵化机的等级决定了孵化速度和孵化成功率。3.收集孵化所需的资源玩家需要在游戏中
如何使用 foreach 循环去除 PHP 数组中的重复元素？
Apr 27, 2024 am 11:33 AM
使用foreach循环去除PHP数组中重复元素的方法如下：遍历数组，若元素已存在且当前位置不是第一个出现的位置，则删除它。举例而言，若数据库查询结果存在重复记录，可使用此方法去除，得到不含重复记录的结果。
PHP数组深度复制的艺术：使用不同方法实现完美复制
May 01, 2024 pm 12:30 PM
PHP中深度复制数组的方法包括：使用json_decode和json_encode进行JSON编码和解码。使用array_map和clone进行深度复制键和值的副本。使用serialize和unserialize进行序列化和反序列化。
PHP 数组键值翻转：不同方法的性能对比分析
May 03, 2024 pm 09:03 PM
PHP数组键值翻转方法性能对比表明：array_flip()函数在大型数组（超过100万个元素）下比for循环性能更优，耗时更短。手动翻转键值的for循环方法耗时相对较长。
如何选择手机膜，保护你的手机屏幕（选购手机膜的几大要点与技巧）
May 07, 2024 pm 05:55 PM
手机膜成为了必不可少的配件之一，随着智能手机的普及。延长其使用寿命，选择一款合适的手机膜可以保护手机屏幕。帮助读者选出最适合自己的手机膜、本文将介绍选购手机膜的几大要点与技巧。了解手机膜的材质及类型PET膜，TPU等、手机膜有多种材质，包括钢化玻璃。PET膜较为柔软、钢化玻璃膜具有较好的耐刮花性能，TPU则具有较好的防震性能。可以根据个人偏好及需求来决定，在选择时。考虑屏幕的保护程度不同类型的手机膜对屏幕的保护程度不同。PET膜则主要起到防刮花作用，钢化玻璃膜具有较好的耐摔性能。可以选择具有较好
PHP数组多维排序实战：从简单到复杂场景
Apr 29, 2024 pm 09:12 PM
多维数组排序可分为单列排序和嵌套排序。单列排序可使用array_multisort()函数按列排序；嵌套排序需要递归函数遍历数组并排序。实战案例包括按产品名称排序和按销售量和价格复合排序。
