2.2 数组类型 - 全栈应用开发修炼手册课程

🎯 学习目标

掌握数组的两种定义语法
理解泛型数组类型的用法
学会使用只读数组
了解多维数组的定义

📝 数组定义语法

方式一：元素类型后加 []

// 数字数组
let numbers: number[] = [1, 2, 3, 4, 5];

// 字符串数组
let names: string[] = ['Alice', 'Bob', 'Charlie'];

// 布尔数组
let flags: boolean[] = [true, false, true];
      

方式二：使用泛型 Array<T>

// 泛型语法
let numbers: Array<number> = [1, 2, 3, 4, 5];
let names: Array<string> = ['Alice', 'Bob', 'Charlie'];

// 两种方式等价，推荐使用第一种（更简洁）
      

💻 数组操作

let numbers: number[] = [1, 2, 3];

// 添加元素
numbers.push(4);
numbers.push(5);

// 删除元素
numbers.pop();         // 删除最后一个
numbers.shift();       // 删除第一个

// 数组方法
let doubled = numbers.map(n => n * 2);    // [2, 4, 6]
let evens = numbers.filter(n => n % 2 === 0);  // [2]
let sum = numbers.reduce((a, b) => a + b, 0);  // 6

// 数组长度
console.log(numbers.length);  // 3

// 遍历数组
numbers.forEach(n => console.log(n));
for (const num of numbers) {
  console.log(num);
}
      

🔒 只读数组

// 使用 readonly 关键字
let readonlyNumbers: readonly number[] = [1, 2, 3];

// 或使用 ReadonlyArray<T>
let readonlyNames: ReadonlyArray<string> = ['Alice', 'Bob'];

// 只读数组不能修改
readonlyNumbers.push(4);  // Error: 类型 "readonly number[]" 上不存在属性 "push"
readonlyNumbers[0] = 10;  // Error: 索引签名仅允许读取
      

💡

只读数组的用途

只读数组用于确保数组不被意外修改，常用于函数参数、配置项等场景，提高代码的安全性。

📊 多维数组

// 二维数组
let matrix: number[][] = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

// 访问元素
console.log(matrix[0][1]);  // 2

// 三维数组
let cube: number[][][] = [
  [[1, 2], [3, 4]],
  [[5, 6], [7, 8]]
];
      

📝 本节小结

✅

• 使用 type[] 或 Array<type> 定义数组类型
• 数组元素必须是指定类型
• readonly 创建只读数组，防止意外修改
• 多维数组使用 type[][] 语法定义