何时在 Angular2 打字稿中创建构造函数？

Posted 2023-03-13

【中文标题】何时在 Angular2 打字稿中创建构造函数？

【英文标题】：When to create constructor in Angular2 typescript?

【发布时间】：2016-09-14 14:26:05

【问题描述】：

以下是来自Angular 2 docs 的一些示例构造函数：

export class AppComponent implements OnInit 
    title = 'Tour of heroes';
    heroes: Hero[];
    selectedHero: Hero;

    constructor(private heroService: HeroService)  

    getHeroes() 
        this.HeroService.getHeroes().then(heroes => this.heroes = heroes);
    

还有……

class Car 
    constructor(engine, tires, doors)
        this.engine = engine;
        this.tires = tires;
        this.doors = doors;
    

我不明白为什么以及何时在 angular 2 /typescript 中创建 constructor()（我已阅读官方文档，其中他们为依赖注入和服务创建了构造函数）。

【问题讨论】：

+1。我很难知道构造函数中应该包含什么（除了“尽可能少”）以及不应该包含什么。我想这是一个更广泛的编程概念，但我的阅读并没有产生任何特别清楚的东西，它以简单的方式描述了构造函数及其用途。

嗨 Sarvesh，如果您将代码作为文本插入，对其他人可能会更好。

@J.Chomel 我觉得现在更好了:)

我已经编辑了帖子以使其更清晰，并使用代码而不是图像作为示例。

【参考方案1】：

构造函数定义实例化对象时要提供的参数。在 TypeScript 中，您还可以添加 private 或 public 等修饰符来同时定义类属性并使用提供的属性设置它们的值。

例如：

class Car 
  constructor(private engine:string, private tires:string, private doors:number)
  

类似于：

class Car 
  constructor(engine:string, tires:string, doors:number)
    this.engine = engine;
    this.tires = tires;
    this.doors = doors;
  

在 Angular2 中，构造函数用于依赖注入。关联的装饰器（@Component 或 Injectable）收集元数据（@Inject 中的类型或提示）以确定提供给对象以实例化的内容。

请注意，构造函数不是组件生命周期的一部分。 Angular2 稍后可以在此级别设置属性...

【讨论】：

请参阅 TypeScript 操场上的 this example 以获取您可以使用的示例。

【参考方案2】：

控制器构造函数主要用于您提到的依赖注入/服务，并且（在我的应用程序中）还用于根据服务本身初始化复杂的默认值。由于构造函数在控制器模板初始化之前运行 - 不会准确呈现任何变量，因此需要 ngOnInit 和其他类似方法。这些“引导”方法应该用于执行正常的“构建”职责，以便模板/视图可以访问数据。

关于服务构造函数，我的一些人通常使用构造函数并根据现有用户数据初始化服务的各个部分，因为它们的行为更像标准类。

这些答案会有所帮助：

Difference between Constructor and ngOnInit Angular 2 Component Constructor Vs OnInit