未捕获(在promise中):TypeError:myFunction不是函数

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
}
}

错误：

未捕获(在promise中(：TypeError：language.getName不是函数TypeError:language.getName不是函数

Answer 1

在forEach中，尝试定义每个数组元素的类型。

另外，试着添加一个if条件，只是为了确保不会出错。

类似这样的东西：

this.languages.forEach(async (language: Language) => {
if (language) {
// Write your code here. 
}
})

如果在上面的实现中出现错误，则意味着languages没有返回Language的数组。所以你必须映射它，然后使用forEach

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
);
// ...
}