技术开发 频道

Web开发者必知:Javascript的策略模式

        【IT168 技术】我喜欢策略设计模式。我尽可能多的试着去使用它。究其本质,策略模式使用委托去解耦使用它们的算法类。

  这样做有几个好处。他可以防止使用大条件语句来决定哪些算法用于特定类型的对象。将关注点分离开来,因此降低了客户端的复杂度,同时还可以促进子类化的组成。它提高了模块化和可测性。每一个算法都可以单独测试。每一个客户端都可以模拟算法。任意的客户端都能使用任何算法。他们可以互调。就像乐高积木一样。

  为了实现策略模式,通常有两个参与者:

  • 该策略的对象,封装了算法

  • 客户端(上下文)对象,以即插即用的方式能使用任何策略

  这里介绍了我在Javascrip里,怎样使用策略模式,在混乱无序的环境中怎样使用它将库拆成小插件,以及即插即用包的。

  函数作为策略

  一个函数提供了一种封装算法的较好方式,同时可以作为一种策略来使用。只需通过一个到客户端的函数并确保你的客户端能调用该策略。

  我们用一个例子来证明。假设我们想创建一个Greeter 类。它所要做的就是和人打招呼。我们希望Greeter 类能知道跟人打招呼的不同方式。为了实现这一想法,我们为打招呼创建不同的策略。

// Greeter is a class of object that can greet people.
// It can learn different ways of greeting people through
// 'Strategies.'
//
// This is the Greeter constructor.
var Greeter
= function(strategy) {
this.strategy
= strategy;
};

// Greeter provides a greet function that is going to
// greet people using the Strategy passed to the constructor.
Greeter.prototype.greet
= function() {
return this.strategy();
};

// Since a function encapsulates an algorithm, it makes a perfect
// candidate for a Strategy.
//
// Here are a couple of Strategies to use with our Greeter.
var politeGreetingStrategy
= function() {
console.log(
"Hello.");
};

var friendlyGreetingStrategy
= function() {
console.log(
"Hey!");
};

var boredGreetingStrategy
= function() {
console.log(
"sup.");
};

// Let's use these strategies!
var politeGreeter = new Greeter(politeGreetingStrategy);
var friendlyGreeter
= new Greeter(friendlyGreetingStrategy);
var boredGreeter
= new Greeter(boredGreetingStrategy);

console.log(politeGreeter.greet());
//=> Hello.
console.log(friendlyGreeter.greet());
//=> Hey!
console.log(boredGreeter.greet());
//=> sup.

  在上面的例子中,Greeter 是客户端,并有三种策略。正如你所看到的,Greeter 知道怎样使用算法,但对于算法的细节却一无所知。

  对于复杂的算法,一个简单的函数往往不能满足。在这种情况下,对好的方式就是按照对象来定义。

  类作为策略

  策略同样可以是类,特别是当算比上述例子中使用的人为的(策略/算法)更复杂的时候。使用类的话,允许你为每一种策略定义一个接口。

  在下面的例子中,证实了这一点。

// We can also leverage the power of Prototypes in Javascript to create
// classes that act as strategies.
//
// Here, we create an abstract class that will serve as the interface
// for all our strategies. It isn't needed, but it's good for documenting
// purposes.
var Strategy
= function() {};

Strategy.prototype.execute
= function() {
  throw
new Error('Strategy#execute needs to be overridden.')
};

// Like above, we want to create Greeting strategies. Let's subclass
// our Strategy class to define them. Notice that the parent class
// requires its children to override the execute method.
var GreetingStrategy
= function() {};
GreetingStrategy.prototype
= Object.create(Strategy.prototype);

// Here is the `execute` method, which is part of the public interface of
// our Strategy-based objects. Notice how I implemented this method in term of
// of other methods. This pattern is called a Template Method, and you'll see
// the benefits later on.
GreetingStrategy.prototype.execute
= function() {
  return this.sayHi()
+ this.sayBye();
};

GreetingStrategy.prototype.sayHi
= function() {
  return
"Hello, ";
};

GreetingStrategy.prototype.sayBye
= function() {
  return
"Goodbye.";
};

// We can already try out our Strategy. It requires a little tweak in the
// Greeter class before, though.
Greeter.prototype.greet
= function() {
  return this.strategy.execute();
};

var greeter
= new Greeter(new GreetingStrategy());
greeter.greet()
//=> 'Hello, Goodbye.'
0
相关文章