Heim > Web-Frontend > js-Tutorial > Hauptteil

Eine einfache Einführung in den Polymorphismus

零下一度
Freigeben: 2017-07-03 14:18:09
Original
1079 Leute haben es durchsucht

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 die Taskleiste klicken usw., erscheint das Popup Die Menüs werden unterschiedlich sein.

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:这只猫正在吃鱼
Nach dem Login kopieren

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()方法
Nach dem Login kopieren

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
Nach dem Login kopieren

Es ist jedoch offensichtlich, dass der oben geschriebene Code schwierig zu warten ist. Sie können die Ausführungsmethode als Schnittstelle verwenden, um je nach Parametertyp 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:参数不匹配
Nach dem Login kopieren

Dies ist die Simulation der Methodenüberladung, aber tatsächlich unterstützen ES5, ES6 und Typescipt keine grammatikalische Methodenüberladung und Typescipt unterstützt nur 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:这只猫正在吃鱼
Nach dem Login kopieren

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:这只猫正在吃鱼
Nach dem Login kopieren

Nachwort

Wenn Ihnen der Artikel des Autors gefällt, denken Sie daran, ihn mit einem Lesezeichen zu versehen. Ihre „Gefällt mir“-Angaben sind die größte Ermutigung für den Autor.

Objektorientiert Die wichtigsten Wissenspunkte sind hier abgeschlossen. Was ich gesagt habe, ist definitiv nicht perfekt. Es wird nur empfohlen, dass Sie, wenn Sie Zeit haben, systematisch Bücher lesen und lernen js OOP;

Diese Serie enthält das letzte Kapitel, in dem die in den vorherigen Kapiteln erwähnten Wissenspunkte anhand eines Falles integriert werden, damit jeder sie besser verdauen und verarbeiten kann.

Wenn Sie Fragen haben, können Sie dem Autor eine Nachricht hinterlassen oder eine private Nachricht senden. Der Autor wird sein Bestes geben, um allen so schnell wie möglich zu antworten 🎜> Wenn erfahrene Fahrer das Gefühl haben, dass etwas unangemessen ist oder besser ausgedrückt werden kann, können Sie es gerne darauf hinweisen und ich werde es so schnell wie möglich korrigieren.

Das obige ist der detaillierte Inhalt vonEine einfache Einführung in den Polymorphismus. 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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!