TypeScript类型检查机制
类型推断
指不需要指定变量的类型,TS编译器可以根据某些规则自动推断出类型。
什么时候会有类型推断?
- 声明变量时没有指定类型
- 函数默认参数
- 函数返回值
- ......
let a; // 这时自动推断为any类型 let b = 1; // 推断为number类型 let c = []; // 推断为由any类型构成的数组 let d = (x=1) => x+1; // 函数传参时,默认参数被推断成number类型,返回值也会被推断 let e = [1,null]; // 推断出兼容所有数据的类型:number和null的联合类型 有时候TS类型推断不符合我们的预期,我们应该比编译器更有信心它应该是什么类型,类型断言就允许我们覆盖TS的推论。 interface Foo{ bar: number } let foo: Foo = {} as Foo; // 如果一个对象按照接口的约定,需要有很多的属性和方法,难以在声明的时候定义完全。这时候可以用断言 foo.bar = 1; // 具体的定义在这里
注意:类型断言不能乱用,要对上下文环境有充足的预判,没有任何根据的断言会带来安全隐患!
类型兼容
TS允许类型相互兼容的变量(函数、类等结构)相互赋值。
当一个类型Y可以被赋值给另一个类型X时,就认为类型X兼容Y,X为目标类型,Y为源类型。
兼容规则:
- 结构之间兼容:成员少的兼容成员多的
- 函数之间兼容:参数多的兼容参数少的
接口兼容性
interface X { a: any; b: any; } interface Y { a: any; b: any; c: any; } let x: X = {a:1,b:2}; let y: Y = {a:1,b:2,c:3}; x = y; // x兼容y 成员少的会兼容成员多的
函数兼容性
// 参数个数的兼容 type Handler = (a: number,b: number) => void; function hof(handler: Handler) { return handler } let handler1 = (a:number) => {}; hof(handler1); // 一个参数可以兼容 let handler2 = (a: number,b: number,c: number) => {}; // hof(handler2); // 三个参数不被兼容 // 可选参数和剩余参数的兼容 let a1 = (p1: number, p2: number) => {}; let b1 = (p1?: number, p2?: number) => {}; let c1 = (...args: number[]) => {}; a1 = b1; a1 = c1; // b1 = a1; // 可选参数不能被兼容。需要将tsconfig.json中“strictFunctionTypes”置为false即可 // b1 = c1; c1 = a1; c1 = b1;
类的兼容性
两个定义不同的类互不兼容,子类在继承父类后没有做改动,可以兼容父类。
泛型的兼容性
两个定义完全一样的泛型函数相互兼容
类型保护
TypeScript能够在特定的区块中保证变量属于某种确定的类型。可以在此区块中放心地访问此类型的属性和方法。
比如,我们要判断一个对象是否含有某个方法
interface OBJ { name: string, age: number, sex: boolean } let obj: OBJ = { name: "typescript", age: 10, sex: true, }; if(obj.sex) // obj中有sex属性,所以OK { console.log("has sex"); } // if(obj.bac) {} // obj中没有bac属性,此处报错。
我们有四种提供类型保护的方式:
- instanceof 用于判断一个实例是否属于某个类
- in 判断一个属性/方法是否属于某个对象
- typeof 用于判断基本类型
- 类型保护函数 当判断逻辑复杂时,可以自定义判断函数
class Java { helloJava(){ console.log("hello java"); } java: any; } class JavaScript { hellloJavaScript(){ console.log("hello javascript"); } javascript: any; } // 类型保护函数 注意参数类型 和 返回值类型 的关系 function isJava(lang: Java|JavaScript):lang is Java { return (lang as Java).helloJava !== undefined } function getLanguage(type: number,x: string|number|boolean) { let lang = type === 1 ? new Java() : new JavaScript(); // instanceof 判断lang是否属于Java类 if(lang instanceof Java) { lang.helloJava(); // 在这个区块中,能够保证lang一定是java的实例,调用自己的方法 }else { lang.hellloJavaScript(); // 这个区块中,一定能够保证lang是JavaScript的实例 } // in “helloJava”方法是否属于lang对象 if("helloJava" in lang) { lang.java; // 在这个区块中能够保证,lang是java的实例 }else { lang.javascript // 这个区块中能够保证lang是JavaScript的实例 } // typeof 用于判断基本类型 if(typeof x === "string") { x.length // 程序进入这个区块,能够保证x是string类型。可以调用字符串原生方法 }else if(typeof x === "number") { x.toFixed(2); // 在这里能够调用数字的原生方法 }else { x = !x; } // 类型保护函数 在定义的时候,注意返回值的类型和参数类型的关系 if(isJava(lang)) { lang.helloJava(); }else { lang.hellloJavaScript(); } } getLanguage(2,"str");