数组 - 数据的收纳盒

🎯 数组和元素的核心概念

在编程世界中，我们经常需要处理多个相关的数据：

• 多个数值：比如多个角色等级（5级、12级、8级）
• 多个文本：比如角色名字（勇者、法师、弓箭手）

数组就是存储多个数据的容器。就像：

• 📦 单个数据 → 单个储物盒（比如 let score = 100;）
• 🗄️ 多个数据 → 多格的储物柜（把多个分数放在一起）

举个例子来理解：

• 之前我们学习变量时，一次只能存储一个数据：let level1 = 5;
• 如果有三个角色的等级，我们需要三个变量：let level1 = 5; let level2 = 12; let level3 = 8;
• 使用数组后，我们可以把所有等级放在一个"储物柜"里管理

基本关系：

• 元素：数组中的单个数据（比如等级5、角色名称"勇者"）
• 数组：存储多个元素的容器（就像一个装有很多格子的储物柜）

接下来我们学习如何创建和使用数组。

如何创建和使用数组

使用方括号创建数组

让我们从最基本的数组创建开始。

解释：

• 我们声明了一个叫 scores 的变量
• [100, 85, 92] 是一个数组，包含三个数字
• 数组的每个元素使用 , 进行分隔
• 使用 [] 来创建数组，数组元素放在 [] 里面

另一个例子：字符串数组

• 这里 names 数组包含3个字符串元素
• 字符串元素需要用双引号 " 包围
• 重要：建议一个数组只存放同一类型的数据（比如只放数字或只放字符串），这样处理起来更简单
• 虽然TypeScript支持在数组中放不同类型的数据，但类型处理复杂，不建议这样做

重要概念：数组的长度

在编程中，数组不仅仅是一个数据的集合，它还带有一些内置的信息。就像一个储物柜不仅有格子，还有总格子数量，数组也有自己的信息，

• 属性就是数据类型的内置信息
• length 就是数组的长度属性
• 点号 . 是用来访问属性的符号，和 console.log 里面的点号是一样的作用：scores.length 理解为 "scores的长度"

详细解释 scores.length：

• scores：数组变量名，存储了 [100, 85, 92]
• .：点号，表示"的"的意思，和 console.log 中的点号作用相同
• length：属性名，表示"长度"
• scores.length：合起来就是"scores的长度"

数组长度属性的特点：

• 数组会自动记住自己包含多少个元素
• 使用 scores.length 来获取数组中元素的数量
• 这个长度会随着数组的改变而自动更新

访问数组中的元素

在我们创建数组并放入元素后，接下来最重要的操作就是访问数组中的元素。

让我们通过一个简单的例子开始：

解释：

• let names = ["勇者", "法师", "弓箭手"]; 创建了一个叫 names 的数组变量
• names[0] 访问 names 储物柜的0号格子
• names[1] 访问 names 储物柜的1号格子
• names[2] 访问 names 储物柜的2号格子

什么是索引？

从上面的例子中，我们看到使用了 names[0]、names[1]、names[2] 来访问数组中的元素。

索引就是数组中元素的位置编号，就像储物柜的格子编号一样：

索引的重要特点：

• 从0开始：第一个元素的索引是0，第二个是1，第三个是2
• 连续编号：索引按顺序连续编号，没有跳跃
• 用于访问：我们通过索引来访问数组中的特定元素

重要概念：索引从0开始

这是编程的基本规则，非常重要：

重要观察：

• 索引从0开始，不是从1开始
• 最大索引 = 数组长度 - 1
• 如果数组长度是4，那么索引范围是0到3

实际应用：访问最后一个元素

访问不存在的索引会发生什么？

如果我们尝试访问一个超出数组范围的索引，会发生什么呢？让我们看看：

运行结果解释：

• 访问索引0、1、2会得到对应的颜色
• 访问索引3或10会得到 undefined（未定义）

什么是 undefined？

• undefined 是一个特殊的值，特定用来表示"未定义"或"不存在"
• 当我们尝试访问数组中不存在的索引时，会返回 undefined
• 这告诉我们这个位置没有元素

重要提醒：

• 避免访问超出数组范围的索引
• 在后面学习条件判断时，我们会学习如何安全地检查索引是否有效

安全访问的小技巧：

修改数组中的元素

学会了如何访问数组元素后，我们也可以修改数组中已存在的元素。

重要回顾：变量位置的核心原则

在变量赋值课程中，我们学习了一个核心原则：

• 变量在 = 左边 → 赋值操作（向变量写入数据）
• 变量不在 = 左边 → 读取操作（从变量取出数据）

这个原则同样适用于数组元素！

修改数组元素：通过索引直接给数组中的某个位置赋新值。

理解修改操作的变量位置原则：

1. 赋值操作：scores[1] = 95

   • scores[1] 在 = 左边 → 向数组索引1位置写入数据95
   • 原来的92被新值95替换
   • 结果：[85, 92, 78, 96] 变成 [85, 95, 78, 96]

2. 读取vs赋值对比：

   加载代码编辑器...

修改操作的核心特点：

• 变量位置决定操作：数组元素在 = 左边就是赋值，不在左边就是读取
• 立即生效：修改后数组的值立刻改变
• 长度不变：不会改变数组的长度，只改变指定位置的值
• 基于索引：必须使用有效的索引才能修改
• 类型一致：只能放入与数组类型相同的数据

错误的修改示例：

变量位置原则总结： 无论是普通变量还是数组元素，判断是读取还是赋值的核心标准都是：

• 在 = 左边 → 赋值/写入
• 不在 = 左边 → 读取

这个原则适用于所有变量操作，包括数组元素的修改！

🎯 数组和循环的结合使用

数组最常见的使用场景是结合循环来处理多个元素。

使用 for 循环遍历数组

什么是"遍历"？ "遍历"就是按顺序访问数组中的每一个元素，确保不遗漏任何一个。就像老师点名时，要从第一个学生念到最后一个学生，确保每个学生都被点到。

理解循环遍历：

1. let i = 0：从索引0开始
   • 重要：数组的第一个元素就存储在索引0的位置
   • 这不是从1开始，这是编程的基本规则
2. i < grades.length：只要索引小于数组长度就继续
   • 数组总共有 grades.length 个元素
   • 循环条件是 i < grades.length（不包括等于）
   • 由此可以推导出：最大有效索引就是 grades.length - 1
3. i = i + 1：每次循环索引加1，确保访问到每个元素
4. grades[i]：使用索引访问每个元素

举个例子说明索引范围：

循环过程分析：

• 第1次循环：i = 0，访问 grades[0]（第1个元素）
• 第2次循环：i = 1，访问 grades[1]（第2个元素）
• 第3次循环：i = 2，访问 grades[2]（第3个元素）
• 循环结束：当 i = 3 时，3 < 3 为 false，循环停止

计算数组统计信息

查找数组中的最大值和最小值

为什么用第一个元素初始化最大值和最小值？

在开始查找之前，我们需要一个"基准值"来进行比较。使用数组第一个元素来初始化最大值和最小值是最合理的方法，因为：

1. 保证比较的有效性：用真实存在的数组元素作为起始点，而不是任意的数字
2. 避免错误结果：如果用0初始化最小值，而数组所有元素都大于0，结果就对了；但如果数组包含负数，结果就错了
3. 循环不变量原理：第一个元素既是当前的最大值，也是当前的最小值，然后逐个与其他元素比较
   • 循环不变量：在每次循环开始时，maxTemp 和 minTemp 分别存储了已经检查过的元素中的最大值和最小值
   • 初始状态：只检查了第一个元素时，它既是最大值也是最小值
   • 维持不变量：每次检查新元素时，与当前的最大值和最小值比较，必要时更新
   • 最终结果：循环结束后，maxTemp 和 minTemp 就是整个数组的最大值和最小值

成绩分类统计

常见数组操作模式：从一个数组计算得到新数组

这是一个非常常见的编程操作：读取一个数组的数据，经过计算和处理，生成新的数组。

基本操作模式：

1. 结果数组初始化：创建空数组 [] 用于存储结果
2. 遍历源数组：逐个访问原数组中的每个元素
3. 条件判断：使用 if 语句对每个元素进行判断和处理
4. 添加到结果：将符合条件的元素添加到对应的分类数组中

常见错误和注意事项

❌ 错误1：访问不存在的索引

❌ 错误2：混淆数组长度和索引

总结

今天我们系统学习了数组的基础知识，按照学习顺序总结：

核心概念理解

1. 数组是存储多个数据的容器 - 用于存储多个数值（如[100, 85, 92]）或多个文本（如["小明", "小红"]）
2. 元素与数组的关系 - 元素是数组中的单个数据，数组是元素的集合
3. 索引系统 - 索引从0开始，用于访问数组中的特定元素

数组操作基础

4. 创建数组 - 使用方括号[]创建数组，可以包含初始元素
5. 访问元素 - 使用索引array[index]获取特定位置的元素
6. 获取长度 - 使用.length属性获取数组中元素的数量
7. 修改元素 - 通过索引直接赋值修改特定位置的元素

循环与数组处理

8. 循环遍历 - 使用for循环访问数组中的每个元素
9. 数据统计 - 计算总和、平均值、最大值、最小值
10. 数据分类 - 根据条件将数组元素分类到不同数组中

错误防范

11. 索引范围 - 理解数组长度和索引的关系，避免访问不存在的索引
12. undefined 处理 - 了解访问超出范围的索引会返回 undefined

数组是编程中最重要的数据结构之一，就像变量的"兄弟"一样重要！掌握数组的基础概念、创建、访问、修改和遍历操作，为后续学习数组的高级操作方法和TypeScript类型系统打下了坚实基础。

下一步学习： 数组操作方法和类型声明，我们将深入学习 push()、pop() 等数组方法以及TypeScript的类型保护机制！