js 操作数组的方法

在 JavaScript 中,数组对象提供了多种方法来操作数组。以下是一些常用的数组操作方法,包括它们的详细代码示例:

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

复制代码
`let array = [1, 2, 3];
array.push(4); // 添加单个元素
console.log(array); // 输出: [1, 2, 3, 4]

array.push(5, 6); // 添加多个元素
console.log(array); // 输出: [1, 2, 3, 4, 5, 6]`

2、pop() - 删除并返回数组的最后一个元素。

复制代码
`let array = [1, 2, 3, 4];
let lastElement = array.pop();
console.log(array); // 输出: [1, 2, 3]
console.log(lastElement); // 输出: 4`

3、shift() - 删除并返回数组的第一个元素。

复制代码
`let array = [1, 2, 3, 4];
let firstElement = array.shift();
console.log(array); // 输出: [2, 3, 4]
console.log(firstElement); // 输出: 1`

4、unshift() - 向数组的开头添加一个或多个元素,并返回新的长度。

复制代码
`let array = [1, 2, 3];
array.unshift(0); // 添加单个元素
console.log(array); // 输出: [0, 1, 2, 3]

array.unshift(-2, -1); // 添加多个元素
console.log(array); // 输出: [-2, -1, 0, 1, 2, 3]`

5、concat() - 用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。

复制代码
`let array1 = [1, 2, 3];
let array2 = [4, 5, 6];
let concatenatedArray = array1.concat(array2);
console.log(concatenatedArray); // 输出: [1, 2, 3, 4, 5, 6]`

6、slice() - 返回一个新的数组对象,这一对象是一个由开始到结束(不包括结束)选择的、由原数组的浅拷贝构成。原数组不会被改变。

复制代码
`let array = [1, 2, 3, 4, 5];
let slicedArray = array.slice(1, 3); // 从索引1开始到索引2(不包括)结束
console.log(slicedArray); // 输出: [2, 3]`

7、splice() - 通过删除、替换现有元素或者添加新元素来修改数组,并以数组的形式返回被修改的内容。

复制代码
`let array = [1, 2, 3, 4, 5];

// 从索引2开始,删除2个元素,并添加新元素6和7
let removedElements = array.splice(2, 2, 6, 7);
console.log(array); // 输出: [1, 2, 6, 7, 5]
console.log(removedElements); // 输出: [3, 4]`

8、map() - 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后的返回值。

复制代码
`let array = [1, 2, 3, 4];
let mappedArray = array.map(function(item) {
return item * 2;
});
console.log(mappedArray); // 输出: [2, 4, 6, 8]`

9、filter() - 创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

复制代码
`let array = [1, 2, 3, 4, 5];
let filteredArray = array.filter(function(item) {
return item > 2;
});
console.log(filteredArray); // 输出: [3, 4, 5]`

10、reduce() - 对累加器和数组中的每个元素(从左到右)应用一个函数,将其减少为单个输出值。

复制代码
`let array = [1, 2, 3, 4, 5];
let sum = array.reduce(function(accumulator,`
相关推荐
IT_陈寒6 分钟前
JavaScript性能优化:3个被低估的V8引擎技巧让你的代码提速50%
前端·人工智能·后端
云飞云共享云桌面12 分钟前
SolidWorks服务器多人使用方案
大数据·运维·服务器·前端·网络·电脑·制造
Algebraaaaa13 分钟前
Qt中的字符串宏 | 编译期检查和运行期检查 | Qt信号与槽connect写法
开发语言·c++·qt
Red Car14 分钟前
javascript 性能优化实例一则
开发语言·javascript·ecmascript
友友马15 分钟前
『 QT 』Hello World控件实现指南
开发语言·qt
艾小码19 分钟前
从Hello World到变量数据类型:JavaScript新手避坑指南
前端·javascript
一只学java的小汉堡28 分钟前
Java 面试高频题:HashMap 与 ConcurrentHashMap 深度解析(含 JDK1.8 优化与线程安全原理)
java·开发语言·面试
huohaiyu1 小时前
Hashtable,HashMap,ConcurrentHashMap之间的区别
java·开发语言·多线程·哈希
街尾杂货店&1 小时前
css word-spacing属性
前端·css
千叶寻-1 小时前
正则表达式
前端·javascript·后端·架构·正则表达式·node.js