时间戳

首页 > 解决方案 > 将类型分配给类的打字稿成员的正确方法是什么

typescript - 将类型分配给类的打字稿成员的正确方法是什么

问题描述

这是我的代码

interface IClassMasks {
  arrMasksMultiple: string[];
  arrMasksSingle: string[];
  strMarker: string;
  strMarkerMaskName: string;
}

class ClassMasks implements IClassMasks {
  public arrMasksMultiple;
  public arrMasksSingle;
  public strMarker;
  public strMarkerMaskName;
  constructor() {
    this.arrMasksMultiple = [];
    this.arrMasksSingle = [];
    this.strMarker = null;
    this.strMarkerMaskName = 'strMarkerMask';
  }
}

当我将鼠标悬停在编辑器内的 arrMasksMultiple 上时，它会显示 -

成员“arrMasksMultiple”隐含地具有“任何”类型，但可以从使用中推断出更好的类型

因此，如果成员说 - 'any' 类型，则它不能使用上面的界面。

标签： typescript

解决方案

您仍然需要在类中声明字段的类型；这些类型还必须与您正在实现的接口兼容。默认情况下，类型被隐式假定为any，这与 中定义的类型不兼容IClassMasks。

此外，您不能分配给null，IClassMasks.strMarker因为您没有指定类型也可以是null.

以下是修改后的类型：

interface IClassMasks {
    arrMasksMultiple: string[];
    arrMasksSingle: string[];
    strMarker: string | null;  // indicate that this can also be a null value
    strMarkerMaskName: string;
}

class ClassMasks implements IClassMasks {
    // explicitly declare the types of these fields that are compatible with the IClassMasks interface
    public arrMasksMultiple: string[];
    public arrMasksSingle: string[];
    public strMarker: string | null; // indicate that this can also be a null value
    public strMarkerMaskName: string;
    constructor() {
        this.arrMasksMultiple = [];
        this.arrMasksSingle = [];
        this.strMarker = null;
        this.strMarkerMaskName = 'strMarkerMask';
    }
}

为简洁起见，您还可以分配默认值，而不是在构造函数中分配它们。这是一个示例，其中前 3 个字段具有默认值。

class ClassMasks implements IClassMasks {
    public arrMasksMultiple: string[] = [];
    public arrMasksSingle: string[] = [];
    public strMarker: string | null = null;
    public strMarkerMaskName: string;
    constructor() {
        this.strMarkerMaskName = 'strMarkerMask';
    }
}

推荐阅读