TypeScript基础知识（一）基本类型

布尔类型（boolean）

TypeScript 中的布尔类型用于表示逻辑值，只有两个可能的取值: true 和 false。在 TypeScript 中，可以使用关键字 boolean 来定义布尔类型变量。以下是一个示例:

let isFinished: boolean = false;
let hasCompleted: boolean = true;

console.log(isFinished); // 输出：false
console.log(hasCompleted); // 输出：true

可以通过赋值操作符将布尔值赋给变量，并可以根据布尔值进行逻辑判断或条件控制流程。

数字类型（number）

在 TypeScript 中，数字类型用于表示数值，可以表示整数和浮点数。可以使用关键字 number 来定义数字类型变量。以下是一个示例：

let age: number = 30;
let height: number = 1.75;

console.log(age); // 输出：30
console.log(height); // 输出：1.75

数字类型的变量可以进行常见的数学运算，比如加减乘除等。此外，TypeScript 还支持其他类型的数字，如二进制、八进制和十六进制。例如：

let binary: number = 0b1010; // 二进制
let octal: number = 0o744; // 八进制
let hex: number = 0xabc; // 十六进制

console.log(binary); // 输出：10
console.log(octal); // 输出：484
console.log(hex); // 输出：2748

需要注意的是，数字类型在 TypeScript 中是一种原始类型，不能和字符串类型进行直接的运算操作，需要进行类型转换。例如：

let num: number = 10;
let str: string = "20";

let result = num + Number(str);
console.log(result); // 输出：30

在进行类型转换时，可以使用 Number()、parseInt() 等方法将字符串类型转换成数字类型。

字符串类型（string）

字符串类型（string）是在 TypeScript 中表示文本的数据类型。它用于存储包含字符序列的值，可以是字母、数字、符号或其他字符的组合。

在 TypeScript 中，可以使用双引号（"）或单引号（'）将字符串字面量括起来，例如：

let message: string = "Hello, TypeScript!"; // 使用双引号
let name: string = 'Alice'; // 使用单引号

你还可以使用模板字符串（template strings）来表示多行文本和包含变量的文本：

let multiLineText: string = `这是
多行文本`;

let age: number = 25;
let greeting: string = `我叫 ${name}，今年 ${age} 岁。`;

注意，字符串是不可变的，也就是说一旦创建就不能修改。如果要对字符串进行修改操作，可以使用字符串方法和操作符。

在 TypeScript 中，我们还可以使用一些内置函数和方法来处理字符串，例如 length 属性获取字符串的长度、concat 方法拼接字符串、toUpperCase 方法将字符串转换为大写等。你可以根据实际需求选择合适的方法来操作字符串。

数组类型（Array）

数组类型（Array）用于表示一个由相同数据类型的值组成的集合。在 TypeScript 中，可以使用下面的语法来声明数组类型：

let arrayName: dataType[]; // 方式一

let arrayName: Array<dataType>; // 方式二

其中，dataType 表示数组中元素的数据类型。

下面是一些声明数组的示例：

let numbers: number[] = [1, 2, 3, 4, 5]; // 数字类型数组
let fruits: string[] = ["apple", "banana", "orange"]; // 字符串类型数组
let booleans: boolean[] = [true, false, true]; // 布尔类型数组

你还可以使用 Array 泛型来声明数组类型：

let numbers: Array<number> = [1, 2, 3, 4, 5];
let fruits: Array<string> = ["apple", "banana", "orange"];
let booleans: Array<boolean> = [true, false, true];

在 TypeScript 中，数组还提供了一些常用的属性和方法，如 length 属性获取数组的长度、push 方法向数组末尾添加元素、pop 方法移除数组末尾的元素等。你可以根据需要使用这些方法来操作数组。

元组类型（Tuple）

元组类型（Tuple）是 TypeScript 中的一种数据类型，它允许你存储一个固定长度的、类型可以不同的数据序列。

元组使用方括号 [] 表示，元素之间使用逗号 , 分隔。例如，let tuple: [number, string] = [1, "hello"]; 表示一个由一个数字和一个字符串组成的元组。

你可以使用解构赋值来访问元组中的元素，例如：

let tuple: [number, string] = [1, "hello"];
let [num, str] = tuple;
console.log(num); // 输出 1
console.log(str); // 输出 "hello"

元组还支持通过下标访问元素，下标从 0 开始计数：

let tuple: [number, string] = [1, "hello"];
console.log(tuple[0]); // 输出 1
console.log(tuple[1]); // 输出 "hello"

注意，元组的长度是固定的，一旦创建后就不能增加或减少元素的个数。元组的类型在定义时已经确定，无法新增或修改类型。

枚举类型（Enum）

枚举类型（Enum）是 TypeScript 提供的一种数据类型，用于定义一组命名的常量值。通过枚举类型，可以为一组相关的常量赋予有意义的名称，提高代码的可读性和可维护性。

在 TypeScript 中，使用 enum 关键字来定义一个枚举类型。下面是一个例子：

enum Color {
  Red,
  Green,
  Blue
}

let color: Color = Color.Green;
console.log(color); // 输出 1
console.log(Color[color]); // 输出 "Green"

在这个例子中，我们定义了一个颜色的枚举类型 Color，它包含了三个常量值：Red、Green 和 Blue。这些常量值的默认关联值分别是 0、1 和 2。我们可以用这些常量值来赋值给变量，并通过枚举常量的名称或值来访问它们。

枚举类型的默认关联值是从 0 开始自动递增的，但你也可以手动指定关联值。例如：

enum Color {
  Red = 1,
  Green = 2,
  Blue = 4
}

let color: Color = Color.Green;
console.log(color); // 输出 2
console.log(Color[color]); // 输出 "Green"

在这个例子中，我们手动指定了 Red 的关联值为 1，Green 的关联值为 2，Blue 的关联值为 4。

任意类型（Any）

任意类型（Any）是一种在编程语言中常见的数据类型，它可以表示任何类型的值。在许多编程语言中，包括Python、TypeScript和Swift，都有支持任意类型的特殊关键字或类型。

使用任意类型可以灵活地处理各种类型的数据，尤其是在不确定变量的类型时非常有用。例如，当从外部源接收数据或者在编写通用函数时，可以使用任意类型来处理不同类型的输入。

然而，由于任意类型不提供类型检查和编译时的类型安全性，因此在使用任意类型时需要格外小心。对于强类型语言，将任意类型的值分配给其他特定类型的变量可能会导致类型错误。在使用任意类型时，一般需要进行类型检查和适当的类型转换来确保数据的正确性。

总之，任意类型是一种特殊的类型，可以用来表示任何类型的值，但需要谨慎使用以确保代码的正确性。

空类型（Void）

TypeScript 中的空类型（Void）表示一个函数没有返回值。在函数定义中，可以使用空类型来明确指示函数没有返回任何值。

例如，下面是一个返回空类型的函数示例：

function greet(): void {
  console.log("Hello!");
}

在上面的示例中，greet 函数没有返回值，它只是在控制台输出了 “Hello!”。函数的返回类型被指定为 void，以表示它不返回任何值。

需要注意的是，在 TypeScript 中，空类型的变量只能赋值为 undefined 或 null，它们是 void 类型的子类型。这意味着不能将 void 类型的变量赋值为其他任何类型的值。

总而言之，TypeScript 中的空类型（Void）用于明确表示函数没有返回值。

Null 和 Undefined

在 TypeScript 中，null 和 undefined 是两个特殊的值，用于表示缺少值或空值。

• null 表示一个空值或不存在的对象。它是一个赋值为 null 的变量，表示它没有引用任何对象或值。

• undefined 表示一个变量已声明但没有赋值，或者一个对象的属性不存在。如果一个函数没有返回任何值，则其默认返回 undefined。

示例：

let nullValue: null = null;
let undefinedValue: undefined = undefined;

let number: number = null; // 正确，可以将 null 赋值给 number 类型
let str: string = undefined; // 正确，可以将 undefined 赋值给 string 类型

let obj: object = null; // 错误，object 类型不能赋值为 null
let num: number = undefined; // 错误，number 类型不能赋值为 undefined

需要注意的是，TypeScript 中默认情况下，变量是可为 null 或 undefined 的。如果想要明确禁止这种情况，可以使用 strictNullChecks 编译选项，它会强制进行 null 和 undefined 的检查。

总的来说，null 和 undefined 是 TypeScript 中用于表示缺少值或空值的特殊值。使用这两个值时需要小心，尽量避免出现类型错误或意外的运行时错误。

字面量类型（Literal Types）

TypeScript中的字面量类型（Literal Types）允许我们将特定的值作为类型，而不仅仅是作为值。这些字面量类型可以是字符串，数字，布尔值或符号。

例如，我们可以定义一个只能取特定字符串值的类型：

type Direction = 'left' | 'right' | 'up' | 'down';
let direction: Direction = 'left'; // 只能取 'left'、'right'、'up' 或 'down' 中的一个

类似地，我们可以定义一个只能取特定数字值的类型：

type StatusCode = 200 | 400 | 404 | 500;
let status: StatusCode = 200; // 只能取 200、400、404 或 500 中的一个

字面量类型可以在函数参数、变量声明、对象属性和返回值类型等位置使用。使用字面量类型可以帮助我们在编译时捕获一些潜在的错误，并提供更严格的类型约束。

字面量类型还可以与联合类型（Union Types）和交叉类型（Intersection Types）一起使用，以创建更复杂的类型。

type Color = 'red' | 'blue' | 'green';
type Size = 'small' | 'medium' | 'large';

type Style = {
  color: Color;
  size: Size;
};

function applyStyle(style: Style) {
  // ...
}

applyStyle({ color: 'red', size: 'small' }); // 正确
applyStyle({ color: 'yellow', size: 'xl' }); // 错误，不符合定义的字面量类型

通过使用字面量类型，我们可以更加精确地定义数据的类型和取值范围，提高代码的可读性和可维护性。

类型推断

在TypeScript中，类型推断是编译器自动推断变量的类型，而无需显式指定类型。编译器根据变量的值来推断变量的类型。

下面是一些需要注意的类型推断的情况：

1. 初始化变量时：编译器会根据变量的初始值来推断变量的类型。

let x = 5; // 推断 x 的类型为 number
let y = "hello"; // 推断 y 的类型为 string

2. 默认参数值：如果函数参数具有默认值，则编译器会根据默认值的类型推断参数类型。

function greet(message = "hello") {
  console.log(message);
}

greet(); // 推断参数 message 的类型为 string

3. 函数返回值类型：如果函数具有明确的返回语句，则编译器会根据返回值的类型推断函数的返回类型。

function add(x: number, y: number) {
  return x + y;
}

let result = add(1, 2); // 推断 result 的类型为 number

4. 上下文类型：当上下文提供了所需的类型信息时，编译器会根据上下文来推断变量的类型。这通常发生在函数参数的位置。

window.addEventListener("click", function(event) {
  console.log(event.clientX); // 推断 event 的类型为 MouseEvent
});

需要注意的是，虽然TypeScript的类型推断功能非常强大，但有时候也会出现错误的推断结果。在这种情况下，你可以显式地声明变量的类型来解决问题。例如：

let x: number = 5; // 显式声明 x 的类型为 number