在 JavaScript 中向列表添加元素

2025 年 3 月 29 日 | 阅读 3 分钟

在 JavaScript 中,向数组或列表添加元素有多种方法。每种方法都有其独特的应用和易于访问性。每种方法都很有用,选择最佳方法可以优化问题。

让我们来看看在 JavaScript 中向数组添加元素的 10 种方法。

  1. push(): 此技术将元素附加到数组的末尾。
  2. unshift(): 附加到开头
  3. concat(): 合并数组,而不更改源数组。
  4. 扩展运算符 (...): 它可以快速简便地将元素添加到数组中。
  5. splice(): 通过添加或删除元素来更改给定列表中的数组。
  6. slice(): 此策略通过与其他方法合并来添加元素。
  7. Array.from(): 此技术使用附加的部分创建一个新数组。
  8. Apply(): 将多个元素集成到数组中。
  9. reduce(): 扩展数组的灵活技术。
  10. map(): 它通过添加和更改元素来创建一个新数组。

了解这些策略可以使您轻松应对各种情况,并确保您可以根据您的需求以最佳方式处理数组。以下是对在应用每种策略时需要考虑的其他一些事项的更深入的了解。

1. push()

push 方法通过在其末尾附加一个或多个元素来更改数组的长度。

代码

输出

 
[ 'apple', 'banana', 'orange', 'grape' ]   

2. unshift()

unshift 函数通过在其开头附加一个或多个元素来更改数组的长度。

代码

输出

 
 [ 'mango', 'pineapple', 'apple', 'banana' ]   

3. concat()

concat 函数将至少两个数组连接在一起。此技术返回一个新数组,而不是更改现有的数组。

代码

输出

 
[ 'apple', 'banana', 'cherry', 'strawberry' ]   

4. 扩展运算符

通过扩展运算符将元素添加到数组中是一种非常简洁的方法。

代码

输出

 
[ 'apple', 'banana', 'cherry', 'strawberry' ]   

5. splice()

splice 函数通过插入新元素替换或删除旧元素来修改数组的项。

代码

输出

 
[ 'apple', 'cherry', 'strawberry', 'banana' ]   

6. slice()

虽然它不能直接添加元素,但 slice() 方法可以与不同的过程相关使用来扩展数组的大小。

代码

输出

 
[ 'apple', 'cherry', 'strawberry', 'banana' ]   

7. Array.from()

使用类数组对象或可迭代对象,Array.from() 创建数组的新实例。您可以使用此策略以富有创意的方式添加项目。

代码

输出

 
[ 'apple', 'banana', 'cherry', 'strawberry' ]   

8. apply()

可以使用 apply() 方法将多个元素推入数组。

代码

输出

 
[ 'apple', 'banana', 'cherry', 'strawberry' ]   

9. reduce()

使用 reduce() 方法,数组的每个元素都应用一个 reducer 函数,该函数会生成一个单独的结果值。可以调整以包含更多项的数组。

代码

输出

 
 [ 'apple', 'banana', 'cherry', 'strawberry' ]   

10. map()

尽管 map() 主要用于修改数组元素,但它也可以用于创建带有附加元素的新数组。

代码

输出

 
[ 'apple', 'banana', 'cherry', 'strawberry' ]