Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
0
Help us understand the problem. What is going on with this article?
@karin_0624

typescriptのclassで継承元のメソッドを呼ぼうとしたら怒られた時 (typescript error 2340)

More than 1 year has passed since last update.

概要

以下のコードは何が駄目か分かるでしょうか?

export class Hoge {
  public getA = () => 1;
}

export class Huga extends Hoge {
  public getA = () => {

    /*
    * error! 
    * 
    * 'super' キーワードを使用してアクセスできるのは、
    * 基底クラスのパブリック メソッドと保護されたメソッドのみです。ts(2340)
    */
    return super.getA();
  };
}

解決

エラー文だけ見ると「publicなのになんで?」という感じなのですが、ここで大事なのはそこではなく、「本来methodにするべき箇所でpropertyを使ってしまっている」という場所が問題です。

すなわち、以下にすると解決します。

export class Hoge {
  public getA() {
    return 1;
  }
}

export class Huga extends Hoge {
  public getA() {
    return super.getA();
  }
}

typescriptやjavascriptで書いていると、特にarrow functionのせいで変数でも関数でも差が無いように思い込みがちですが、classにおいてのpropertyとmethodは全く別物です。

細かい差異はいくつか他にもあるのですが、上記のように継承元の「method」を呼ぶことはできても「property」を呼ぶことはできないので注意しましょう。

0
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
karin_0624
react/java/node.js/c#, azure/aws, ...etc

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
0
Help us understand the problem. What is going on with this article?