00:00
呃,刚刚呢,咱们讲了一下类型注解啊,接下来呢,我们来演示一下接口,其实和类型注解它也是有关系的啊,注意啊,咱们现在并没有去讲接口到底是怎么回事,只不过是在演示一下这个东西而已,大家可以把它当成是一种能力或者说一种约束也是可以的啊。好,首先呢,我在这边也是新建一个文件啊,那就是零二下线接口点TS。呃,当然了,GS目录里边会给我产生一个接口,点JS文件啊,它里边什么也没有,为了让大家看到这个效果,我在index.html当中把这个代码先出示掉。然后写个新的注释。123啊,这个是引入什么呢?接口的GS文件。来一个SQ标签啊,这么写吧。点杠它下边的接口点GS啊好搞定放在这,这个我暂时不要了啊。然后呢,我在TS里边先写上这个接口,暂且这么去理解啊,是一种能力啊,一种约束而已。
01:08
然后呢,这个代码我还是会这么写,放在这个回调函数当中啊,首先呢,我来定义一个接口,就是先给大家去写这么一个东西,让大家去感受一下啊,我们这个函数的调用里边参数还可以怎么去写啊。首先这个名字叫interface,我就写个I person。括号里边我写上一个fair name first name写个字串类型。它代表的是姓氏的意思啊。再来一个last name也是一个字串,那这个就代表的是名字了,之后呢,我写一个函数,这个函数作用是输出什么呢?姓名,那姓名就是由姓氏加名字吧,是吧,啊function,比如说叫for name。括号里边我写上一个person。Return person,点点fire first name再加上。
02:03
下划线再加上点。什么呢?Last name,大家看一下last name这种这个单词,或者说这个属性啊,完全都是我自己这么手写出来的,是不是很容易写错的,那如果说我在这个person的后边再加上一个什么呢?I person我们现在再来看啊,我再去点last name,是不是这个提示就直接就能有吧,再看啊。点last name是不是,那如果说我把它去掉,那我再点first name是不是有这个提示吧。这个就是类型注解它的一个好处啊。所以说大家可以看,当我们在函数当中,参数的后边限定了当前这个参数的类型,我再去写这个代码时候,它会很友好的给我提示出来一些智能的提示,是吧?啊,非常方便。好。注意看啊,那我现在我去,比如说来一个comes person啊,来这么一个对象里边有个first name first first name。
03:00
比如说这个叫做东方。Lastname。这个叫做不败,OK,这是我定义的一个对象。很明显啊,现在如果说我要是调用上面的这个函数。那我应该怎么写收for name a括号,然后我们来看,它会直接告诉我们,哎,你需要给我传入一个person类型的数据,是吧?并且应该符合I person这个接口,I person这个接口里边描述的就什么呢?我有一个姓氏,它应该有一个名字,恰巧我的P里边也有姓氏,也有名字,所以说我完全可以把person放进去。这个时候当我再去找到HTML文件运行起来之后,我们来看一下。东方不外是可以正常显示的是吧,这是没有问题的,上两个我先关掉了,没什么用了啊好,那同学说这有什么用啊是吧,注意看。我如果这个位置啊,这个位置我把first name给它删掉了。
04:01
那大家可以看一下,下边直接会给我报出来这个错误信息啊,啊什么错误信息呢。我们再来仔细看一下,说你当前的这个对象里边只有一个last name。而我的函数的这个参数需要的是什么呢?符合我当前这个接口的规范或者这个约束的,我里边不仅有first name,还应该有last name,你现在只给我提供了一个,抱歉我不认是不是?那好,那我把上面这个打开,下边这个主调可不可以呢?也不可以,是不是啊,当然啊,如果说现在人家需要的是一个对象,里边两个属性都存在,而我现在只有一个,是不是?那我保存能否编译成功呢?这个时候我们再去接口点JS文件里边来看一下person是吧,First name这边应该都是正常的吧,我们来看一下啊刷新。大家可以看一下,还可以正常的去展示出来,东方下游线UN find无非就是没有数据而已吧,就是GS代码是正常的,但TS这边会给了你这个提示是吧,也就说你编译了虽然是成功的,但是这边是没有达到我们的预期。
05:02
然后呢,我现在再把它打开。然后大家可以看一下,这个错误信息就没有了,所以说在TS里边我们写代码的时候,它会实时的对这个静态代码进行分析,会告诉我们我们的语法是否有问题,是吧,人家需要的是一个数据,并且这个数据符合人家这个接口的一个规范,但是你这边如果没提供好,那我就告诉你看。好,刚刚呢,是给大家去演示一下这个接口,它的这个使用啊,好,暂且接口不必研究的那么深,后边咱们会详细的去讲接口是怎么回事,行了这块呢,我们就先到这里。
我来说两句