5

我想在 javascript 中实现模板方法模式。

我有一个带有一些子类的 PropertyDecorator：OpenButtonDecorator、SeeButtonDecorator 等等。我想在属性装饰器中有下一个功能：

var build = function(){
   decorate(); //Abstract in PropertyDecorator, defined in subclasses
   return le.build();
}

我怎样才能让这个场景工作？也许我实现了错误的继承：S（也有帮助:)）

先感谢您。

4

1 回答 1

12

Javascript 是一种动态类型、基于原型的语言。模板方法是一种设计模式，因此与语言无关，但其实现可能因语言而异。

在 javascript 以及其他动态类型语言（如 ruby​​）中，抽象类和接口没有多大意义，因为动态链接是通过委托发生的。（方法调用会传播到继承树中的更高级别，直到原型可以处理请求）。这与鸭子类型相结合，这意味着可以在任何实例上潜在地调用任何方法，避免了显式契约的需要，在基于类的语言中，它是由在特定类型上可见的那些声明的方法定义的。

因此，为了实现该模式，只需在父原型的构建方法（该方法将是模板）上调用一个不存在的方法，然后在子类上简单地实现该方法：

function PropertyDecorator()
{
   this.build = function()
   {
      var decoration=this.decorate();
      return "The decoration I did: "+decoration;
   };
}

//we set the parent (those prototype that instances of this class will delegate calls to) 
OpenButtonDecorator.prototype = new PropertyDecorator();
function OpenButtonDecorator()
{
   this.decorate = function()
   {
     return "open button";
   };
}


SeeButtonDecorator.prototype = new PropertyDecorator();
function SeeButtonDecorator()
{
   this.decorate = function()
   {
      return "see button";
   };
}



var decorators=Array(new SeeButtonDecorator(),new OpenButtonDecorator());
for (var decorator in decorators){
    document.writeln(decorators[decorator].build());
}

方法分派以这种方式发生：

  • 实例是否调用了该方法？
    • 否 -> 将调用委托给父级（它是原型）并重复。
    • 是-> 在隐式对象的上下文中执行方法体（一开始就收到调用的那个）。

因此，在调用 new SeeButtonDecorator().build() 时，首先会尝试在实例上执行 build 方法。由于它没有在实例中定义，方法调用将委托给实例父级，在这种情况下，SeeButtonDecorator 原型，这个，也没有方法，所以它将调用委托给它的父级（PropertyDecorator）。PropertyDecorator，有build()方法。

function PropertyDecorator()
{
   this.build = function()
   {
      var decoration=this.decorate();
      return "The decoration I did: "+decoration;
   };
}

执行它时，build方法的主体将在新的 SeeButtonDecorator() 的上下文中进行评估。实例本身没有decorate()方法，因为它在 SeeButtonDecorator() 函数（它的原型）中定义。好吧，这次调用将委托给实例原型，最终将得到一个 decorate() 方法：

function SeeButtonDecorator()
{
   this.decorate = function()
   {
      return "see button";
   };
}

该方法将在实例的上下文中再次执行，并将返回字符串，回退到调用堆栈中，直到返回

The decoration I did: see button
于 2011-02-10T12:04:52.780 回答