js设计模式笔记--策略模式

发表于

策略模式

  1. 将定义的一组算法封装起来，使其可以相互替换。封装的算法彼此之间独立，不会随着客户端的变化而变化
    • 通过定义算法返回结果，和状态模式不同的是，没有对象的依赖
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
~function () {
  'use strict'
  // 实现
  var PriceStrategy = (function () {
    var strategy = {
      return30: function (price) {
        return +price + parseInt(price / 100) * 30
      },
      return50: function (price) {
        return +price + parseInt(price / 100) * 50
      },
      percent90: function (price) {
        return price * 100 * 90 / 10000
      },
      percent80: function (price) {
        return price * 100 * 80 / 10000
      },
      percent50: function (price) {
        return price * 100 * 50 / 10000
      }
    }
    function doStrategy (algorithm, price) {
      return strategy[algorithm] && strategy[algorithm](price)
    }
    doStrategy.addStrategy = function (field, fn) {
      strategy[field] = fn
    }
    return doStrategy
  })()

  // 使用
  var price = PriceStrategy('return50', '346.5')
  console.log(price)

  // jQuery的animate就是使用策略模式实现的，传入不同的参数，产生不一样的效果
  // $('div').animate({ width: '200px' }, 1000, 'linear')
  // $('div').animate({ width: '200px' }, 1000, 'swing')

  // 在这个时候需要打6折怎么办？直接去改的话太麻烦,加上addStrategy方法
  // 执行
  var p = PriceStrategy('percent80', '34343')
  console.log(p)

  PriceStrategy.addStrategy('test59', function (price) {
    return price * 1000000
  })

  var p = PriceStrategy('test59', '3434')
  console.log(p)

}()