Question

我第一次遇到这个问题，我想是因为这里的承诺和等待。有人知道怎么修这个东西吗？我把发生错误的部分代码，整个类和错误放在底部。

有错误的部分代码：

this.languages = await this.languageService.getAll().toPromise()

    this.languages.forEach(async (language) => {
      this.languageOption = new DropdownOption

      this.languageOption.set (
        language.getName(),
        language.getId()
      )

语言类：

export class Language {
    private id: number;
    private name: string;
    private code: string;
    private charset: string;
    private isDefault: boolean;
    private isActive: boolean;
    private systemId: number;

    public constructor() {
        this.id = null;
        this.name = '';
        this.code = '';
        this.charset = '';
        this.isDefault = false;
        this.isActive = false;
        this.systemId = null;
    }

    public set(
        _id: number,
        _name: string,
        _code: string,
        _charset: string,
        _isDefault: boolean,
        _isActive: boolean,
        _systemId: number
    ) {
        this.id = _id;
        this.name = _name;
        this.code = _code;
        this.charset = _charset;
        this.isDefault = _isDefault;
        this.isActive = _isActive;
        this.systemId = _systemId;
    }

    public getId(): number {
        return this.id;
    }

    public getName(): string {
        return this.name;
    }

    public getCode(): string {
        return this.code;
    }

    public getCharset(): string {
        return this.charset;
    }

    public getIsDefault(): boolean {
        return this.isDefault;
    }

    public getIsActive(): boolean {
        return this.isActive;
    }

    public getSystemId(): number {
        return this.systemId;
    }

    public setId(_id: number): void {
        this.id = _id;
    }

    public setName(_name: string): void {
        this.name = _name;
    }

    public setCode(_code: string): void {
        this.code = _code;
    }

    public setCharset(_charset: string): void {
        this.charset = _charset;
    }

    public setIsDefault(_isDefault: boolean): void {
        this.isDefault = _isDefault;
    }

    public setIsActive(_isActive: boolean): void {
        this.isActive = _isActive;
    }

    public setSystemId(_systemId: number): void {
        this.systemId = _systemId
    }
}

错误：

<块引用>

Uncaught (in promise): TypeError: language.getName is not a function 类型错误：language.getName 不是函数

Answer 1

在 .fixed-header{ position: fixed; top: 0; width: 100%; } .fixed-footer{ position: fixed; bottom: 0; width: 100%; } 中尝试定义每个数组元素的类型。

另外，尝试添加一个 if 条件，以确保不会出错。

像这样：

forEach

如果您在上述实现中遇到错误，则意味着 this.languages.forEach(async (language: Language) => { if (language) { // Write your code here. } }) 未返回 languages 数组。所以你必须映射它，然后使用 Language

Answer 2

问题在于您的服务不返回 Language 类的对象，而是返回与该类具有相同结构的对象。

（该类看起来是由 Java 开发人员创建的，因此我的其余建议将在该假设下）

在 Java 中，对象（通常）是通过调用构造函数来创建的。另一方面，JavaScript 中的对象通常由对象字面量语法 {...} 创建。其结果是，虽然在 Java 中构造函数是一种急需的工具，但在 JavaScript 中，构造函数（甚至类）大多没有用，尤其是在数据传输场景中。

因此，为了拥有惯用的（即好的）TypeScript 代码，我建议完全删除该类，并切换到接口：

export interface Language {
    id: number;
    name: string;
    code: string;
    charset: string;
    isDefault: boolean;
    isActive: boolean;
    systemId: number;
}

现在，与必须正式声明才能使用的 Java 接口不同，TypeScript 接口是结构化的。这意味着具有这些字段的任何对象，就所有意图和目的而言，都是 Language。是的，这意味着我们可以将对象构造为文字并被视为实现接口。（这就是为什么 TypeScript 中的接口通常没有 I 前缀）

另外，不要担心对字段的未封装访问。有些人可能会认为这很疯狂，但我们在 JS 领域很好:)

现在，如果我们假设 languageService.getAll().toPromise() 返回一个 Language 对象数组（同样是接口，而不是类），我们可以像这样编写所需的代码：

this.languages = await this.languageService.getAll().toPromise()

//using for..of, as I hate forEach
for (const language of this.languages) {
  // ....
  this.languageOption.set(
    language.name,
    language.id
  );
  // ...
}

Uncaught (in promise): TypeError: myFunction is not a function

2 个答案: