跳到主要内容

TypeScript 基本类型

TypeScript 是 JavaScript 的超集，它通过添加静态类型系统来增强 JavaScript 的功能。TypeScript 的基本类型是构建复杂类型系统的基础。本文将详细介绍 TypeScript 中的基本类型，并通过代码示例和实际案例帮助你理解它们的用法。

什么是基本类型？​

在 TypeScript 中，基本类型是指那些可以直接使用的简单数据类型。这些类型包括数字、字符串、布尔值、数组、元组、枚举、任意类型、空值、未定义、空对象、以及 never 类型。这些类型可以帮助你在编写代码时更好地定义变量的数据类型，从而提高代码的可读性和可维护性。

TypeScript 中的基本类型​

1. 数字（Number）​

TypeScript 中的数字类型与 JavaScript 中的数字类型相同，可以表示整数和浮点数。

typescript
let age: number = 25;
let price: number = 19.99;

2. 字符串（String）​

字符串类型用于表示文本数据。你可以使用单引号、双引号或反引号来定义字符串。

typescript
let name: string = "Alice";
let message: string = `Hello, ${name}!`;

3. 布尔值（Boolean）​

布尔类型只有两个值：true 和 false。

typescript
let isActive: boolean = true;
let isCompleted: boolean = false;

4. 数组（Array）​

数组类型用于表示一组相同类型的元素。你可以使用两种方式定义数组：

typescript
let numbers: number[] = [1, 2, 3, 4, 5];
let names: Array<string> = ["Alice", "Bob", "Charlie"];

5. 元组（Tuple）​

元组类型允许你表示一个已知元素数量和类型的数组，各元素的类型不必相同。

typescript
let user: [string, number] = ["Alice", 25];

6. 枚举（Enum）​

枚举类型用于定义一组命名的常量。

typescript
enum Color {
  Red,
  Green,
  Blue,
}

let color: Color = Color.Green;

7. 任意类型（Any）​

任意类型允许你为变量指定任何类型的值。这在你不确定变量类型时非常有用。

typescript
let data: any = "This could be anything";
data = 42;
data = true;

8. 空值（Void）​

void 类型表示没有任何类型。通常用于函数没有返回值的情况。

typescript
function logMessage(message: string): void {
  console.log(message);
}

9. 未定义（Undefined）和空值（Null）​

undefined 和 null 类型分别表示未定义和空值。

typescript
let u: undefined = undefined;
let n: null = null;

10. 空对象（Object）​

object 类型表示非原始类型的值，即不是 number、string、boolean、symbol、null 或 undefined 的值。

typescript
let user: object = { name: "Alice", age: 25 };

11. Never 类型​

never 类型表示那些永远不会发生的值的类型。通常用于抛出异常或无限循环的函数。

typescript
function throwError(message: string): never {
  throw new Error(message);
}

实际应用场景​

场景 1：表单验证​

在表单验证中，你可以使用 TypeScript 的基本类型来确保输入的数据类型正确。

typescript
function validateForm(name: string, age: number, isActive: boolean): boolean {
  if (name.length > 0 && age > 0 && isActive) {
    return true;
  }
  return false;
}

场景 2：配置对象​

在处理配置对象时，你可以使用 object 类型来确保传递的对象符合预期的结构。

typescript
interface Config {
  apiUrl: string;
  timeout: number;
}

function initializeApp(config: Config): void {
  console.log(`Initializing app with API URL: ${config.apiUrl}`);
}

总结​

TypeScript 的基本类型是构建复杂类型系统的基础。通过掌握这些基本类型，你可以更好地定义变量的数据类型，从而提高代码的可读性和可维护性。本文介绍了 TypeScript 中的基本类型，并通过代码示例和实际案例帮助你理解它们的用法。

附加资源​

练习​

  1. 定义一个函数 calculateArea，接受两个参数 width 和 height，返回它们的乘积。确保参数和返回值都是 number 类型。
  2. 创建一个枚举 DaysOfWeek，包含一周的七天。然后定义一个变量 today，并将其赋值为 DaysOfWeek.Monday。
  3. 编写一个函数 logUserInfo，接受一个对象参数，该对象包含 name（字符串）和 age（数字）属性。函数应打印出用户的信息。

通过完成这些练习，你将更好地掌握 TypeScript 的基本类型。