[JavaScript] JavaScript Object-Oriented Design (3): the interface polymorphism articles

In the first one we introduce the basic JavaScript inheritance law practice, through Object.prototype we are free to decide which objects you want to inherit from object, you can also expand the object properties and methods currently available (and C # Extension Method has the same purpose Miao), in this, we want to introduce another characteristic of object-oriented: polymorphism (polymorphism).


In the first one we introduce the basic JavaScript inheritance law practice, through Object.prototype we are free to decide which objects you want to inherit from object, you can also expand the object properties and methods currently available (and C # Extension Method has the same purpose Miao), in this, we want to introduce another characteristic of object-oriented: polymorphism (polymorphism) .

Polymorphism is defined that the same behavior (behavior), react differently on different objects. Examples of the animal or the car is the most frequently cited, for example, I have a Car object, which has a getName () method, which we define HondaCRV and ToyotaWish two objects to inherit it, in its entirety is defined as:

   1:  function Car() {
   2:   
   3:      this.name = "BASE";
   4:   
   5:      this.getName = function () { return this.name; };
   6:      this.drive = function () { document.write("Drive BASE 
"); };
   7:   
   8:  }
   9:   
  10:  function HondaCRV() {
  11: HondaCRV.prototype.name = "HONDA CRV";
  12:  }
  13:   
  14:  HondaCRV.prototype = new Car();
  15:   
  16:  function ToyotaWish() {
  17:      ToyotaWish.prototype.name = "TOYOTA Wish";
  18:  }
  19:   
  20:  ToyotaWish.prototype = new Car();

Then this call in the main program:

   1:  function init() {
   2:   
   3:      document.write((new Car()).getName() + "
");
   4:      document.write((new HondaCRV()).getName() + "
");
   5:      document.write((new ToyotaWish()).getName() + "
");
   6:   
   7:  }

Such results can be obtained:

image

This program is a typical example of the use of polymorphism, although it shared the variables of the parent class, but we can also do further capacity polymorphic. One way to drive () in the Car, and now we want to HondaCRV and ToyotaWish overwriting it, the program is as follows:

   1:  function Car() {
   2:   
   3:      this.name = "BASE";
   4:   
   5:      this.getName = function () { return this.name; };
   6:      this.drive = function () { document.write("Drive BASE 
"); };
   7:   
   8:  }
   9:   
  10:  function HondaCRV() {
  11: HondaCRV.prototype.name = "HONDA CRV";
  12:      HondaCRV.prototype.drive = function () {
  13:          document.write("Drive HONDA CRV now. 
");
  14:      };
  15:  }
  16:   
  17:  HondaCRV.prototype = new Car();
  18:   
  19:  function ToyotaWish() {
  20:      ToyotaWish.prototype.name = "TOYOTA Wish";
  21:      ToyotaWish.prototype.drive = function () {
  22:          document.write("Drive TOYOTA Wish now. 
");
  23:      };
  24:  }
  25:   
  26:  ToyotaWish.prototype = new Car();

Please note that we now use Object.prototype. [Method] way to override the parent object method, the object to perform their actions. Then modify the main program:

   1:  function init() {
   2:   
   3:      document.write((new Car()).getName() + "
");
   4:      document.write((new HondaCRV()).getName() + "
");
   5:      document.write((new ToyotaWish()).getName() + "
");
   6:   
   7:      (new Car()).drive();
   8:      (new HondaCRV()).drive();
   9:      (new ToyotaWish()).drive();
  10:   
  11:  }

Execute it, we get the following results:

image

Here, and I think you should know how to use the JavaScript function of the multi-state practice, and we are going to do and there are highly polymorphic functions related to: the interface (interface) .

Has written a C # / Java / VB program object-oriented language such people should know that the interface is a contract (contract), it has a strong mandatory, as long as there is a reference to the interface but not practice, then it will be thrown compilation error, so do not worry about the interface is not practical, however, JavaScript is loosely a type of literal language, no way to enforce such a check, so this part we have to do it themselves, but some JavaScript helper object handy, you can help us solve something.

For example, we booked a IRateCalculator interface, which has a getAmount () method:

   1:  function IRateCalculator() {
   2:      // contract method.
   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:  }

执行结果为:

image

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

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

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

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

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


Guess you like

Origin www.cnblogs.com/chinatrump/p/11496454.html