JavaScript 中的数组：高效存储多个值

Source: Dev.to

什么是数组，为什么需要它们？

数组是一种数据结构，用于按特定顺序存储一组值。

与其这样创建许多变量：

let fruit1 = "Apple";
let fruit2 = "Banana";
let fruit3 = "Mango";
let fruit4 = "Orange";

我们可以把它们存放在一个数组中：

let fruits = ["Apple", "Banana", "Mango", "Orange"];

使用数组的好处

• 将多个相关值存放在同一个位置
• 更容易管理和组织数据
• 简化对数据的循环遍历
• 使代码更简洁、更具可扩展性

如何创建数组

数组使用 方括号 [] 创建。

示例

let fruits = ["Apple", "Banana", "Mango"];

另一个数字示例

let marks = [85, 90, 78, 92];

数组中的每个值称为 元素。

使用索引访问元素

数组中的每个元素都有一个 位置，称为 索引。
数组索引从 0 开始，而不是 1。

let fruits = ["Apple", "Banana", "Mango"];

访问元素

let fruits = ["Apple", "Banana", "Mango"];

console.log(fruits[0]); // Apple
console.log(fruits[1]); // Banana
console.log(fruits[2]); // Mango

方括号中的数字告诉 JavaScript 要检索哪个位置。

更新元素

可以通过给特定索引赋予新值来更新数组元素。

let fruits = ["Apple", "Banana", "Mango"];
fruits[1] = "Orange";
console.log(fruits);

输出

["Apple", "Orange", "Mango"]

数组的 length 属性

length 属性告诉我们数组中有多少个元素。

let fruits = ["Apple", "Banana", "Mango", "Orange"];
console.log(fruits.length);

输出

4

在使用循环时，length 属性也非常有用。

基本数组循环

通常我们想要处理数组中的每个元素。最简单的方式是使用 for 循环。

let fruits = ["Apple", "Banana", "Mango"];
for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]);
}

输出

Apple
Banana
Mango

练习

问题

1. 创建一个包含 5 部你最喜欢的电影 的数组。
2. 打印数组的 第一个元素 和 最后一个元素。
3. 更改数组中的一个值并打印更新后的数组。
4. 循环遍历数组并打印所有元素。

答案

1. 创建电影数组

let movies = ["Inception", "Interstellar", "Spirited Away", "The Matrix", "Avengers"];

2. 打印第一个和最后一个元素

let movies = ["Inception", "Interstellar", "Spirited Away", "The Matrix", "Avengers"];
console.log(movies[0]);                 // first movie
console.log(movies[movies.length - 1]); // last movie

3. 更改一个值

let movies = ["Inception", "Interstellar", "Spirited Away", "The Matrix", "Avengers"];
movies[2] = "Your Name";
console.log(movies);

4. 循环遍历数组

let movies = ["Inception", "Interstellar", "Spirited Away", "The Matrix", "Avengers"];
for (let i = 0; i < movies.length; i++) {
  console.log(movies[i]);
}

结论

数组是 JavaScript 的重要组成部分，因为它们能够高效地存储和管理数据集合。通过了解如何创建数组、访问元素、更新值以及遍历数组，你就为在实际项目中处理更大数据集奠定了坚实的基础。