typescript - 类型中缺少属性 'getReadableSchedule'

Question

如何填充类型化数组，其中填充的类型具有函数 (getReadableSchedule)？如果我删除该功能，则该功能有效。这是因为我分配数组元素的方式而失败吗？

ERROR in src/app/mock-extracts.ts(3,14): error TS2322: Property 'getReadableSchedule' is missing in type '{ id: number; name: string; description: string; client: string; vendor: string; extractType: str...'.

export class Extract {
  id: number;
  name: string;
  description: string;
  client: string;
  vendor: string;
  extractType: string;
  path: string;
  sentDate: string;
  sentTo: string;
  lastRun: string;
  nextRun: string;
  schedule: string;

  getReadableSchedule(): string {
    return "<return readable cronjob schedule>";
  }
}

import { Extract } from "./extract";

export const EXTRACTS: Extract[] = [
  {
    id: 1,
    name: "Find Barb",
    description: "Find Barb in the unspide down.",
    client: "Tower, Inc",
    vendor: "Vendy",
    extractType: "Normal",
    sentDate: "Today",
    path: "//outside",
    sentTo: "",
    lastRun: "",
    nextRun: "",
    schedule: ""
  },
  {
    id: 2,
    name: "Rescue Will",
    description: "Give Will a hair cut.",
    client: "Tower, Inc",
    vendor: "Vendy",
    extractType: "Normal",
    sentDate: "Today",
    path: "//outside",
    sentTo: "",
    lastRun: "",
    nextRun: "",
    schedule: ""
  },
  {
    id: 3,
    name: "Sooth Harry's Scar",
    description: "Put Robitussin on Harry's scar.",
    client: "Tower, Inc",
    vendor: "Turkish Barn, LLC",
    extractType: "Normal",
    sentDate: "Today",
    path: "//outside",
    sentTo: "",
    lastRun: "",
    nextRun: "",
    schedule: ""
  }
];

Answer 1

错误发生是因为数组中包含的对象字面量与Extract 类的精确 类型结构不匹配。

First option:

为了使其仅需少量更改即可工作，将键 getReadableSchedule 添加为每个对象的最后一个属性，并将其指向类原型(prototype)中的方法:

{
    id: 1,
    name: "Find Barb",
    description: "Find Barb in the unspide down.",
    client: "Tower, Inc",
    vendor: "Vendy",
    extractType: "Normal",
    sentDate: "Today",
    path: "//outside",
    sentTo: "",
    lastRun: "",
    nextRun: "",
    schedule: "", 
    getReadableSchedule: Extract.prototype.getReadableSchedule// < -this will point to the same method in the class.
},

Second option:

只需为每个对象创建一个实例，将其分配给一个变量，为其属性分配值，然后将该变量添加到数组中，以这种方式创建的所有对象都已经可以访问该方法，因此不需要其他更改:

const EXTRACTS: Extract[] = [];

let a = new Extract();
a.propA = ...;
a.propB = ...;
.
.
.

EXTRACTS.push(a);

let b = new Extract();
b.propA = ...;
.
.
.
EXTRACTS.push(b);

Third option:

如果不打算使用类作为构造函数，使用接口(interface)可能更有意义。所以，在类之外，声明一个等同于类方法的简单函数...

export function getReadableSchedule(): string { 

    return "<return readable cronjob schedule>";
}

在类内部，移除方法体，只留下签名

getReadableSchedule(): string; 

并将类型声明中的class更改为interface，然后将其导出。

export interface Extract {
    .
    .
    .
}

现在像以前一样将对象文字添加到 EXTRACT 数组，唯一仍然需要更改的是导入 getReadableSchedule 并将其添加到每个对象:

import { Extract, getReadableSchedule } from "./extract";

const EXTRACTS: Extract[] = [
    {
        id: "whatever",
        ...,
        ...,
        ...,
        getReadableSchedule // <- this will point to the imported function
    } //<- and now all the properties are compatible with the type interface
];

TypeScript 类型系统只检查类型的结构。所以类...

class Extract {
    name: string;
    getReadableSchedule() {
        return "Some message";
    }        
}

具有以下类型结构......

{
    name: string;
    getReadableSchedule(): string;
}

要为上述类型的某些变量分配对象字面量，该文字必须具有该类型中存在的所有属性，而没有其他属性。

var fail1: Extract = { name: "1st failure" }; // does not type check - Missing property "getReadableSchedule"
var fail2: Extract = { getReadableSchedule() { return this.name; } }; // does not type check - Missing property "name";
var fail3: Extract = { // does not type check also! 
    name: "3rd failure", // Ok!
    getReadableSchedule() { return this.name } //Ok!
    id: 1 // Error - property "id" does not exist in type Extract
};

var success: Extract = { 
    name: "Success",
    getReadableSchedule() { return "Ok!"}
}; // <- No errors;

// But it is ok to assign a Variable that has all properties existent 
// in the type and additional ones

var notNamedType = {
    name: "Also works",
    getReadableSchedule() { return this.name },
    id: 1 // property does not exist in the Extract type but...
} 

let alsoWorks: Extract = notNamedType; // no casting needed and works as well;