Eine ausführliche Einführung in den Polymorphismus in JavaScript

Hallo Freunde, heute werden wir über die Vererbung sprechen, die aufgrund der Flexibilität der JavaScript-Sprache nicht vorhanden ist Art und Weise, die Schnittstelle zu verwenden, führt daher auch zu Verwirrung im js-Programm. Sie müssen sich über dieses Problem keine allzu großen Sorgen machen, da die späteren Versionen von ECMAScript diese Probleme für uns lösen werden. Zurück zum Thema OOP-Polymorphismus: Wir können bereits klar verstehen, wie Vererbung aussieht. Das heißt, wir deklarieren zuerst eine übergeordnete Klasse und können dann viele Unterklassen schreiben, um die Attribute und Methoden der übergeordneten Klasse zu erben Menge an Code, um die gleichen Funktionen wie die übergeordnete Klasse zu erreichen. Dies ist Vererbung. Ein Klassenkamerad stellte sofort eine Frage: Ich habe die vorherige Vererbung schon lange gelesen und kann sie verstehen, aber ich weiß nicht, wozu sie dient. Warum müssen wir so viele Vererbungsklassen schreiben? Diese Frage trifft sofort ins Schwarze und ist ziemlich kritisch. Ohne die Existenz von Polymorphismus ist die zuvor erwähnte Vererbung wirklich nutzlos, da alle unsere geerbten Klassen identische Kopien sind und keine Merkmale aufweisen. Zum Beispiel:

Polymorphismus bedeutet wörtlich „mehrere Zustände“. Das gleiche Verhalten (Methode) hat unterschiedliche Zustände bei verschiedenen Objekten.
Polymorphe Funktionen werden an vielen Stellen in OOP verwendet. Wenn Sie beispielsweise mit der rechten Maustaste klicken, auf eine Verknüpfung klicken, auf eine leere Stelle auf dem Desktop klicken, auf das Popup klicken usw Menüs sind unterschiedlich.

Methodenüberschreibung:

Das heißt, die Unterklasse definiert eine Methode mit demselben Namen wie die übergeordnete Klasse, um die Methode der übergeordneten Klasse zu überschreiben und unterschiedliche Funktionen zu erreichen.

 1     function Animal(){} 2     var AnimalP = Animal.prototype; 3     AnimalP.eat = function(food){ 4         console.log('这个动物正在吃' + food); 5     }; 6  7     function Snake(){} 8     var SnakeP = extend(Snake,Animal);//extend函数请看上一节 9     /*snake没有对eat方法重写，继承的父类eat()方法*/10     function Dog(){}11     var DogP = extend(Dog,Animal);12     DogP.eat = function(food){13         /*对eat()方法重写*/14         /*上一章讲过，也可以在这里通过 Animal.eat.call(this,food)调用父方法；*/15         console.log("这只狗正在吃"+food);16     };17 18     function Cat(){}19     var CatP = extend(Cat,Animal);20     CatP.eat = function(food){21         console.log("这只猫正在吃"+food);22     };23     var snake = new Snake();24     snake.eat('老鼠');//log:这个动物正在吃老鼠25     var dog = new Dog();26     dog.eat('骨头');//log:这只狗正在吃骨头27     var cat = new Cat();28     cat.eat('鱼');//log:这只猫正在吃鱼

Abstrakte Klasse:

Im obigen Code implementiert die Snake-Klasse keine eigene eat()-Methode, aber manchmal hoffen wir, dass die Unterklasse vorhanden sein muss Eine bestimmte Methode (abstrakte Methode), die das Verhalten der Unterklasse standardisieren kann.
Weder ES5 noch ES6 haben das Konzept abstrakter Klassen, daher können wir nur Simulationen verwenden Fahren Sie mit dem obigen Code fort. Wenn wir die eat()-Methode von Animal als abstrakte Methode definieren möchten:

1     AnimalP.eat = function(food){2         /*定义抽象方法（虚函数），如果子类没有重写这个方法，在执行这方法的时候就会抛出错误*/3         throw '"' + this.constructor.name + "'类没有eat()方法";4     };5     function Snake(){}6     var SnakeP = extend(Snake,Animal);7     var snake = new Snake();8     snake.eat('老鼠');//throw:"Snake'类没有eat()方法

Methodenüberladung (Überladung):

Wir müssen eine solche Funktion geschrieben haben. Abhängig von den übergebenen Parametern (Typ, Anzahl der Parameter) sind auch die Ausführungsergebnisse der Methode unterschiedlich:

1 var run = function(speed){2         if(typeof speed == 'number'){3             console.log('跑的速度有' + speed + 'm/s');4         }else if(typeof speed == 'string'){5             console.log('跑的速度有' + speed);6         }7     }8     run(15);//log:跑的速度有15m/s9     run('20KM/h');//log:跑的速度有20KM/h

Aber es ist offensichtlich schwierig, den oben geschriebenen Code zu pflegen. Sie können die run-Methode als Schnittstelle verwenden, um je nach Art der Parameter verschiedene Methoden auszuführen:

 1     function Dog(){} 2     var DogP = Dog.prototype; 3     DogP.run = function(speed){ 4         if(typeof speed == 'number'){ 5             this._runNumber(speed); 6         }else if(typeof speed == 'string'){ 7             this._runString(speed); 8         }else{ 9             throw '参数不匹配';10         }11     }12     DogP._runString = function(speed){13         console.log('这只狗跑的速度有' + speed);14     }15     DogP._runNumber = function(speed){16         console.log('这只狗跑的速度有' + speed + 'm/s');17     }18     var dog = new Dog();19     dog.run(15);//log:这只狗跑的速度有15m/s20     dog.run('20KM/h');//log:这只狗跑的速度有20KM/h21     dog.run([]);//throw:参数不匹配

Dies ist die Simulation einer Methodenüberladung, aber tatsächlich unterstützen ES5, ES6 und Typescipt keine grammatikalische Methodenüberladung, und Typescipt unterstützt nur eine Funktionsüberladung.
Dies ist eine weitere Implementierung des Polymorphismus.

Demo von ES6:

 1     class Animal{ 2         eat(food){ 3             throw '"' + this.constructor.name + "'类没有eat()方法"; 4         } 5     } 6     class Snake extends Animal{} 7     class Dog extends Animal{ 8         eat(food){ 9             console.log("这只狗正在吃"+food);10         }11     }12     class Cat extends Animal{13         eat(food){14             console.log("这只猫正在吃"+food);15         }16     }17     let snake = new Snake();18     snake.eat('老鼠');//throw:"Snake'类没有eat()方法19     let dog = new Dog();20     dog.eat('骨头');//log:这只狗正在吃骨头21     let cat = new Cat();22     cat.eat('鱼');//log:这只猫正在吃鱼

Demo von TypeScript:

 1 abstract class Animal{//定义抽象类Animal 2     constructor(){} 3     abstract eat(food: string){} 4     /*定义抽象方法eat(),并且限定传入的参数类型是string， 5     还可以定义返回值，接口等，如果子类不符合限定的规范，编译的时候就会报错。 6     */ 7 } 8 class Snake extends Animal{}//报错，无法通过编译，因为没有定义eat()抽象方法 9 class Dog extends Animal{10     eat(food: string){11         console.log("这只狗正在吃"+food);12     }13 }14 class Cat extends Animal{15     eat(food: string){16         console.log("这只猫正在吃"+food);17     }18 }19 let dog = new Dog();20 dog.eat('骨头');//log:这只狗正在吃骨头21 let cat = new Cat();22 cat.eat('鱼');//log:这只猫正在吃鱼

Nachwort

Wenn Ihnen der Artikel des Autors gefällt, denken Sie daran, ihn mit einem Lesezeichen zu versehen.

Die wichtigsten Wissenspunkte von objektorientiert sind Hier habe ich mit dem Reden fertig. Das, worüber ich gesprochen habe, ist definitiv nicht perfekt. Es wird nur empfohlen, dass Sie das Buch lesen und js OOP lernen systematisch;

Das obige ist der detaillierte Inhalt vonEine ausführliche Einführung in den Polymorphismus in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!