如何在子原型中重寫父原型 function？

Question

我正在學習 JS 中的原型，我在嘗試在我的子原型中重寫我的父原型 function 時遇到了麻煩。

在下面的代碼中，我試圖從我的 class Personn 重寫 function 演示文稿，以便也顯示新的 Etudiant 屬性“etablissement”。

 function Personne(nom, age, sexe){ this.nom = nom; this.age = age; this.sexe = sexe; } Personne.prototype.presentation = function() { return 'Bonjour, je suis ', this.nom + ', ' + this.sexe + ' de ' + this.age + ' ans.'; } function Etudiant(nom, age, sexe, etablissement){ Personne.call(this, [nom, age, sexe]); this.etablissement = etablissement; } Etudiant.prototype = Object.create(Personne.prototype); Etudiant.prototype.constructor = Etudiant; Etudiant.prototype.presentation = function (){ return Personne.prototype.presentation.call(this) + ' Je travaille au ' + this.etablissement + '.'; }; let patrick = new Etudiant('patrick', 26, 'etoile de mer', 'Club'); console.log(patrick.presentation()); // this displays 'patrick,5651,etoile de mer, undefined de undefined ans. Je travaille au Club.'

Answer 1

問題在這里：

Personne.call(this, [nom, age, sexe]);

使用call ，您傳遞離散的 arguments，而不是 arguments 的數組。 將其更改為使用apply ，它確實需要一個數組（或任何類似數組）：

Personne.apply(this, [nom, age, sexe]);

或使 arguments 離散：

Personne.call(this, nom, age, sexe);

現場示例：

 function Personne(nom, age, sexe){ this.nom = nom; this.age = age; this.sexe = sexe; } Personne.prototype.presentation = function() { return 'Bonjour, je suis ', this.nom + ', ' + this.sexe + ' de ' + this.age + ' ans.'; } function Etudiant(nom, age, sexe, etablissement){ Personne.call(this, nom, age, sexe); this.etablissement = etablissement; } Etudiant.prototype = Object.create(Personne.prototype); Etudiant.prototype.constructor = Etudiant; Etudiant.prototype.presentation = function (){ return Personne.prototype.presentation.call(this) + ' Je travaille au ' + this.etablissement + '.'; }; let patrick = new Etudiant('patrick', 26, 'etoile de mer', 'Club'); console.log(patrick.presentation()); // this displays 'patrick,5651,etoile de mer, undefined de undefined ans. Je travaille au Club.'

---

旁注：如果您要使用構造函數和prototype屬性，在現代 JavaScript (ES2015+) 中，您可以使用class語法更輕松地做到這一點：

 class Personne { constructor(nom, age, sexe){ this.nom = nom; this.age = age; this.sexe = sexe; } presentation() { return 'Bonjour, je suis ', this.nom + ', ' + this.sexe + ' de ' + this.age + ' ans.'; } } class Etudiant extends Personne { constructor(nom, age, sexe, etablissement) { super(nom, age, sexe); this.etablissement = etablissement; } presentation() { return super.presentation() + ' Je travaille au ' + this.etablissement + '.'; } } let patrick = new Etudiant('patrick', 26, 'etoile de mer', 'Club'); console.log(patrick.presentation()); // this displays 'patrick,5651,etoile de mer, undefined de undefined ans. Je travaille au Club.'

它有效地創建了相同的東西（有一些細微的區別，主要的區別是構造函數不能被稱為普通函數——你通常不希望它們如此）。 重要的是，它仍然使用原型 inheritance、構造函數和prototype屬性； 語法只是使設置變得更容易，並且更具聲明性。