联合类型和类型保护

类型保护

1、类型断言的方式

interface Bird {
  fly: boolean;
  sing: () => {};
}

interface Dog {
  fly: boolean;
  bark: () => {};
}


// 类型断言的方式
function trainAnial(animal: Bird | Dog) {   // 使用 | 就是联合类型 
  if (animal.fly) {
    // animal.sing();           // 错误 因为typescript不知道animal是否有sing方法
    (animal as Bird).sing();    // 正确 使用类型断言 
  } else {
    (animal as Dog).bark();
  }
}

2、in 语法做类型保护

interface Bird {
  fly: boolean;
  sing: () => {};
}

interface Dog {
  fly: boolean;
  bark: () => {};
}


function trainAnialSecond(animal: Bird | Dog) {
  if ('sing' in animal) {
    animal.sing();
  } else {
    animal.bark();
  }
}

3、typeof 方式

function add(first: string | number, second: string | number) {
    return first + second;  // 错误 string不能使用 + 操作符
}

// 正确
function add(first: string | number, second: string | number) {
  if (typeof first === 'string' || typeof second === 'string') {
    return `${first}${second}`;
  }
  return first + second;
}

4、instanceof 方式

class NumberObj {
  count: number;
}


// 错误
function addSecond(first: object | NumberObj, second: object | NumberObj) {
 return first.count + second.count; // count不一定存在,因为first和second可能是NumberObj或者其他对象
}

// 正确
function addSecond(first: object | NumberObj, second: object | NumberObj) {
  if (first instanceof NumberObj && second instanceof NumberObj) {
    return first.count + second.count;
  }
  return 0;
}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容