typeScript 变量名 冒号 类名 <–这种写法什么意思?

8 篇文章 1 订阅
export class AppComponent {
  title = 'Tour of heroes';
  hero: Hero = {
    id: 1,
    name: '张三'
  };
}

export class Hero {
  id: number;
  name: string;
}

就是这一段,看起来有点晕,这里是实例化一个Hero类型的对象hero,还是创建一个变量?后面是赋值,但是不知道什么意思?

hero: Hero = {
    id: 1,
    name: '张三'
  };

回答:

手动指定 变量的类型,这个是给typescript编译器用的,用来限制变量类型。
一般来说,能够直接被推导的变量不用指明类型。
比如
let a = 1; // a肯定是number
let b = ‘x’; // b肯定是string

class A {}
let c = new A(); // c肯定是A或者A的子类

回答:

对于 class 就相当于一个类型,所以一个存在的类型对于 ts 在编译过程中能否正确的类型推导,这一点没有毛病。

那么当一个 class 存在时,其本质会生成类似以下代码:

var Hero = (function() {
    function Hero() {}
    // more
})();

因此,一个类需要被明确实例才能算构建实例,比如:

let hero = new Hero();

如果说你没打算或需要去实例一个对象时,那么用 interface 更合理;因为主要目的就是为了能正确的类型推导

export interface Hero {
  id: number;
  name: string;
}

这样能保证 ts 正确的类型推导,还不会生成一段 class 所带来的额外无意义的代码,如果你不需要实例的情况下。

Happy coding!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值