web-dev-qa-db-ja.com

ここで予想外のスーパーキーワード

ES6の省略イニシャライザによると、次の2つの方法は同じです。

ES5内

var person = {
  name: "Person",
  greet: function() {
     return "Hello " + this.name;
  }
};

ES6内

var person = {
  name: "Person",
  greet() {
     return "Hello " + this.name;
  }
};

ES6の方法は以前の方法とはどう違うのですか？そうでない場合は、それらの中で「スーパー」を使用することも等しいものとして扱う必要があります。これは当てはまりません。以下の2つのバリエーションを参照してください。

以下の作品

let person = {
  greet(){
   super.greet(); 
  }
};

Object.setPrototypeOf(person, {
  greet: function(){ console.log("Prototype method"); }
});

person.greet();

以下が失敗する

let person = {
  greet: function(){
   super.greet(); // Throw error: Uncaught SyntaxError: 'super' keyword unexpected here
  }
};

Object.setPrototypeOf(person, {
  greet: function(){ console.log("Prototype method"); }
});

person.greet();

上記の2つの例の唯一の違いは、personオブジェクトでメソッドgreetを宣言する方法です。これは同じでなければなりません。では、なぜエラーが発生するのでしょうか。

ecmascript-6super
14
Ratnesh Lal

では、なぜエラーが発生するのでしょうか。

superは methods 内でのみ有効であるためです。 greet: function() {}は、メソッド構文ではないため、メソッドではなく「通常の」プロパティ/関数です。

メソッドと通常の関数定義の違いは次のとおりです。

  • メソッドには「HomeObject」があり、superを使用できます。
  • メソッドは構築可能ではありません。つまり、newで呼び出すことはできません。
  • メソッドの名前は、メソッドのスコープでのバインディングにはなりません（名前付き関数式とは異なります）。
24
Felix Kling