Loading... # TypeScript类型声明:基础与进阶 TypeScript是一种为JavaScript添加了静态类型的编程语言,能够提高代码的可维护性和可靠性。类型声明是TypeScript的核心功能之一,通过定义明确的类型,开发者可以更好地约束代码行为,减少运行时错误。本文将详细介绍TypeScript的基础和进阶类型声明。 ![](https://www.8kiz.cn/usr/uploads/2024/06/3016705376.png) ## 一、基础类型声明 ### 1. 基本数据类型 TypeScript提供了与JavaScript相同的基本数据类型,并在其基础上添加了类型约束。 #### 数字(Number) ```typescript let num: number = 10; ``` #### 字符串(String) ```typescript let str: string = "Hello, TypeScript!"; ``` #### 布尔值(Boolean) ```typescript let isActive: boolean = true; ``` #### 数组(Array) 可以使用两种方式声明数组类型: ```typescript let numArray: number[] = [1, 2, 3]; let strArray: Array<string> = ["one", "two", "three"]; ``` #### 元组(Tuple) 元组用于表示已知数量和类型的数组: ```typescript let tuple: [number, string] = [1, "one"]; ``` #### 枚举(Enum) 枚举类型用于定义一组命名常量: ```typescript enum Color { Red, Green, Blue } let color: Color = Color.Green; ``` #### 任意类型(Any) `any`类型用于动态内容,不进行类型检查: ```typescript let randomValue: any = 42; randomValue = "A string"; randomValue = true; ``` #### 空值(Void) `void`类型通常用于没有返回值的函数: ```typescript function logMessage(message: string): void { console.log(message); } ``` #### Null和Undefined 可以分别使用 `null`和 `undefined`类型: ```typescript let u: undefined = undefined; let n: null = null; ``` ### 2. 接口(Interface) 接口用于定义对象的类型: ```typescript interface Person { name: string; age: number; } let john: Person = { name: "John Doe", age: 30 }; ``` ### 3. 函数类型 可以为函数定义类型,包括参数和返回值: ```typescript function add(x: number, y: number): number { return x + y; } let myAdd: (a: number, b: number) => number = add; ``` ### 4. 类型别名(Type Alias) 类型别名用于给类型起一个新名字: ```typescript type StringOrNumber = string | number; let value: StringOrNumber; value = "Hello"; value = 123; ``` ## 二、进阶类型声明 ### 1. 联合类型(Union Types) 联合类型表示一个值可以是几种类型之一: ```typescript let id: number | string; id = 10; id = "A123"; ``` ### 2. 交叉类型(Intersection Types) 交叉类型将多个类型合并为一个类型: ```typescript interface CanFly { fly(): void; } interface CanSwim { swim(): void; } type Amphibious = CanFly & CanSwim; let frog: Amphibious = { fly() { console.log("Flying"); }, swim() { console.log("Swimming"); } }; ``` ### 3. 类型推断 TypeScript能够根据赋值自动推断变量的类型: ```typescript let inferredString = "Hello, World!"; // 推断为string类型 ``` ### 4. 类型守卫(Type Guards) 类型守卫用于细化联合类型: ```typescript function isString(value: any): value is string { return typeof value === "string"; } function example(value: string | number) { if (isString(value)) { console.log("It's a string: " + value); } else { console.log("It's a number: " + value); } } ``` ### 5. 泛型(Generics) 泛型用于创建可重用的组件: ```typescript function identity<T>(arg: T): T { return arg; } let output = identity<string>("Hello"); ``` ### 6. 高级类型 #### 条件类型(Conditional Types) 根据条件选择类型: ```typescript type NonNullable<T> = T extends null | undefined ? never : T; ``` #### 映射类型(Mapped Types) 根据旧类型创建新类型: ```typescript type Readonly<T> = { readonly [P in keyof T]: T[P]; }; interface Person { name: string; age: number; } let readonlyPerson: Readonly<Person> = { name: "John", age: 30 }; ``` #### 索引类型(Index Types) 用于查询对象类型的属性: ```typescript function getProperty<T, K extends keyof T>(obj: T, key: K) { return obj[key]; } let person = { name: "Alice", age: 25 }; let name = getProperty(person, "name"); ``` ## 分析说明表 | 类型 | 用法 | 示例 | | -------- | ---------------------------- | ----------------------------------------------------------------------------------- | | 基本类型 | 定义基本数据类型 | `let num: number = 10;` | | 数组 | 定义数组类型 | `let numArray: number[] = [1, 2, 3];` | | 元组 | 定义已知类型和长度的数组 | `let tuple: [number, string] = [1, "one"];` | | 枚举 | 定义一组命名常量 | `enum Color { Red, Green, Blue }` | | 接口 | 定义对象的结构 | `interface Person { name: string; age: number; }` | | 函数类型 | 定义函数的参数和返回值类型 | `let myAdd: (a: number, b: number) => number = add;` | | 类型别名 | 给类型起别名 | `type StringOrNumber = string | | 联合类型 | 定义可以是多种类型之一的变量 | `let id: number | | 交叉类型 | 将多个类型合并为一个类型 | `type Amphibious = CanFly & CanSwim;` | | 泛型 | 创建可重用的组件 | `function identity<T>(arg: T): T { return arg; }` | | 条件类型 | 根据条件选择类型 | `type NonNullable<T> = T extends null | | 映射类型 | 根据旧类型创建新类型 | `type Readonly<T> = { readonly [P in keyof T]: T[P]; };` | | 索引类型 | 查询对象类型的属性 | `function getProperty<T, K extends keyof T>(obj: T, key: K) { return obj[key]; }` | ## 总结 通过本文的介绍,我们详细探讨了TypeScript的基础与进阶类型声明。从基本数据类型到复杂的泛型和高级类型,TypeScript提供了丰富的工具来确保代码的类型安全和可维护性。掌握这些类型声明能够帮助开发者编写更加健壮和高效的代码,提高开发效率和代码质量。希望本文能为您在使用TypeScript时提供实用的参考和指导。 最后修改:2024 年 06 月 12 日 © 允许规范转载 打赏 赞赏作者 支付宝微信 赞 如果觉得我的文章对你有用,请随意赞赏