Angular 6 - 示例中的错误属性instanceof

Question

我从 Angular 示例中获取了这段代码

import { Component, OnInit } from '@angular/core';
import { Hero } from '../hero';

@Component({
  selector: 'app-heroes',
  templateUrl: './heroes.component.html',
  styleUrls: ['./heroes.component.css']
})
export class HeroesComponent implements OnInit {
  hero: Hero = {
    id: 1,
    name: 'Windstorm'
  };

  constructor() { 
    console.log(this.hero instanceof Hero);
    console.log(this.hero instanceof Object);

    const otherHero = new Hero();
    console.log(otherHero);
  }

  ngOnInit() {
  }

}

控制台输出为:

false
true
true

如果属性 Hero 被定义为 Hero 类型，那么为什么 instanceof 给我 false ？ 如果设置值后该属性不是 Hero 类型而是普通 Object 类型，那么将该属性声明为 Hero 类型有什么意义

Answer 1

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

在上面的代码中，您仅将英雄属性的类型声明为Hero，但您正在分配一个对象文字。应该是hero: Hero = new Hero()，那么只有this.hero instanceOf Hero属性会返回true。

说明:

JavaScript 是一种基于原型(prototype)的语言。所有其他类(包括 String、Array)的基类是 Object。因此，在您的情况下，您正在使用对象文字 {} 创建一个对象。 Typescript 不会显示任何错误，因为 Hero 类也从 Object 扩展。