Une introduction détaillée au polymorphisme en JavaScript

Bonjour les amis, aujourd'hui nous allons continuer le contenu précédent. Nous avons déjà parlé d'héritage. Aujourd'hui, nous allons parler de la dernière manifestation de la POO, qui est le polymorphisme. En raison de la flexibilité du langage JavaScript, nous n'en avons pas. façon d'utiliser l'interface, cela apporte également une certaine confusion au programme js. Vous n'avez pas besoin de trop vous inquiéter de ce problème, car ces versions ultérieures d'ECMAScript résoudront ces problèmes pour nous. Je vais encore trop loin. .Revenant au sujet du polymorphisme POO, nous pouvons déjà clairement comprendre à quoi ressemble l'héritage, c'est-à-dire déclarer d'abord une classe parent, puis écrire de nombreuses sous-classes pour hériter des attributs et des méthodes de la classe parent. même fonction que la classe parent avec le moins de code. Il s'agit d'un héritage. Immédiatement, un camarade de classe a posé une question : j'ai lu l'héritage précédent depuis longtemps et je peux le comprendre, mais je ne sais pas à quoi il sert. Pourquoi devons-nous écrire autant de classes d'héritage ? Cette question fait immédiatement mouche et est assez critique. Sans l’existence du polymorphisme, l’héritage que nous évoquions plus haut est vraiment inutile, car toutes nos classes héritées sont des copies identiques et n’ont aucune caractéristique. Par exemple :

Polymorphisme signifie littéralement « états multiples ». Le même comportement (méthode) a différents états sur différents objets.
Les fonctionnalités polymorphes sont utilisées à de nombreux endroits dans la POO. Par exemple, si vous cliquez sur le bouton droit de la souris, cliquez sur un raccourci, cliquez sur un espace vide du bureau, cliquez sur la barre des tâches, etc., la fenêtre contextuelle apparaît. les menus seront différents.

Remplacement de méthode :

Autrement dit, la sous-classe définit une méthode avec le même nom que la classe parent pour remplacer la méthode de la classe parent afin d'obtenir différentes fonctions.

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

Classe abstraite :

Dans le code ci-dessus, la classe Snake n'implémente pas sa propre méthode eat(), mais parfois nous espérons que la sous-classe doit avoir une certaine méthode (méthode abstraite), qui peut standardiser le comportement de la sous-classe. À l'heure actuelle, les classes abstraites sont utilisées
Ni ES5 ni ES6 n'ont le concept de classes abstraites, nous ne pouvons donc utiliser que la simulation. continuez avec le code ci-dessus Si nous voulons définir la méthode eat() d'Animal comme une méthode abstraite :

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()方法

surcharge de méthode ( surcharge) :

Nous avons dû écrire une telle fonction. Selon les paramètres passés (type, nombre de paramètres), les résultats d'exécution de la méthode sont également différents :

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

Mais il est évidemment difficile de maintenir le code écrit ci-dessus. Vous pouvez utiliser la méthode run comme interface pour exécuter différentes méthodes selon le type de paramètres, lorsqu'elle est utilisée dans une classe, c'est la suivante :

 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:参数不匹配

Il s'agit d'une simulation de surcharge de méthodes, mais en fait, ES5, ES6 et typescipt ne prennent pas en charge la surcharge de méthodes grammaticales, et typescipt ne prend en charge que la surcharge de fonctions.

Ceci est une autre implémentation du polymorphisme.

Démo par 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:这只猫正在吃鱼

Démo par 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:这只猫正在吃鱼

Postface

Si vous aimez l'article de l'auteur, n'oubliez pas de le mettre dans vos favoris. Votre like est le plus grand encouragement de l'auteur

Les principaux points de connaissance orientés objet sont ; ici, j'ai fini de parler. Ces choses ne sont que les bases. Ce que j'ai dit n'est certainement pas parfait. C'est juste pour permettre à tout le monde de commencer rapidement. Il est recommandé que vous lisiez et appreniez systématiquement js OOP ; 🎜>

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!