Maison > interface Web > js tutoriel > le corps du texte

Comment implémenter l'héritage multiple en JavaScript

亚连
Libérer: 2018-06-12 17:48:08
original
3260 Les gens l'ont consulté

Cet article présente principalement la méthode d'implémentation de l'héritage multiple en JavaScript et analyse en détail les étapes spécifiques et les techniques de fonctionnement associées à l'implémentation de l'héritage multiple en JavaScript sous forme d'exemples. Les amis dans le besoin peuvent s'y référer

<.>Les exemples de cet article décrivent comment implémenter l'héritage multiple en JavaScript. Partagez-le avec tout le monde pour référence, comme suit :

1. Définissez un constructeur de classe parent vide, puis définissez les attributs et les méthodes pour la classe parent via un prototype

2. constructeur de la sous-classe, lie ensuite le prototype de la sous-classe à l'instance de la classe parent, puis lie la classe parent du prototype de la sous-classe à l'instance de la classe parent. Définissez vos propres propriétés et méthodes pour les sous-classes via le prototype.

3. Définissez un constructeur de classe petit-fils vide, puis liez le prototype de classe petit-fils à l'instance de sous-classe, puis liez la classe parent du prototype de classe petit-fils à l'instance de sous-classe. Définissez vos propres propriétés et méthodes pour la classe petit-enfant via un prototype.

4. Instanciez un objet petit-enfant. En appelant l'objet instance, appelez sa propre méthode. Vous pouvez également appeler la méthode de la classe parent du petit-enfant, c'est-à-dire la sous-classe de cet article, ou vous pouvez appeler directement. la plus grande classe parent, c'est-à-dire que les méthodes de la classe parent ici peuvent également ajouter des propriétés et des méthodes à l'objet actuel.

function Person(){}
Person.prototype.name = "人";// 为人类创建一个name属性
Person.prototype.say = function(content){// 为人类创建一个说话的方法
  if(!this.name){ // 如果对象不存在name属性,则使用原型链的name
    this.name = this.__proto__.name;
  }
  console.log("我是" + this.name + ",我想说"+content);
};
function Parent(){}
Parent.prototype = new Person();  // 设置Parent类继承Person类
Parent.prototype.superClass = new Person();// 设置superClass保存父类Person的方法属性
Parent.prototype.name = "父辈类";// 设置Parent类的name属性
Parent.prototype.say = function(){// 设置Parent类自己的 say 方法
  console.log("我是Parent类的say方法!");
};
function Child(){}
Child.prototype = new Parent();// 设置Child类继承Parent类
Child.prototype.superClass = new Parent();// 设置superClass保存父类Parent的方法属性
Child.prototype.say = function(){  //设置Child类自己的say方法
  console.log("我是Child类的say方法!");
}
var c = new Child();// 实例化一个Child对象
c.say();  // 调用自身原型的say方法,输出:我是Child类的say方法!
c.superClass.say(); // 调用父类Parent的say方法,输出: 我是Parent类的say方法!
c.superClass.superClass.say("哈哈");// 直接调用最大的父类Person的say方法(方法中的this指向Person),输出:我是人,我想说哈哈"
// 用call调用最大的父类Person的say方法(方法中的this指向实例化对象c,但此时c并没有name属性,所以this.name用的是Parent的name)
c.superClass.superClass.say.call(c,"嘻嘻"); // 输出:我是父辈类,我想说嘻嘻
c.name = "子类实例";// 给当前对象增加name属性
// 还是用call调用最大父类Person的say方法(此时c对象中已经有name属性);
c.superClass.superClass.say.call(c,"我是子类的实例化对象"); // 输出:我是子类实例,我想说我是子类的实例化对象
Copier après la connexion
J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.

Articles associés :

Comment utiliser eventBus dans vue pour réaliser une communication entre des composants de même niveau

Comment implémenter le téléchargement dans node.js Picture

Exemples d'implémentation de la lecture hls à l'aide des technologies vue2.0+vue-dplayer

passés dans vue2.0 + element UI el-table Comment exporter des données vers Excel

Explication détaillée du code source FastClick (tutoriel détaillé)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal