[JavaScriptを] JavaScriptのオブジェクト指向設計(3):インターフェース多型の記事

私たちは、基本的なJavaScriptの相続法の実践を紹介するのObject.prototypeを通じて、我々はあなたがオブジェクトを継承するオブジェクトを決定するのは自由です最初のもので、あなたはまた、オブジェクトのプロパティとメソッドは、現在利用可能な拡張することができます(およびC#拡張メソッドは、同じ目的を持っていますポリモーフィズム(多型):ミャオ族)は、この中で、我々は、オブジェクト指向の別の特徴を紹介したいと思います。


私たちは、基本的なJavaScriptの相続法の実践を紹介するのObject.prototypeを通じて、我々はあなたがオブジェクトを継承するオブジェクトを決定するのは自由です最初のもので、あなたはまた、オブジェクトのプロパティとメソッドは、現在利用可能な拡張することができます(およびC#拡張メソッドは、同じ目的を持っています:ミャオ族)は、この中で、我々は、オブジェクト指向の別の特徴紹介したい多型(多型)

多型が同じ行動(挙動)と定義され、異なるオブジェクトに対して異なる反応。最も頻繁に引用されている動物や車の例としては、例えば、私は、我々はそれを継承するHondaCRVとトヨタ・ウィッシュ2つのオブジェクトを定義するのgetName()メソッドは、その全体として定義されるを有するカーオブジェクトを有します。

   1:機能カー(){
   2:   
   3:this.name = "BASE"。
   4:   
   5:this.getName =関数(){this.nameを返します。}。
   6:this.drive =関数(){のdocument.write( "ドライブBASE 
")。}。
   7:   
   8:}
   9:   
  10:機能HondaCRV(){
  11:HondaCRV.prototype.name = "HONDA CRV"。
  12:}
  13:   
  14:HondaCRV.prototype =新しいカー();
  15:   
  16:機能トヨタ・ウィッシュ(){
  17:ToyotaWish.prototype.name = "TOYOTAウィッシュ"。
  18:}
  19:   
  20:ToyotaWish.prototype =新しいカー();

メインプログラムでこのコール:

   1:関数init(){
   2:   
   3:document.writeを(。(新しいカー())のgetName()+ " 
「);
   4:のdocument.write((新しいHondaCRV())のgetName()+ "。
「);
   5:document.writeを(。(新しいトヨタ・ウィッシュ())のgetName()+ " 
「);
   6:   
   7: }

このような結果を得ることができます。

画像

それは親クラスの変数を共有しますが、このプログラムでは、多型の使用の典型的な例ですが、我々はまた、さらに容量の多型を行うことができます。次のように車に()を駆動し、そして今、我々はそれを上書きHondaCRVとトヨタ・ウィッシュにしたいための一つの方法は、プログラムは次のとおりです。

   1:機能カー(){
   2:   
   3:this.name = "BASE"。
   4:   
   5:this.getName =関数(){this.nameを返します。}。
   6:this.drive =関数(){のdocument.write( "ドライブBASE 
")。}。
   7:   
   8:}
   9:   
  10:機能HondaCRV(){
  11:HondaCRV.prototype.name = "HONDA CRV"。
  12:HondaCRV.prototype.drive =関数(){
  13:のdocument.write( "今ドライブHONDA CRV 
");
  14:}。
  15:}
  16:   
  17:HondaCRV.prototype =新しいカー();
  18:   
  19:機能トヨタ・ウィッシュ(){
  20:ToyotaWish.prototype.name = "TOYOTAウィッシュ"。
  21:ToyotaWish.prototype.drive =関数(){
  22:のdocument.write( "今ドライブTOYOTAウィッシュ
");
  23:}。
  24:}
  25:   
  26:ToyotaWish.prototype =新しいカー();

彼らの行動を実行するために、親オブジェクトのメソッド、オブジェクトを上書きする。[方法]方法私たちは今のObject.prototypeを使用することに注意してください。そして、メインプログラムを変更します。

   1:関数init(){
   2:   
   3:document.writeを(。(新しいカー())のgetName()+ " 
「);
   4:のdocument.write((新しいHondaCRV())のgetName()+ "。
「);
   5:document.writeを(。(新しいトヨタ・ウィッシュ())のgetName()+ " 
「);
   6:   
   7:。(新しいカー())(ドライブ);
   8:。(新HondaCRV())(ドライブ);
   9:。(新しいトヨタ・ウィッシュ())(ドライブ);
  10:   
  11:}

それを実行し、我々は次のような結果が得られます。

画像

ここでは、と私はあなたが多状態の練習のJavaScript関数を使用する方法を知っておくべきだと思う、と私たちはやろうとしているとの関連性の高い多型の機能があります:インターフェイス(インターフェイス)

そのような人々は、インターフェイスが契約(契約)で、それは限り、インターフェイスへの参照があるとして、強い義務がありますが、練習していないことを知っている必要があり、C#/ Javaの/ VBプログラムオブジェクト指向言語、それがスローされますを書いていますコンパイルエラーなので、インターフェースの心配はありませんがしかし、JavaScriptが緩く、我々はそれを自分自身をしなければならないが、いくつかのJavaScriptヘルパーが便利なオブジェクト、あなたが私たちを助けることができるリテラル言語の種類は、そのようなチェックを強制する方法はありませんので、この部分で、実用的ではありません何かを解決します。

例えば、我々はgetAmount()メソッドを有するIRateCalculatorインタフェースを予約しました。

   1:機能IRateCalculator(){
   2://契約方法。
   3:      this.getAmount = function (amount) { throw "ERROR_INTERFACE_METHOD_MUST_BE_IMPLEMENTED"; };
   4:  }

然后我们定义了两个对象 SavingCalculator 与 LoanCalculator,皆实践 IRateCalculator 界面,定义自己的 getAmount() 方法:

   1:  SavingCalculator.prototype = new IRateCalculator();
   2:   
   3:  function SavingCalculator(amount) {
   4:   
   5:      this.amount = amount;
   6:   
   7:      SavingCalculator.prototype.getAmount = function (amount) {
   8:          return amount * 1.01; // 1%
   9:      };
  10:   
  11:  }
  12:   
  13:  LoanCalculator.prototype = new IRateCalculator();
  14:   
  15:  function LoanCalculator(amount) {
  16:   
  17:      this.amount = amount;
  18:   
  19:      LoanCalculator.prototype.getAmount = function (amount) {
  20:          return amount * 1.20; // 20%
  21:      };
  22:   
  23:  }

在主程序中我们要使用 SavingCalculator 和 LoanCalculator 计算十万元的本利和:

   1:  function init() {
   2:   
   3:      var saving = new SavingCalculator();
   4:      var loan = new LoanCalculator();
   5:   
   6:      // check interface.
   7:      console.log(IRateCalculator.prototype);
   8:      console.log(SavingCalculator.prototype);
   9:      console.log(typeof SavingCalculator.prototype.getAmount);
  10:   
  11:      if (IRateCalculator.prototype.isPrototypeOf(saving))
  12:          document.write("Saving's Rate Amount of 100000 is: " + saving.getAmount(100000) + "
");
  13:      else
  14:          document.write("Your code is not implement IRateCalculator interface.");
  15:   
  16:      if (IRateCalculator.prototype.isPrototypeOf(loan))
  17:          document.write("Loan's Rate Amount of 100000 is: " + loan.getAmount(100000) + "
");
  18:      else
  19:          document.write("Your code is not implement IRateCalculator interface.");
  20:   
  21:  }

执行结果为:

画像

看起来很平常吧,但其实问题有两个:

1. 主程序必须要确认对象有实践 IRateCalculator 界面。
2. 主程序必须检查对象确实实践了 IRateCalculator.getAmount() 方法。

针对第一个问题,我们可以利用 Object.prototype.isPrototypeOf() 方法来确认,它可以检查界面是否被某对象实践,因此我们检查了这件事,并决定是否要调用 getAmount() 方法。然而第二个问题仍无解,因为 Object.prototype 无法回传更多的类型资讯,因此无法得到确实的类型比对依据,无法很确定 SavingCalculator 和 LoanCalculator 的 getAmount() 确实就是 IRateCalculator.getAmount() 方法,只能够暂时信任对象实践的确实是界面所定义的方法。

善用多态,可以创造出很多不同的 JavaScript 对象应用,而且它也能做为 Design Pattern 的入口基石,让编写可高度重复使用的 JavaScript 程序能更加容易。

原文:大专栏  [JavaScript] JavaScript 面向对象设计 (3) : 多态与界面篇


おすすめ

転載: www.cnblogs.com/chinatrump/p/11496454.html