在 TypeScript 中,array(数组)用于存储多个相同类型的元素。TypeScript 对数组的类型进行静态检查,能够提供强大的类型推断功能,帮助开发者避免常见的类型错误。本文将介绍 TypeScript 中数组的基本使用方法、数组的类型定义、数组方法等内容。


目录

  1. 基本语法
  2. 数组的类型定义
  3. 数组常用方法
  4. 数组的泛型使用
  5. 数组的遍历
  6. 数组与其他类型的转换
  7. 参考资料

1. 基本语法

在 TypeScript 中,数组可以通过两种方式进行定义:

  1. 使用 [] 来定义数组
  2. 使用 Array<type> 来定义数组

示例:

let numbers: number[] = [1, 2, 3, 4, 5];  // 数字类型数组
let names: string[] = ["Alice", "Bob", "Charlie"];  // 字符串类型数组

console.log(numbers);
console.log(names);


2. 数组的类型定义

TypeScript 允许在数组类型中定义元素的类型,确保数组中的每个元素都是指定的类型。

指定类型数组

let ages: number[] = [25, 30, 35];  // 数字类型数组
let fruits: string[] = ["Apple", "Banana", "Orange"];  // 字符串类型数组

使用泛型定义数组类型

除了使用 [] 表示数组类型外,TypeScript 还提供了泛型 Array<type> 来定义数组类型。

let ages: Array<number> = [25, 30, 35];  // 数字类型数组
let fruits: Array<string> = ["Apple", "Banana", "Orange"];  // 字符串类型数组

多维数组

如果数组中包含多个数组,可以使用二维数组或更高维度数组。

let matrix: number[][] = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];
console.log(matrix);


3. 数组常用方法

TypeScript 支持 JavaScript 中的所有数组方法,以下是常用的数组操作方法。

方法说明
push(item)向数组末尾添加一个或多个元素
pop()删除并返回数组的最后一个元素
shift()删除并返回数组的第一个元素
unshift(item)向数组开头添加一个或多个元素
concat()合并两个或多个数组
slice(start, end)返回数组的指定部分
splice(start, deleteCount, item)在指定位置删除或插入元素
forEach(callback)遍历数组并执行回调函数
map(callback)返回一个新的数组,数组的元素是原数组元素调用回调函数后的结果
filter(callback)返回一个新数组,数组中的元素是原数组中满足条件的元素

示例:

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

// push() - 向数组末尾添加元素
numbers.push(6);
console.log(numbers);  // 输出: [1, 2, 3, 4, 5, 6]

// pop() - 删除并返回数组的最后一个元素
let last = numbers.pop();
console.log(last);  // 输出: 6
console.log(numbers);  // 输出: [1, 2, 3, 4, 5]

// slice() - 获取数组的一部分
let slicedNumbers = numbers.slice(1, 4);
console.log(slicedNumbers);  // 输出: [2, 3, 4]

// map() - 创建新数组,每个元素乘以 2
let doubledNumbers = numbers.map(num => num * 2);
console.log(doubledNumbers);  // 输出: [2, 4, 6, 8, 10]

// filter() - 创建新数组,筛选出大于 3 的数字
let filteredNumbers = numbers.filter(num => num > 3);
console.log(filteredNumbers);  // 输出: [4, 5]


4. 数组的泛型使用

TypeScript 中的泛型数组不仅能够确保数组元素的类型一致,还可以通过泛型的灵活性来处理不同类型的数组。

示例:

function printArray<T>(items: T[]): void {
    items.forEach(item => console.log(item));
}

printArray([1, 2, 3]);  // 输出: 1 2 3
printArray(["a", "b", "c"]);  // 输出: a b c


5. 数组的遍历

TypeScript 支持常见的数组遍历方法,例如 for 循环、forEach()map()reduce()

使用 for 循环遍历数组:

let numbers: number[] = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
    console.log(numbers[i]);
}

使用 forEach() 遍历数组:

let numbers: number[] = [1, 2, 3, 4, 5];
numbers.forEach(num => {
    console.log(num);
});

使用 map() 转换数组:

let numbers: number[] = [1, 2, 3, 4, 5];
let squaredNumbers = numbers.map(num => num * num);
console.log(squaredNumbers);  // 输出: [1, 4, 9, 16, 25]


6. 数组与其他类型的转换

TypeScript 提供了几种常见的数组与其他类型之间的转换方法,常见的方法包括 join()split()concat()Array.from() 等。

示例:

// 数组转换为字符串
let numbers: number[] = [1, 2, 3];
let str: string = numbers.join(", ");
console.log(str);  // 输出: "1, 2, 3"

// 字符串转换为数组
let text: string = "apple, banana, orange";
let fruits: string[] = text.split(", ");
console.log(fruits);  // 输出: ["apple", "banana", "orange"]

// 使用 Array.from() 创建数组
let arrFromSet = Array.from(new Set([1, 2, 3, 3, 4]));
console.log(arrFromSet);  // 输出: [1, 2, 3, 4]


7. 参考资料

📌 出站链接:

🔗 站内链接:


TypeScript 中的数组提供了强大的类型检查和方法支持,帮助开发者更加高效地处理和操作数据。通过数组的类型定义、常用方法和泛型支持,开发者能够更加安全地进行类型推断和处理。