JS 添加数组元素( 4种方法 )

10,300次阅读
没有评论

共计 1583 个字符,预计需要花费 4 分钟才能阅读完成。

No. 内容链接
1 Openlayers【入门教程】–【源代码 + 示例 300+】
2 Leaflet【入门教程】–【源代码 + 图文示例 150+】
3 Cesium【入门教程】–【源代码 + 图文示例 200+】
4 MapboxGL【入门教程】–【源代码 + 图文示例 150+】
5 前端就业宝典【面试题 + 详细答案 1000+】

JS 添加数组元素(4 种方法)

文章目录

    • 一、四种常规方法
      • 1. `push()` 方法 – 在数组末尾添加元素
      • 2. `unshift()` 方法 – 在数组开头添加元素
      • 3. `splice()` 方法 – 在数组任意位置插入元素
      • 4. `concat()` 方法 – 合并数组添加元素(返回新数组)
    • 二、其他方法
    • 三、注意事项总结

JS 添加数组元素(4 种方法)

以下是 JavaScript 中用于添加数组元素的主要方法及其语法、注意事项和代码示例:

一、四种常规方法

1. push() 方法 – 在数组末尾添加元素

语法 :

array.push(element1, ..., elementN)

注意事项 :

  • push() 方法会直接修改原数组。
  • 返回值是修改后数组的长度。

代码示例 :

let myArray = [1, 2, 3];
myArray.push(4, 5);
console.log(myArray); 

2. unshift() 方法 – 在数组开头添加元素

语法 :

array.unshift(element1, ..., elementN)

注意事项 :

  • unshift() 方法也会直接修改原数组。
  • push() 类似,它返回数组更新后的长度。

代码示例 :

let myArray = [1, 2, 3];
myArray.unshift(0);
console.log(myArray); 

3. splice() 方法 – 在数组任意位置插入元素

语法 :

array.splice(index, deleteCount, item1, ..., itemX)

注意事项 :

  • splice() 方法既可以用于插入元素也可以用于删除和替换数组部分元素,它会直接修改原数组。
  • 第一个参数 index 是开始插入 / 删除元素的位置。
  • 第二个参数 deleteCount 表示要从指定位置删除多少个元素,若为 0,则不删除任何元素,仅插入新元素。
  • 之后的参数 item1, ..., itemX 是要插入的新元素。

代码示例 :

let myArray = [1, 2, 4, 5];
myArray.splice(2, 0, 3);
console.log(myArray); 

4. concat() 方法 – 合并数组添加元素(返回新数组)

语法 :

array.concat(value1, value2, ..., valueN)

注意事项 :

  • concat() 方法不会改变原数组,而是返回一个新的包含原数组和新增元素的数组。
  • 可以传入单个元素或另一个数组作为参数。

代码示例 :

let myArray = [1, 2, 3];
let newArray = myArray.concat(4);
console.log(newArray); 
console.log(myArray); 


let anotherArray = [4, 5];
newArray = myArray.concat(anotherArray);
console.log(newArray); 

二、其他方法

  • 对于动态添加元素到特定索引位置,除了 splice() 外,也可以直接使用索引赋值:
let myArray = [1, 2, , 4]; 
myArray[2] = 3; 
console.log(myArray); 

但是请注意,这种方法只适用于非连续性添加或者知道确切索引位置的情况,而且并不会自动扩容数组,如果索引超出了数组现有长度范围,可能会产生副作用。对于稀疏数组,这种方式会填补空位而不是在末尾追加元素。

三、注意事项总结

  • push() 和 unshift() 方法会直接修改原数组。
  • splice() 方法同样会直接修改原数组,但它还可以用来同时删除和插入元素。
  • concat() 方法不会改变原数组,而是返回一个新的数组。

原文地址: JS 添加数组元素(4 种方法)

    正文完
     0
    Yojack
    版权声明:本篇文章由 Yojack 于2024-10-04发表,共计1583字。
    转载说明:
    1 本网站名称:优杰开发笔记
    2 本站永久网址:https://yojack.cn
    3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
    4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
    5 本站所有内容均可转载及分享, 但请注明出处
    6 我们始终尊重原创作者的版权,所有文章在发布时,均尽可能注明出处与作者。
    7 站长邮箱:laylwenl@gmail.com
    评论(没有评论)