Skip to content

数组

了解数组如何存储有序的值列表、如何按下标访问元素、如何遍历它们。

你将学到

  • 数组是什么、何时使用
  • 如何按下标访问和修改元素
  • 如何用 push、pop、shift 增删元素
  • 如何用 for 和 forEach 遍历数组

概念讲解

数组

数组是有序的值列表。当你有多项同类数据时（一组名字、一组价格、一串分数）就该用数组。数组保持顺序，并允许你按位置引用每一项。

创建与访问

const fruits = ["apple", "banana", "cherry"];
fruits[0];   // "apple"  —— 下标从 0 开始！
fruits[2];   // "cherry"
fruits.length;  // 3

下标从 0 开始，不是 1。这是大多数语言的约定。最后一个元素在下标 length - 1。

增删元素

  • push(item) —— 末尾添加。
  • pop() —— 末尾移除。
  • unshift(item) —— 头部添加。
  • shift() —— 头部移除。
const stack = [1, 2, 3];
stack.push(4);   // [1, 2, 3, 4]
stack.pop();     // 4，stack 变成 [1, 2, 3]

遍历数组

经典写法是用 for 循环配合数组长度：

for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]);
}

现代 JavaScript 有更简洁的写法：fruits.forEach(f => console.log(f)) 和 fruits.map(f => f.toUpperCase())。这些都是方法——属于数组的函数。

数组是可变的

用 const 声明的数组，其*内容*仍可改变（arr.push(x) 照常工作）。const 只阻止把变量重新指向另一个数组。这点常让人困惑。

示例代码

              const prices = [10, 25, 15, 30, 8];

// 用 for 循环求和：
let total = 0;
for (let i = 0; i < prices.length; i++) {
  total += prices[i];
}
console.log("Total:", total);   // 88

// 用方法找最高价：
const highest = Math.max(...prices);
console.log("Highest:", highest);  // 30

// 用 map 转换：
const withTax = prices.map(p => p * 1.2);
console.log("With 20% tax:", withTax);

for 循环累加总和。Math.max 配合展开运算符 (...) 找最大值。map 生成每个价格加 20% 税后的新数组。

动手试一试

  • JSON Formatter

    JSON 数组形如 [1, 2, 3]。粘贴数组看格式化器逐元素美化。

常见错误

错误写法

忘了数组下标从 0 开始。

正确做法

第一个元素是 arr[0]，最后一个是 arr[arr.length - 1]。差一错误是最常见的数组 bug——务必测边界。

错误写法

以为 const 能阻止数组内容被修改。

正确做法

const 锁的是绑定，不是内容。arr.push(x) 仍有效。要防修改，改用返回新数组的方法（map、filter）而非会修改原数组的方法。

相关资源

相关代码片段

练习 数组

2 个练习

练习 数组

查阅不认识的术语

新手友好的术语表用大白话解释编程术语——变量、函数、DOM、Promise 等等。

查看术语表

动手做项目

通过引导式项目应用所学，含起始代码与解决方案。

查看项目

解读错误信息

用大白话解释常见错误——什么意思、为什么发生、如何修复。

查看错误