Heim > Web-Frontend > js-Tutorial > ES5-Beispiele beschreiben detailliert die verschiedenen Vererbungsmethoden von JavaScript

ES5-Beispiele beschreiben detailliert die verschiedenen Vererbungsmethoden von JavaScript

小云云
Freigeben: 2018-02-03 14:31:07
Original
1591 Leute haben es durchsucht

Als leichte Skriptsprache wurde JavaScript nach dem Aufkommen von ES6 und node.js auf ein neues Niveau gebracht. Obwohl das neue Klassensyntaxformat zum Generieren von Objekten in ES6 erschien, ist es immer noch ES5-Syntaxzucker, aber wir brauchen es immer noch Beginnen Sie mit der nativen Implementierung von JavaScript, um die Vererbungsimplementierung zu verstehen. ES6 bietet eine prägnantere Methode zur Deklaration fester Klassen.

Verschiedene Entwickler haben unterschiedliche Auffassungen von der JavaScript-Vererbung.

 - 原型链继承
 - 对象冒充继承(构造函数继承 不过我不喜欢这个名字)
 - 组合继承
 - 寄生组合继承
Nach dem Login kopieren

Für die Vererbung können Sie im Voraus ein Tier deklarieren und es dann besprechen unterschiedliche Vererbungsmethode.
    let Animal = (function () {
      function Animal (name) {
        this.name = name || 'Animal';
        this.sleep = function(){
          console.log(this.name + '正在睡觉!');
        }
      }
      Animal.prototype.eat = function(food) {
        console.log(this.name + '正在吃:' + food);
      }
      return Animal;
    })()
Nach dem Login kopieren
  1. Prototyp-Kettenvererbung

        let Cat = (function () {
          function Cat(){ 
          }
          Cat.prototype = new Animal();
          Cat.prototype.name = 'cat';
          return Cat;
        })()
    Nach dem Login kopieren
    原型链是 javascript 的典型继承方式, 这种继承方式的最大特点就是共享,所有事例共享原型对象中的所有属性和方法, 共享是它的最大优点 也是它的最大缺点, 正对我们的不同需求, 比如大多数情况下我们常常需要某些属性是子类特有的  而一些读取属性方法需要共享,--另外此种继承无法向父类传参,无法实现多继承
    Nach dem Login kopieren
  2. Objekt, das vorgibt, Vererbung zu sein

        let Cat = (function () {
          function Cat(name){
            Animal.call(this,name);
          }
          return Cat;
        })()
    Nach dem Login kopieren
    对象冒充继承就是简单的利用call或者apply方法实现继承,这种继承最大的特点正好与原型链继承相反不能继承原型属性/方法--非共享(子类自有一份), 同样这是它的优点也是它的缺点, 另外它解决了原型链继承中无法向父类传参的缺点, 并且可以实现某种意义上的多继承--(注意这种多继承是打引号的)
    Nach dem Login kopieren
  3. Kombinationsvererbung

        let Cat = (function () {
          function Cat(name){
            Animal.call(this, name);
          }
          Cat.prototype = new Animal();
          Cat.prototype.constructor = Cat;
          return Cat;
        })()
    Nach dem Login kopieren
    组合继承是比较好的继承, 他是原型链继承和对象冒充继承的合体, 合理的利用了这两种组合的特点(是特点不是优点^_^),既是子类的实例,也是父类的实例, 但有一个缺点就是调用了两次父类构造函数,生成了两份实例(子类实例将子类原型上的那份屏蔽了)造成内存浪费. 这也是用的最多的一种
    Nach dem Login kopieren
  4. parasitäre Kombinationsvererbung

        let Cat = (function () {
          function Cat(name){
            Animal.call(this, name);
          }
          (function(sub, sup){
            var Super = function(){};
            Super.prototype = sup.prototype;
            sub.prototype = new Super();
            sub.prototype.constructor = sub
          })(Cat, Animal)
          return Cat;
        })()
    Nach dem Login kopieren
Parasitismus Kombinationsvererbung ist eine Sublimation der Kombinationsvererbung. Ich persönlich denke, dass es eine perfekte Vererbungsmethode ist. Sie verbessert das Speicherverschwendungsproblem der Kombinationsvererbung ^_^

Verwandte Empfehlungen:

Warum müssen Sie Javascript verwenden, um die Vererbung zu implementieren? Detaillierte Erläuterung mehrerer Vererbungsmethoden mit Beispielen

Detaillierte Erläuterung der Verwendung und Nachteile der Vererbungsmethode der JavaScript-Prototypkette

Drei Vererbungsmethoden und ihre Vorteile und Nachteile in js

Das obige ist der detaillierte Inhalt vonES5-Beispiele beschreiben detailliert die verschiedenen Vererbungsmethoden von JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage