名前付き引数コードでエラーが発生してしまいます。

Question

Personインスタンスは問題なく作動してくれますが、
Heroインスタンスの方はエラーになってしまいます。
原因が分かりません。
よろしくお願い致します。

var Person = function({name='nameless'}){
  this.name = name;
};

Person.prototype = {
  sayHello(){
    console.log("Hello, " + this.name + "!");
  }
};

var tom = new Person({name: 'Tom'});
console.log(tom.name); // Tom
tom.sayHello(); // Hello Tom!

var Hero = function({name='nameless', level=0, job='disemployment'}){
  this.name  = name;
  this.level = level;
  this.job   = job;
};

Hero.prototype = new Person(); // Uncaught TypeError: (destructured parameter) is undefined

var man = new Hero({name: 'Taro', level: 5, job: 'fighter'});
console.log(man.name);
man.sayHello();
console.log(man.level);
console.log(man.job);

Comments

[int32_t]

どういう意図で「Hero.prototype = new Person();」と書いてますか?
HeroがPersonを継承したいですか?

[taka_oct092018]

int32_t様
はい、その通りです。

Answer 1

var Person = function({name='nameless'}){

このようにコンストラクタを定義したからには、Person()の呼び出しには必ずオブジェクトの引数が必要です。エラーメッセージはそのことに文句を言っています。
JavaScriptには「名前付き引数」という機能はなく、これは「分割代入」なので引数は必要なのです。

ですが、そもそもHero.prototype = new Person(); がおかしいです。「javascript prototype 継承」で検索すると例がいくらでも見つかると思いますが、ここはHero.prototype = Object.create(Person.prototype);とすべきでしょう。

Comments

[taka_oct092018]

int32_t様
アドバイス、ありがとうございます。
ご指摘の通り継承のコードを修正すると問題なく作動してくれました。
「HTML5プロフェッショナル認定試験 レベル2 対策テキスト&問題集」に掲載されていた
コードを少し編集してみました。
「Object.create(Person.prototype);」という構文を初めて知りました。