Javascriptでクラス名を取得する方法。this.constructor.name

記事内に広告が含まれています。

Javascript で自分自身のクラス名を取得するのに一番簡単な方法は constructor のname 属性を参照する方法です。

Javascriptでクラス名を取得する方法。

Javascriptでクラス名を取得するにはconstructor のname 属性を参照すると簡単に当該のクラス名が取得できます。

<html>
  <head>
    <script>
      class BaseClass{
        constructor(){
          console.log( "BaseClass constructor  My Name is " + this.constructor.name ) ;
        }
      }
      var base_class = new BaseClass() ;
    </script>
  </head>
  <body>
  </body>
</html>

実行結果は

BaseClass constructor  My Name is BaseClass

になり、クラス名が取得出来ています。

継承したらどうなるか?

ここで、上記のソースで BaseClass クラスを継承した ChildClass を作成したらどうなるかをみてみます。

<html>
  <head>
    <script>
      class BaseClass{
        constructor(){
          console.log( "BaseClass constructor  My Name is " + this.constructor.name ) ;
        }
      }
      class ChildClass extends BaseClass{
        constructor(){
          super() ;
          console.log( "ChildClass constructor  My Name is " + this.constructor.name ) ;
        }
      }
      var base_class = new BaseClass() ;
      var child_class = new ChildClass() ;
    </script>
  </head>
  <body>
  </body>
</html>

今度は

BaseClass constructor  My Name is BaseClass
BaseClass constructor  My Name is ChildClass
ChildClass constructor  My Name is ChildClass

となり、継承する前のクラス(BaseClass)を直接 new した場合の名前は BaseClass になりますが、継承したクラス(ChildClass)の名前は両方とも ChildClass になります。

タイトルとURLをコピーしました