JavaScript におけるポリモーフィズムの詳細な紹介

こんにちは、今日は前の内容の続きです。今日は、OOP の最後の表現であるポリモーフィズムについて話します。が使用されているため、これは js プログラムに混乱をもたらします。これらの問題は、ECMAScript の新しいバージョンで解決されるため、あまり心配する必要はありません。に戻る OOP ポリモーフィズムの本題に戻ると、最初に親クラスを宣言し、次に親クラスのプロパティとメソッドを継承する多くのサブクラスを作成することができます。 this 最小限のコードで親クラスと同じ機能を実現できます。これが継承です。すぐに、クラスメートが質問をしました。「前の継承を長い間読んできたので理解できますが、その用途がわかりません。なぜこれほど多くの継承クラスを作成する必要があるのですか?」この質問はすぐに的中し、非常に重要です。ポリモーフィズムが存在しない場合、継承されたクラスはすべて同一のコピーであり、特性を持たないため、前述した継承はまったく役に立ちません。例:

ポリモーフィズムは文字通り「複数の状態」を意味します。同じ動作 (メソッド) が異なるオブジェクトで異なる状態を持ちます。
ポリモーフィック機能は、OOP のさまざまな場所で使用されます。たとえば、マウスの右ボタンをクリックする、ショートカットをクリックする、デスクトップ上の空白をクリックする、タスクバーをクリックするなどのときに、ポップアップ メニューが表示されます。違う。

メソッドオーバーライド:

つまり、サブクラスは親クラスと同じ名前のメソッドを定義することで、親クラスのメソッドをオーバーライドして異なる機能を実現します。

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

抽象クラス:

上記のコードでは、Snake クラスは独自の Eat() メソッドを実装していませんが、サブクラスには特定のメソッド (抽象メソッド) が必要な場合があります。そのため、現時点では、抽象クラスを使用する必要があります。ES5 と ES6 には抽象クラスの概念がないため、Animal を使用する場合は、シミュレーションを通じてのみ実装できます。 Eat() メソッドは抽象メソッドとして定義されています:

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

メソッドのオーバーロード (オーバーロード):

渡されるパラメータ (パラメータの型、数) に応じて、このような関数を作成する必要があります。実行結果も異なります:

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

しかし、上で書かれたコードを保守するのは明らかに困難です。クラスで使用すると、run メソッドをインターフェースとして使用して、パラメーターのタイプに応じてさまざまなメソッドを実行できます。

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

これはメソッドのオーバーロードのシミュレーションですが、実際には、ES5、ES6、typecipt は構文的なメソッドのオーバーロードをサポートしておらず、typecipt は関数のオーバーロードのみをサポートしています。

これはポリモーフィズムの別の実装です。

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

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

あとがき

著者の記事が気に入ったら、忘れずにブックマークしてください。あなたの「いいね」が著者にとって最大の励みになります。

ここでオブジェクト指向の主要な知識は終わりです。私が述べたことは決して完璧ではありません。時間があればすぐに始めることをお勧めします。本を体系的に読んで js OOP を学びましょう

以上がJavaScript におけるポリモーフィズムの詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。