JavaScript 数组操作：在数组首尾添加元素的实用指南-js教程-PHP中文网

JavaScript 数组操作：在数组首尾添加元素的实用指南

聖光之護

发布： 2025-10-25 09:33:00

原创

274人浏览过

javascript 数组操作：在数组首尾添加元素的实用指南

本文旨在清晰阐述如何在 JavaScript 中向数组的开头或末尾添加元素。我们将深入探讨 push() 和 unshift() 方法的用法，并通过示例代码演示其具体实现。此外，我们还会针对常见的错误用法进行分析，帮助开发者避免潜在问题，从而更加高效地操作数组。

在 JavaScript 中，向数组添加元素是常见的操作。根据添加位置的不同，我们可以使用不同的方法。本文将重点介绍 push() 和 unshift() 这两个方法，分别用于在数组末尾和开头添加元素。

在数组末尾添加元素：push() 方法

push() 方法用于将一个或多个元素添加到数组的末尾，并返回修改后的数组的新长度。这是最常用的数组添加元素的方法之一。

语法：

立即学习“Java免费学习笔记（深入）”；

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

登录后复制

示例：

怪兽AI数字人

数字人短视频创作，数字人直播，实时驱动数字人

查看详情

let arr = [1, 2, 3];
let newLength = arr.push(4, 5);

console.log(arr); // 输出: [1, 2, 3, 4, 5]
console.log(newLength); // 输出: 5

登录后复制

在数组开头添加元素：unshift() 方法

unshift() 方法用于将一个或多个元素添加到数组的开头，并返回修改后的数组的新长度。

语法：

立即学习“Java免费学习笔记（深入）”；

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

登录后复制

示例：

let arr = [1, 2, 3];
let newLength = arr.unshift(0, -1);

console.log(arr); // 输出: [0, -1, 1, 2, 3]
console.log(newLength); // 输出: 5

登录后复制

示例分析与注意事项

以下代码片段演示了尝试对数组进行排序时，在数组开头添加元素可能遇到的问题：

const s = [5, 7, 2];

function editInPlace() {
  var newS = []
  for (let i = 0; i < s.length; i++) {
    if (console.log(s[i] < newS[i - 1])) {
      newsS.unshift(s[i])
      console.log("Evalute to true then add at the begining: " + newS.splice(s[i]));
    } else {
      newS.push(s[i]);
      console.log("newS es: " + newS)
    }
  }
}
editInPlace();

登录后复制

问题分析：

上述代码存在一个关键错误：console.log(s[i] < newS[i - 1]) 语句。console.log() 函数本身会返回 undefined，因此 if 条件始终为 false。这导致元素始终被添加到数组的末尾，而不是根据条件添加到开头。

解决方案：

将比较操作从 console.log() 中分离出来，并将比较结果存储在一个变量中。

const s = [5, 7, 2];

function editInPlace() {
  var newS = [];
  for (let i = 0; i < s.length; i++) {
    const comparisonResult = (newS.length > 0) && (s[i] < newS[newS.length - 1]); // Ensure newS is not empty before accessing newS[i - 1]
    console.log(comparisonResult);
    if (comparisonResult) {
      newS.unshift(s[i]);
      console.log("Evalute to true then add at the begining: " + newS); // Corrected log
    } else {
      newS.push(s[i]);
      console.log("newS es: " + newS);
    }
  }
  console.log("Final newS: " + newS);
}
editInPlace();

登录后复制

关键点：