前言????

  • 虽然之前有学过​​TypeScript​​​但是平时业务上面都还是用​​JavaScript​​​来开发导致逐渐对​​TypeScript​​生疏了。
  • 借此更文活动的机会再来一起学习一下​​TypeScript​​的知识吧。
  • 本文也是​​TypeScript​​基础篇的最后一篇，接下来会分享一下进阶篇的知识。

类型断言????

  • 类型断言可以用来手动指定一个值的类型。
  • 类型断言一般使用​​as​​来连接，即值​​as​​类型。

断言为联合类型中的一个类型????

  • 我们一般在什么时候需要使用到断言呢？我们之前​​联合类型​​提到:
let someThing: string | number;
someThing = 'lwj';
someThing = 5201314;
console.log(someThing.length) //报错
  • 在上面的代码中最后的​​someThing.length​​​是执行不了的，因为​​TypeScrip​​​实际上是​​'不确定'​​该值什么时候是什么类型的，所以会报错，这时候我们可以使用类型断言。
interface Student {
    name: string;
    speak(): string;
}
interface Teacher {
    name: string;
    talk(): string;
}
function isTeacher(people: Student | Teacher) {
    people.talk() //报错
    (people as Teacher).talk() //不报错
    return false;
}
  • 像上面定义了两个接口分别有相同的属性和不同的方法，当我们执行​​people.talk()​​​的时候其实​​TypeScrip​​​不知道该值是属于​​Student​​​还是​​Teacher​​​的，所以他自然而然会报错，但是当我们使用了类型断言后，这样相当于就是告诉​​TypeScrip​​​这个​​people​​​就是​​Teacher​​类型，自然而然也不会报错了。
  • 但是使用类型断言也会有不好的地方，就比如
interface Student {
    name: string;
    speak(): void;
}
interface Teacher {
    name: string;
    talk(): void;
}
function isTeacher(people: Student | Teacher) {
    (people as Teacher).talk() //不报错
    return false;
}
const man:Student={
    name:'lwj',
    speak(){console.log('编译器不报错')}
}
isTeacher(man) //运行时报错
  • 在上面这个例子中我们给​​isTeacher​​​函数传入了一个​​man​​​对象，这个对象没有​​talk​​​方法，但是当我们运行​​isTeacher​​​时我们断言了这个参数是​​Teacher​​​类型，也就是我们断言了这个参数会有​​talk​​​方法，所以编译器相信了我们不报错，但是事实上​​man​​​对象是没有​​talk​​​方法的所以最后转换成​​js​​编译的时候会报错。

断言为任意（any）????

  • 在​​TypeScript​​中我们一般用对象​​.​​​​属性或方法​​来获取属性或者执行方法。
  • 我们在​​JavaScript​​中也可以直接使用对象​​.​​​​属性或方法​​​来新增一个属性或方法，但这样的操作在​​TypeScript​​是不允许的。

「TypeScript」入门基础(四)---类型断言_javascript

  • 如上图所示我们想给​​window​​​对象新增一个​​num​​​属性值为​​1​​​，这样会报错，所以我们可以将​​window​​​断言为​​any​​。
(window as any).num = 1; //不报错
  • 即使断言可以这样时候，但是这也是我们迫不得已实在没办法了才用的，我们既然使用了​​TypeScript​​就要用严格的类型规范来规范我们的项目。

类型断言的限制????

  • ​​TypeScript​​是结构类型系统，类型之间的对比只会比较它们最终的结构，而会忽略它们定义时的关系。
  • 在​​TypeScript​​​中并不是所有类型都可以断言为另一个类型，类型要可以断言必须满足一个条件​​兼容​​。
  • ​​兼容​​说起来也不是特别难理解。
interface Student {
    name: string;
}
interface Teacher {
    name: string;
    talk(): void;
}

function testpeople(teacher: Teacher) {
    return (teacher as Student);
}
function people(student: Student) {
    return (student as Teacher);
}
  • 在上面的代码中第一个​​teacher as Student​​​不会报错是因为​​Teacher​​​其实可以理解为是继承了​​Student​​​的属性然后新增了一个​​talk()​​​，所以在这程度上​​Teacher​​​是兼容​​Student​​的。
  • 而第二个​​student as Teacher​​​不会报错是因为​​Teacher​​​拥有所有​​Student​​​的属性和方法，就比如他拥有了​​name​​​属性，所以在这程度上​​Student​​​是兼容​​Teacher​​的。
  • 所以我们在判断两个类型是否兼容的时候只需要看到一个类型的属性和方法在另一个类型里面是不是都有，如果是那么他们就是兼容的，就可以使用断言。

写在最后????

  • 本文也算是记录一下​​TypeScript​​​的学习，接下来我会持续输出​​TypeScript​​相关的知识，大家可以一起来学习。
  • 如果您觉得这篇文章有帮助到您的的话不妨????关注+点赞+收藏+评论+转发????支持一下哟~~????