ホームページ  >  記事  >  ウェブフロントエンド  >  JSにおけるポリモーフィックインスタンスの詳しい説明

JSにおけるポリモーフィックインスタンスの詳しい説明

韦小宝
韦小宝オリジナル
2018-01-12 09:52:341256ブラウズ

この記事では、サンプル コードを通じて JS のポリモーフィズムを詳しく紹介します。JS に興味のある友人は、JS のポリモーフィズムの例について詳しく説明していますので、この記事を参照してください。

オブジェクト指向

プログラミング言語のポリモーフィズム はとても重要です。 JAVA では、ポリモーフィズムは継承によって実現されます。以下の通り:

public abstract class Animal {
abstract void makeSound(); // 抽象方法
}
public class Chicken extends Animal{
public void makeSound(){
System.out.println( "咯咯咯" );
}
}
public class Duck extends Animal{
public void makeSound(){
System.out.println( "嘎嘎嘎" );
}
}
Animal duck = new Duck(); // (1)
Animal chicken = new Chicken(); // (2)
ポリモーフィズムの考え方は、実際には「何をするか」と「誰がそれを行うか」を分離することです。これを達成するには、最終的には、まず型間の結合関係を排除する必要があります。

Java では、上向きキャストによってポリモーフィズムを実現できます。

JavaScript
の変数は実行時に変数になります。これは、JavaScript オブジェクト の多態性が生物学的なすべてに関連していることを意味します。 ポリモーフィズムの最も基本的な機能は、手続き型の条件分岐ステートメントをオブジェクト ポリモーフィズムに変換することで削除することです。

地図アプリケーションを作成したいとします。アプリケーションに接続するためのオプションの地図 API プロバイダーが 2 つあります。現在、Google Maps を選択しています。show メソッドは、ページ上に地図全体を表示する役割を担う Google Maps API で提供されています。サンプルコードは次のとおりです:

var googleMap = {
show: function(){
console.log( '开始渲染谷歌地图' );
}
};
var renderMap = function(){
googleMap.show();
};
renderMap(); // 输出:开始渲染谷歌地图
var googleMap = {
show: function(){
console.log( '开始渲染谷歌地图' );
}
};
var baiduMap = {
show: function(){
console.log( '开始渲染百度地图' );
}
};
var renderMap = function( type ){
if ( type === 'google' ){
googleMap.show();
}else if ( type === 'baidu' ){
baiduMap.show();
}
};
renderMap( 'google' ); // 输出:开始渲染谷歌地图
renderMap( 'baidu' ); // 输出:开始渲染百度地图

ご覧のとおり、renderMap 関数は現在ある程度の柔軟性を維持していますが、この柔軟性は非常に脆弱であり、一旦 Soso マップに置き換える必要があると、renderMap 関数は間違いなく柔軟性を失います。条件分岐ステートメントは変更され、引き続き追加されます。

まず、地図を表示するプログラムの同じ部分を抽象化しましょう:

var renderMap = function( map ){
if ( map.show instanceof Function ){
map.show();
}
};
renderMap( googleMap ); // 输出:开始渲染谷歌地图
renderMap( baiduMap ); // 输出:开始渲染百度地图

その後、Tencent Maps のサポートを追加したため、元のコードを変更せずにこの機能をすぐに実装できます :

var TencentMap = {
  show: function(){
console.log( '开始渲染腾讯地图' );
}
}
renderMap( sosoMap ); // 输出:开始渲染腾讯地图

ポリモーフィック テクノロジーは次のとおりです。非常に重要であり、多くの

デザイン パターン

はポリモーフィズムを巧みに使用して実装されています。以上、編集者が紹介したJSのポリモーフィズムの例でしたので、ご参考になれば幸いです。 関連する推奨事項:

JS は、リンクをクリックして非表示のコンテンツの表示に切り替えます

JS 開発におけるいくつかの基本データ型

JS は、コンテンツを表示するためのクリックサイクル切り替えを実装します

以上がJSにおけるポリモーフィックインスタンスの詳しい説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。