JavaScript 数组详解：创建、操作与核心方法指南

键盘旁的猫

发布时间：2026-10-14| 12人浏览过

原创

在程序语言中，数组是存放值的有序集合。由于 JavaScript 是弱类型语言，其数组具有极高的灵活性，同一数组可存储多种数据类型，且长度随数据增减自动调整。本文将深入解析数组的创建差异、索引底层逻辑以及常用的操作方法。

结果或目标

掌握 JavaScript 数组的核心特性，能够灵活使用不同方式创建数组，并熟练运用 `splice`、`sort`、`concat` 等方法进行数据的增删改查。

准备条件

了解 JavaScript 基础语法，运行环境需支持 ECMAScript 标准（现代浏览器均支持）。

真实操作顺序

第1步：选择数组创建方式

目的：初始化一个空数组或包含初始数据的数组。 入口：代码编辑器。

动作：可以使用构造函数或字面量两种方式进行创建。使用 new Array() 构造函数时，需注意传入单个数字参数会直接创建指定长度的空数组，而传入多个参数则会将它们作为元素。相比之下，使用字面量（方括号 []）更为推荐且直观，无论传入多少个参数，都会直接将它们视为数组内容。

参数示例： var a = [10]; （长度为1，内容为10） var b = new Array(5); （长度为5，内容为空）

完成状态：成功创建一个可用的数组对象。

第2步：理解索引与 length 属性关系

目的：避免越界错误，正确管理数组内存空间。 入口：数组访问操作。

动作：通过自然数索引读写元素。数组内部将索引转换为字符串作为属性名。对于不连续的赋值（如直接给 a[100] 赋值），虽然中间元素为空，但 length 属性会自动更新为最大索引值加一。若手动将 length 设为较小的数值，大于等于新长度的索引对应的元素会被自动删除；若设得更大，尾部会自动填充空洞。

重要参数：a.length 属性。

完成状态：理解数组动态扩容与截断机制。

第3步：执行栈方法与队列方法

目的：实现先入后出（栈）或先入先出（队列）的数据结构效果。 入口：数组对象调用方法。

动作： - 栈操作：使用 push() 从尾部添加，pop() 从尾部删除并返回该元素。此过程会自动调整其他元素的索引和总长度。 - 队列操作：使用 shift() 从头部删除并返回，配合 unshift() 从头部添加。同样会引起后续元素索引的重新排列。

完成状态：成功模拟栈或队列行为。

第4步：使用 splice 进行精准增删替换

目的：一次性解决数组插入、删除及替换元素的问题。 入口：array.splice(startIndex, deleteCount, item1, item2, ...)

动作： - 删除：设置第二个参数 deleteCount 为所需删除的数量。
var arr = [1, 2, 3, 4, 5]; console.log(arr.splice(1, 2)); // 删除2个，返回 [2, 3] - 插入：将 deleteCount 设为 0，并在后续参数填入新元素。
arr.splice(2, 0, 'a', 'b'); // 在索引2处插入 a 和 b - 替换：同时指定 deleteCount 不为 0 并附加新元素，即可实现“删除后插入”的替换效果。注意：splice 会改变原数组，并返回由被删除元素组成的新数组。

完成状态：完成对数组特定位置的修改。

第5步：运用 slice、concat 和 sort 处理数据

目的：获取子数组、合并数组或排序。

动作： - slice(start, end)：截取片段。**不修改原数组**，返回新数组。若 end 缺省则取到末尾，允许使用负数（从尾部倒数）。若起始位置大于结束位置，则返回空数组。 - concat(value1, value2)：拼接数组。**不修改原数组**，返回拼接后的新数组。它不会递归展开嵌套数组。 - sort(compareFunction)：排序。**会修改原数组**。无参时默认按 Unicode 码点升序排序（会导致数字串错乱，如 10 排在 7 前面）。如需数字大小排序，必须传入比较函数：(a, b) => a - b。

重要参数：compareFunction 需返回正数、零或负数以决定排序顺序。