网站建设专家哪家强,负责加强局网站建设,仿站 做网站,汕头论坛网TS学习笔录 1、TS 数据类型有哪些#xff1f;2、元组是什么#xff1f;3、union#xff08;联合类型#xff09; Literal#xff08;字面量类型#xff09;?4、any 和 unknown 的区别#xff1f;5、Object 对象类型#xff1f;6、type 、interface 、 class 之间… TS学习笔录 1、TS 数据类型有哪些2、元组是什么3、union联合类型 Literal字面量类型?4、any 和 unknown 的区别5、Object 对象类型6、type 、interface 、 class 之间的区别 1、TS 数据类型有哪些
基本类型 numberbooleanstringundefinednullsymbolbigIntarrayobjecttuple元组enum枚举anyvoidneverunknown 高级类型 union 组合类型Nullable 可空类型Literal 预定义类型
2、元组是什么
元组是一种表示具有固定数量和类型的有序元素集合的数据类型。一个元组可以包含不同类型的数据例如一个元组可以包含字符串、数字和布尔值。
元组在 TypeScript 中的用途包括
声明函数返回值的类型特别是当函数返回多个值时可以使用元组类型来指定返回值的类型。
提供一种更具体的数据类型来确保数据的类型安全性。使用元组类型可以确保数组中的每个元素都是正确的类型。
在处理异构数据时即包含不同类型的数据可以使用元组类型。
例如
let person: [string, number] [John, 25];
console.log(person[0]); // John
console.log(person[1]); // 253、union联合类型 Literal字面量类型?
联合(Union) 类型
联合类型就是一个变量的值可以是多个类型。比如
let union: number | string;
union 10;
union hello;变量 union 是一个联合类型多个类型之间使用竖线 | 分割变量既可以是 number 类型也可以是 string 类型。
再看一个例子定义一个函数可以求两个数字的和也可以做两个字符串的拼接
function merge(a: number | string, b: number | string) {// 需要对参数类型做一个判断if (typeof a string || typeof b string) {return a.toString() b.toString();} else {return a b;}
}merge(10, 20);
merge(hello, world);不仅类型确定的值也可以联合使用
let union: 0 | 1 | 2;此时变量 union 不仅确定了属于 number 类型值的取值范围也确定了。
字面量(Literal)类型
字面量类型就是直接写出一个值来赋值给变量。具体来讲主要分为数字字面量类型字符串字面量类型真值字面量类型对象字面量类型枚举字面量类型等。比如
const num 3;
const str kw;
const flag true;这三个变量的类型分别为 2、kw、true 类型等于值就是字面量类型。
上面联合类型中将值作为联合类型使用其实就是字面量类型的联合类型。
字面量类型非常像是枚举类型等学到的时候可以做一个比较。
类型断言
类型断言也叫类型适配主要用于类型的适配工作将变量从一个类型断言为另一个类型。
先看一段代码
let message: any hello;
message.toUpperCase();变量 message 声明为了 any 类型但是其值是一个字符串类型想要调用字符串类型的 toUpperCase 方法但是编辑器并没有给出类型提示。
这是因为编辑器将 message 识别为 any 类型而 any 类型并没有 toUpperCase 方法。
此时就可以使用类型断言了
let message: any hello;// 使用 as 关键字将变量从 any 类型断言为 string 类型
// 编辑器就会将 message 识别为 string 类型从而给出类型提示
(message as string).toUpperCase();除了使用 as 关键字还可以在变量前通过一对尖括号 写明要断言的类型
(stringmessage).toUpperCase();需要注意的是类型断言并不是类型转换变量的类型并不会发生转换依然是原来的类型只不过在断言的那一刻能让 TS 编译器认为它是某个指定类型。
4、any 和 unknown 的区别
any 类型 表示任意类型即可以赋值给任何类型的变量。使用 any 类型后该变量可以进行任何操作而不会触发类型检查相当于关闭了类型检查器的所有限制。unknown 类型 表示未知类型即不确定具体类型的变量。与 any 不同使用 unknown 类型后该变量在没有进行类型检查或类型断言之前不能被赋值给其他变量或进行任何操作。
5、Object 对象类型
和 JS 声明形式一致只是 JS 是 key to value 的形式TS 是 key to type 的形式。
6、type 、interface 、 class 之间的区别
1、type
type 是 TypeScript 中用于定义类型别名、联合类型、交叉类型等复杂类型的声明方式。它在编译后的 JavaScript 代码中被移除因为它们仅在编译阶段用于类型检查。换句话说type 不需要运行时信息。
类型别名Type Aliases 类型别名是给一个类型起一个新名字。例如
type StringOrNumber string | number;联合类型Union Types 联合类型表示一个值可以是多个类型中的一种。例如
type StringOrNumber string | number;交叉类型Intersection Types 交叉类型表示一个值必须满足多个类型的要求。例如
type Name { name: string };
type Age { age: number };
type Person Name Age;不需要运行时信息
在 TypeScript 中有些类型信息仅在编译时起作用而在运行时则不存在。例如type 和 interface 定义的类型信息在编译后的 JavaScript 代码中被移除因为它们仅在编译阶段用于类型检查。相比之下class 定义的类型信息会保留在编译后的代码中因为它们包含实际的属性和方法实现这些信息在运行时是必需的。
2、interface
interface 主要用于定义对象的类型和形状。它支持继承和实现因此非常适合创建复杂的对象类型。和 type 一样interface 定义的类型信息在编译后的代码中被移除。
interface 可以通过关键字 extends 实现接口继承通过关键字 implements 实现接口实现。这让我们可以创建具有多层次的类型结构。
例如
interface Animal {name: string;speak(): void;
}interface Dog extends Animal {breed: string;
}class Labrador implements Dog {name: string;breed: string;constructor(name: string, breed: string) {this.name name;this.breed breed;}speak() {console.log(${this.name} says woof!);}
}3、class
class 是一种定义类型和实现的方式。它既包含类型信息也包含实际的属性和方法实现。与 type 和 interface 不同class 定义的类型信息会保留在编译后的代码中因为它们在运行时是必需的。
class 可以通过关键字 extends 实现类继承还可以通过关键字 implements 实现接口实现。这使得 class 成为创建具有多层次结构和行为的对象的理想选择。
class User {name: string;age: number;constructor(name: string, age: number) {this.name name;this.age age;}sayHello(): void {console.log(Hello, my name is ${this.name});}
}class Students extends User {role: string;constructor(name: string, age: number, role: string) {super(name, age);this.role role;}
}总结
在 TypeScript 中type、interface 和 class 分别具有自己的用途和特点。
type 适用于定义类型别名、联合类型、交叉类型等并且不需要运行时信息。interface 主要用于定义对象的类型和形状支持继承和实现。class 既包含类型信息也包含实际的属性和方法实现。在实际开发中我们应根据需求选择合适的类型声明方式。
虽然 type 和 interface 在很多场景下可以互换使用但它们在某些特定场景下有着各自的优势。type 更适用于组合不同类型如联合类型、交叉类型等而 interface 更适用于定义对象的形状特别是在面向对象编程中。class 则提供了完整的类型定义和实现可以在运行时进行实例化和操作。
在实践中我们应该根据实际需求和场景选择合适的类型声明方式。例如在定义一个复杂的对象类型时可以使用 interface在组合不同类型时可以使用 type在创建具有行为的对象时可以使用 class。
