ts对应js的数据类型
let name: string = “bob”;
let age: number = 37;
let isDone: boolean = false;
let u: undefined = undefined;
let n: null = null;
let obj: object = {x: 1};
let bigLiteral: bigint = 100n;
let sym: symbol = Symbol(“me”);Array
// 元素类型[] let list: number[] = [1, 2, 3]; // Array<元素类型> let list: Array<number> = [1我爱线报网, 2, 3]; interface MyObject { name: string; age: number; } let arr: MyObject[] = [{name: “兔兔”, age: 18}] // OKTuple
对于内部不同类型的数组可以使用元组类型来定义注意,元组类型只能表示一个已知元素数量和类型的数组,长度已指定,越界访问会提示错误。例如,一个数组中可能有多种类型,数量和类型都不确定,那就直接any[]。let x: [string, number]; x = [hello, 10]; // OK x = [10, hello]; // Errorundefined和nul我爱线报网l
默认情况下null和undefined是所有类型的子类型。 就是说你可以把null和undefined赋值给任何类型的变量。void
void表示没有任何类型,和其他类型是平等关系,不能直接赋值一般也只有在函数没有返回值时去声明any和unknown
any(既是top type又是bottom type)会跳过类型检查器对值的检查,任何类型的值可以赋值给any,同时any类型的值也可以赋值给任何类型所有类型都可以分配给unknown(top type),但它只能赋值给unknown和anynever
never类型表示的是那些永不存在的值的类型。比如函数执行时抛出异常或者函数中的死循环,不存在返我爱线报网回值是任何类型的子类型,也可以赋值给任何类型,但没有类型可以赋值给never类型as 类型断言
类型转换通常发生在你比TS更了解某个值的详细信息的时候。// as 语法 let someValue: any = “this is a string”; let strLength: number = (someValue as string).length;跳过ts校验,保证有值
// 断言event.target有值,不为null/undefined const a:string = event.target!.name类型推论
如果没有明确的指定类型,那么 TypeScript 会依照类型推论的规则推断出一个类型。老舅推荐:C我爱线报网++刷爆2023面试圈的C++六大优质简历项目:点击查看C++硬核项目(含源码)如果你正在挑战(C++后端, SPDK, 内核,音视频,go云原生,Qt)的开发岗位。
这里的每一个项目都能让你斩获大厂offer!!
let myFavoriteNumber = seven; myFavoriteNumber = 7; // Error联合类型
联合类型表示取值可以为多种类型中的一种,使用 | 分隔每个类型let myFavoriteNumber: string | number; myFavoriteNumber = seven; // OK myFavoriteNumber = 7; // OK& 交叉类型我爱线报网
交叉类型是将多个类型合并为一个类型如果key相同但是类型不同,则该key为never类型。interface A { name: string, age: number } interface B { name: string, gender: string } let a: A & B = { // OK name: “兔兔”, age: 18, gender: “男” };interface 接口
定义一些参数,规定变量里面有什么参数,参数是什么类型,使用时就必须有这些对应类型的参数,少或者多参数、参数类型不对都会报错interfaceLabeledValue { la我爱线报网bel:string; money?: number; // 可选属性 readonly x: number; // 只读属性 [key: string]: any; // 索引签名,TypeScript 支持两种索引签名:字符串和数字。 } function printLabel(labeledObj: LabeledValue) { console.log(labeledObj.label); } // myObj中的属性会进行类型推论,以此绕过多余的类型检查 let myObj = { size: 10, label: “Size 10 Object” }; printLabel(myObj); // O我爱线报网KReadonlyArray
数组创建后再也不能被修改let a: number[] = [1, 2, 3, 4]; let ro: ReadonlyArray<number> = a; ro[0] = 12; // Error ro.push(5); // Error ro.length = 100; // Error a = ro; // Error a = ro as number[]; // OKextends 接口继承接口
接口可以多继承。使用多继承时,先确保父接口没有共有属性,或共有属性定义的类型都相同。interface Shape { color: string; } interfacePenStrok我爱线报网e { penWidth:number; } interface Square extends Shape, PenStroke { sideLength: number; } let square: Square = { sideLength: 1 } // Error let square1: Square = { sideLength: 1, color: red } // Error let square2: Square = { sideLength: 1, color: red, penWidth: 2 } // OKPick 选择性继承
主要是从一个已知的类型中,取出子集,作为一个新的类型返回/我爱线报网/ 原始类型 interface TState { name: string; age: number; like: string[]; } // 如果我只想要name和age interface TSingleState extends Pick<TState, “name” | “age”> {}; 或者 interface TSingleState extends Pick<TState, “name” | “age”> ;函数声明
// 剩余参数 function sum(x: number, y: number, …rest: any[]): number { returnx + y;我爱线报网 }函数表达式
// 可选参数、参数默认值 let mySum: (x: number, y: number, m:number = 11, z?: number) => number = function (x: number, y: number): number { return x + y; };用接口定义函数类型
interface SearchFunc{ (source: string, subString: string): boolean; } let mySearch: SearchFunc = function(source: string, subString: string) { // OK let我爱线报网 result = source.search(subString); return result >-1; };内置对象
let s: String = new String(兔神); let n: Number = new Number(123); let b: Boolean = new Boolean(1); let e: Error = new Error(Error occurred); let d: Date = new Date(); let r: RegExp = /[a-z]/; let body: HTMLElement = document.body; let allDiv: NodeList = document.querySelectorAll我爱线报网(div); document.addEventListener(click, function(e: MouseEvent) { // Do something }); function sum() { let args: IArguments = arguments; // 类数组对象 }type 类型别名
类型别名就是给一种类型起个别的名字,使用type关键字来定义type StringType = string; let str: StringType; str = hello; str = 123 // Errorimport type … from & export type … from
导入或者导出类型文件,编译器将把这我爱线报网些类型文件删除
import type … from — 让编译器知道您要导入的内容绝对是一种类型。export type … from — 一样, 仅用作导出。 // src/lib-type-re-export.ts export type { Track, Playlist } from “./types”; // 类型文件 export type { CreatePlaylistRequestParams } from “./api”; // 类型文件 export { createPlaylist } from “./api”; // 会被编译为: // dist/lib-type-re-export.js expo我爱线报网rt { createPlaylist } from “./api”;字符串字面量类型
字符串字面量类型用来约束取值只能是某几个字符串中的一个。type Name = ALisa | Bob | Cola let name: Name = Alisa; // Error 与 DOM 中的全局 window 对象下的 name 属性出现了重名 let name1: Name = ALisa; // OK let name2: Name = Bob; // OK let name3: Name = Cola; // OK let name4: Name = 兔兔; // ErrorEnum 枚举
枚举是一个被命名的整型常数的集合TS支持数字的和基于字符串的枚我爱线报网举。// 数字枚举 enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat}; console.log(Days.Sun) // 0 console.log(Days.Mon) // 1 // 初始化枚举成员,那么该初始化成员后面的成员会在它的基础上自动增长1 enum Days {Sun = 1, Mon, Tue, Wed, Thu, Fri, Sat}; console.log(Days.Sun) // 1 console.log(Days.Mon) // 2 // 字符串枚举 enum Direction { Up = “UP”, Down = “DOWN”, Le我爱线报网ft =“LEFT”, Right = “RIGHT”, } // 异构枚举,枚举可以混合字符串和数字成员 enum Direction { name = 兔兔, age = 18 }class 类
class Animal { // public 修饰符,类的属性、方法可以在外部访问 public static age: number = 18; // 类的属性、方法不可以在外部访问 private static title: string = 兔兔; // protected 修饰符,在派生类中仍然可以访问(继承中可以访问) protected title: string = 兔兔; class Animal { con我爱线报网structor(public name: string, private age: number, protected sex: string) { } } Animal.age; // OK Animal.title; // Errorabstract 抽象类
象类做为其它派生类的基类使用, 不允许被实例化。抽象类中的抽象方法不包含具体实现并且必须在派生类中实现abstract class Department { constructor(public name: string) { } printName(): void { console.log(Department name: +我爱线报网this.name); } abstract printMeeting(): void; // 必须在派生类中实现 } class AccountingDepartment extends Department { constructor() { super(Accounting and Auditing); // 在派生类的构造函数中必须调用 super() } printMeeting(): void { console.log(The Accounting Department meets each Monday at 10am.); } generateReports(): void { c我爱线报网onsole.log(Generating accounting reports…); } } let department: Department; // OK:允许创建一个对抽象类型的引用 department = new Department(); // Error: 不能创建一个抽象类的实例 department = new AccountingDepartment(); // OK:允许对一个抽象子类进行实例化和赋值 department.printName(); // OK department.printMeeting(); // OKdepartment.generateReports(我爱线报网);// Error: 方法在声明的抽象类中不存在 复制代码implements 类实现接口
用类去实现接口interface Age { age: number; } interface Title{ title: string; } class title implements Title, Age{ title: string = 兔兔; age: number = 18; }T 泛型
泛型是指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性。// 泛型函数 function identity<T>(arg: T): T { returnarg; } ide我爱线报网ntity<number>(1); // OK:明确的指定`T`是`number`类型 identity(1); // OK:让编译器自己推断类型 // 泛型约束,在函数内部使用泛型变量的时候,由于事先不知道它是哪种类型,所以不能随意的操作它的属性或方法。 function loggingIdentity<T>(arg: T): T { console.log(arg.length); // Error return arg; } function loggingIdentity<T>(arg: T[]): T[] { console.log(arg.length); // OK return arg; } // 泛型我爱线报网接口 interface Person<T> { name: T; getAge(arg: T): T; } let myIdentity: Person<string> = { name: “兔兔”, getAge(name) { return name } }; // 泛型类 class GenericNumber<T> { zeroValue: T; add: (x: T, y: T) => T; } let myGenericNumber = new GenericNumber<number>(); // 泛型参数的默认类型 function我爱线报网 createArray<T = string>(length: number, value: T): Array<T> { }类型守卫
// 要定义一个类型守卫,我们只要简单地定义一个函数,它的返回值是一个类型谓词 function isA(person: A | B): person is A{ return(person as A).name !== undefined; } // 使用 function doSomething(person: A | B): void { if(isA(person)) { // OK // … } } // 使用in操作符 // typeof类型守卫 // instanceof我爱线报网类型守卫 // 给力项目:线报网会员可免费下载 加入会员友情提醒: 请尽量登录购买,防止付款了不发货!
QQ交流群:226333560 站长微信:qgzmt2