联合类型：通俗点说就是一个变量可能有多种类型。
比如：一个人（person）有可能是老师（teacher），也有可能是服务员（waiter），但是不可能同时是老师和服务员。
interface teacher{
type:string;
say:()=>{};
}
interface waiter{
type:string;
run:()=>{};
}
// 调用
function person(animal: waiter | teacher) {}
animal就是一个联合类型，但是现在直接调用animal中的方法的时候会报错：
function person2(animal: Waiter | Teacher) {
animal.say();
}
因为，其二种接口中的方法即属性可能是不同的。
这个时候，我们就需要传说中的类型保护
一：类型保护-类型断言
类型断言就是通过断言的方式确定传递过来的准确值，比如上面的程序，如果type是teacher，说明他就是老师，这时候就可以通过断言animal as Teacher,然后直接调用say方法,程序就不再报错了。
同样如果type是waiter，说明就是服务员，这时候调用run()方法，就不会报错了。
这就是通过断言的方式进行类型保护。也是最常见的一种类型保护形式。
interface teacher{
type:string;
say:()=>{};
}
interface waiter{
type:string;
run:()=>{};
}
/**
* 类型断言
* @param animal
*/
function person1(animal: waiter | teacher)
{
// 通过接口中的类型判断
if (animal.type == 'teacher')
{
(animal as teacher).say();
}
else
{
(animal as waiter).run();
}
}
二：类型保护-in 语法
使用in来判断接口中是否有当前你要调用的语法。代码如下：
/**
* in 语法
* @param animal
*/
function person2(animal: waiter | teacher)
{
// 通过接口中的类型判断
if ("say" in animal)
{
animal.say();
}
else
{
animal.run();
}
}
三：类型保护-typeof语法
先来写一个新的add方法，方法接收两个参数，这两个参数可以是数字number也可以是字符串string,如果我们不做任何的类型保护，只是相加，这时候就会报错。代码如下:
/**
* typeof 语法
*/
function add(first: string | number,secord:string | number)
{
return first + secord; // 这条语句会报错
}
正确的写法如下：
/**
* typeof 语法
*/
function add(first: string | number,secord:string | number)
{
if(typeof first === 'string' || typeof secord === 'string')
{
return `${first}${secord}`;
}
return first + secord;
}
四：类型保护-instanceof 语法
比如现在要作类型保护的是一个对象，这时候就可以使用instanceof语法来作。现在先写一个NumberObj的类，代码如下：
class NumberObj {
count: number;
}
然后我们再写一个addObj的方法，这时候传递过来的参数，可以是任意的object,也可以是NumberObj的实例，然后我们返回相加值，当然不进行类型保护，这段代码一定是错误的。
function addObj(first: object | NumberObj, second: object | NumberObj) {
return first.count + second.count;
}
报错不要紧，直接使用instanceof语法进行判断一下，就可以解决问题。
function addObj(first: object | NumberObj, second: object | NumberObj) {
if (first instanceof NumberObj && second instanceof NumberObj) {
return first.count + second.count;
}
return 0;
}
另外要说的是，instanceof 只能用在类上。这节课我大概说了四种类型保护的方式，每种方式都在不同场景中使用(还有一些不太常用的类型保护方式)，可能需要自己深刻理解。
有好的建议，请在下方输入你的评论。
欢迎访问个人博客
https://guanchao.site
网友评论