super keyword unexpected here

Question

According to ES6 shorthand initialiser, following 2 methods are same:

In ES5

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

In ES6

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

Do the ES6 way is in anyway different from the previous way? If not then using "super" inside them should be also treated as equal, which doesn't hold true, please see below two variaiton:

Below works

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

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

person.greet();

Below fails

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();

---

The only difference in above 2 examples is the way we declare method greet in person object, which should be same. So, why do we get error?

Answer 1

So, why do we get error?

Because super is only valid inside methods. greet: function() {} is a "normal" property/function, not a method, because it doesn't follow the method syntax.

The differences between a method and a normal function definition are:

• Methods have a "HomeObject" which is what allows them to use super.
• Methods are not constructable, i.e. they cannot be called with new.
• The name of a method doesn't become a binding in the method's scope (unlike named function expressions).