JavaScript数组常用方法

本文详细介绍了JavaScript中数组的各种操作方法,包括toString()、join()、push()、pop()、shift()、unshift()、reverse()、sort()、concat()、slice()、splice()、indexOf()、lastIndexOf()、every()、some()、filter()、map()和forEach()等。这些方法在数组处理中起着关键作用,如添加、删除、查找、排序和转换等。同时,还探讨了如何使用JSON.stringify()和JSON.parse()进行序列化和反序列化,以及数组的深拷贝和浅拷贝问题。

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

数组序列化

toString() 在默认情况下都会以逗号分隔字符串的形式返回数组项

join() 使用指定的字符串用来分隔数组字符串

var arr = [1,5,2,8,10,{a:1}];
console.log(arr);//[ 1, 5, 2, 8, 10, { a: 1 } ]
console.log(arr.toString());//”1,5,2,8,10,[object Object]”
console.log(arr.join(""));//”152810[object Object]”
console.log(arr.join("-"));//”1-5-2-8-10-[object Object]”

// 数组也可以使用序列化工具进行转换,并且,数组也存在深拷贝浅拷贝的现象,也可以使用序列化工具解决此问题
var result = JSON.stringify(arr);
console.log(result);//”[1,5,2,8,10,{"a":1}]”
console.log(JSON.parse(result));//[ 1, 5, 2, 8, 10, { a: 1 } ]

栈与队列方法

Array.prototype.push()

push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
// push()  添加元素到末尾  参数是要添加的元素 返回值是修改之后数组的长度【改变原数组】
fruits.push("Kiwi")
console.log(fruits);
//fruits 结果输出:Banana,Orange,Apple,Mango,Kiwi

Array.prototype.pop()

pop() 方法用于删除数组的最后一个元素并返回删除的元素。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();
console.log(fruits);
//fruits 结果输出:Banana,Orange,Apple

Array.prototype.shift()

shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift()
console.log(fruits);
//fruits结果输出:Orange,Apple,Mango

Array.prototype.unshift()

unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon","Pineapple");
console.log(fruits)
//fruits 将输出:Lemon,Pineapple,Banana,Orange,Apple,Mango

排序方法

Array.prototype.reverse()

reverse() 方法用于颠倒数组中元素的顺序。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();
console.log(fruits)
//fruits结果输出:Mango,Apple,Orange,Banana

Array.prototype.sort()

sort() 方法用于对数组的元素进行排序。如果调用该方法时没有使用参数,将按字母顺序(Ascall编码)对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。如果要想进行升序或是降序排序的话,要提供比较函数。

排序顺序可以是字母或数字,并按升序或降序。

默认排序顺序为按字母升序。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
console.log(fruits)
//fruits 输出结果:Apple,Banana,Mango,Orange

数字排序:

var points = [40,100,1,5,25,10];
points.sort(function(a,b){
	return a-b
});
//points输出结果:1,5,10,25,40,100

var points = [40,100,1,5,25,10];
points.sort(function(a,b){
	return b-a
});
//fruits输出结果:100,40,25,10,5,1

操作方法

Array.prototype.concat()

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

var hege = ["Cecilie", "Lone"]; 
var stale = ["Emil", "Tobias", "Linus"]; 
var kai = ["Robin"]; 
var children = hege.concat(stale,kai);
//children 输出结果:Cecilie,Lone,Emil,Tobias,Linus,Robin

Array.prototype.slice()

slice() 方法可从已有的数组中返回选定的元素。

slice()方法可提取字符串的某个部分,并以新的字符串返回被提取的部分。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; 
var citrus = fruits.slice(1,3);
//citrus 结果输出:Orange,Lemon

Array.prototype.splice()

splice() 方法用于添加或删除数组中的元素。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
//从数组索引位置 2 开始,不删除元素,添加两个新的元素"Lemon","Kiwi"
fruits.splice(2,0,"Lemon","Kiwi");
//fruits输出结果:Banana,Orange,Lemon,Kiwi,Apple,Mango


var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,1,"Lemon","Kiwi");

//fruits输出结果:Banana,Orange,Lemon,Kiwi,Mango

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,2);

//fruits输出结果:Banana,Orange

位置方法

Array.prototype.indexOf()

indexOf() 方法可返回数组中某个指定的元素位置。

该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。

如果在数组中没找到指定元素则返回 -1。

var fruits = ["Banana", "Orange", "Apple", "Mango"]; 
var a = fruits.indexOf("Apple");

//a结果输出:2
//以上输出结果意味着 "Apple" 元素位于数组中的第 3 个位置。

Array.prototype.lastIndexOf()

lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找。

如果要检索的元素没有出现,则该方法返回 -1。

该方法将从尾到头地检索数组中指定元素 item。开始检索的位置在数组的 start 处或数组的结尾(没有指定 start 参数时)。如果找到一个 item,则返回 item 从尾向前检索第一个次出现在数组的位置。数组的索引开始位置是从 0 开始的。

如果在数组中没找到指定元素则返回 -1。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");

//a输出结果:2
//以上实例输出结果意味着 "Apple" 位于数组中的第 2 个位置.

迭代方法

Array.prototype.every()

every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。

every() 方法使用指定函数检测数组中的所有元素:

  • 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。

  • 如果所有元素都满足条件,则返回 true。

var ages = [32, 33, 16, 40];

var result = ages.every(function (age) {
  return age >= 18
})
console.log(result);//输出结果为:false

Array.prototype.some()

some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

some() 方法会依次执行数组的每个元素:

  • 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。

  • 如果没有满足条件的元素,则返回false。

var ages = [32, 33, 16, 40];

var result = ages.some(function (age) {
  return age >= 18
})
console.log(result);//输出结果为:true

Array.prototype.filter()

filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

var ages = [32, 33, 16, 40];

var result = ages.filter(function (age) {
  return age >= 18
})
console.log(result);//输出结果为:[ 32, 33, 40 ]

Array.prototype.map()

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

var numbers = [4, 9, 16, 25];

var result = numbers.map(function (number) {
  return Math.sqrt(number)
})
console.log(result);//输出结果为:[ 2, 3, 4, 5 ]

Array.prototype.forEach()

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

var numbers = [4, 9, 16, 25];

numbers.forEach(function (number, index) {
  console.log(index + ' -- ' + number);
})
// 0 -- 4
// 1 -- 9
// 2 -- 16
// 3 -- 25

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值