错误:无法调用类型缺少调用签名的表达式

Question

我是打字稿的新手,我有两个班.在父类我有:

abstract class Component {
  public deps: any = {};
  public props: any = {};

  public setProp(prop: string): any {
    return <T>(val: T): T => {
      this.props[prop] = val;
      return val;
    };
  }
}

在孩子班我有:

class Post extends Component {
  public toggleBody: string;

  constructor() {
    this.toggleBody = this.setProp('showFullBody');
  }

  public showMore(): boolean {
    return this.toggleBody(true);
  }

  public showLess(): boolean {
    return this.toggleBody(false);
  }
}

showMore和ShowLess都给出了错误,"无法调用类型缺少调用签名的表达式".

但是,我认为setProp返回DOES的函数有一个调用签名？我想我误解了关于函数类型的重要事情,但我不知道它是什么.

谢谢!

Answer 1

它返回的函数有一个调用签名,但是你告诉Typescript通过添加: any它的签名来完全忽略它.

不要那样做.

Answer 2

"无法调用类型缺少调用签名的表达式."

在你的代码中:

class Post extends Component {
  public toggleBody: string;

  constructor() {
    this.toggleBody = this.setProp('showFullBody');
  }

  public showMore(): boolean {
    return this.toggleBody(true);
  }

  public showLess(): boolean {
    return this.toggleBody(false);
  }
}

你有public toggleBody: string;.你不能称之为string功能.因此错误:this.toggleBody(true);和this.toggleBody(false);

Answer 3

让我们分解一下：

1. 错误说

   无法调用类型缺少调用签名的表达式。

2. 代码：

问题是，在这条线public toggleBody: string;＆

与这些行的关系：

...
return this.toggleBody(true);
...
return this.toggleBody(false);

3. 结果：

您的说法toggleBody是“ a”，string但随后您将其call signature视为具有“ a ”的事物（即可以称为的结构：lambda，proc，函数，方法等。在JS中，仅函数tho。）。您需要将声明更改为public toggleBody: (arg: boolean) => boolean;。

额外详情：

“调用”是指您调用或应用功能。

Javascript中的“表达式”基本上是产生值的东西，因此this.toggleBody()算作表达式。

在此行上声明“类型” public toggleBody: string

“缺少调用签名”是因为您试图调用this.toggleBody()没有签名的东西（即可以调用的东西的结构：lambda，proc，函数，方法等）。你说的this.toggleBody是像字符串一样的东西。

换句话说，错误是在说

无法调用表达式（this.toggleBody），因为它的类型（：string）缺少调用签名（bc具有字符串签名）。

Answer 4

这意味着您正在尝试调用不是函数的东西

const foo = 'string'
foo() // error

Answer 5

我想你想要的是:

abstract class Component {
  public deps: any = {};
  public props: any = {};

  public makePropSetter<T>(prop: string): (val: T) => T {
    return function(val) {
      this.props[prop] = val
      return val
    }
  }
}

class Post extends Component {
  public toggleBody: (val: boolean) => boolean;

  constructor () {
    super()
    this.toggleBody = this.makePropSetter<boolean>('showFullBody')
  }

  showMore (): boolean {
    return this.toggleBody(true)
  }

  showLess (): boolean {
    return this.toggleBody(false)
  }
}

重要的变化是setProp(即makePropSetter在新的代码中).你真正在做什么就是说:这是一个提供了属性名称的函数,它将返回一个允许你改变那个属性的函数.

将<T>在makePropSetter允许您锁定功能的特定类型.将<boolean>在子类的构造函数实际上是可选的.由于您正在分配toggleBody,并且已经完全指定了类型,因此TS编译器将能够自行完成它.

然后,在您的子类中,您调用该函数,并且返回类型现在被正确理解为具有特定签名的函数.当然,您需要toggleBody尊重相同的签名.