本文共 2876 字，大约阅读时间需要 9 分钟。

一、装饰者

装饰者模式 : 装饰模式指的是在不必改变原类文件和使用继承的情况下，动态地扩展一个对象的功能。

1、下面演示仿java版本的装饰者模式。

var Plane = function () { };Plane.prototype.fire = function () {  console.log('发射普通子弹');}var MissileDecorator = function (plane) {  this.plane = plane;}MissileDecorator.prototype.fire = function () {  this.plane.fire();  console.log('发射导弹');}var AtomDecorator = function (plane) {  this.plane = plane;}AtomDecorator.prototype.fire = function () {  this.plane.fire();  console.log('发射原子弹');}var plane = new Plane();plane = new MissileDecorator(plane);plane = new AtomDecorator(plane);plane.fire();

2、采用aop的方式进行扩展方法功能。

// 原方法var sum = function (a, b, c) {  var arr = Array.prototype.slice.call(arguments);  var s = 0;  for (let i = 0; i < arr.length; i++) {    s += arr[i];  }  return s;}// 对所有方法原型上增加after方法，可以包装一个方法，并且扩展方法执行后的功能。Function.prototype.after = function (fn) {  var self = this;  return function () {    var res = self.apply(this, arguments);    fn.apply(this, arguments);    return res;  }}// 对所有方法原型上增加before方法，可以包装一个方法，并且扩展方法执行前的功能。Function.prototype.before = function (fn) {  var self = this;  return function () {    // fn.apply(this,arguments);    if (fn.apply(this, arguments) === false) {      return;    }    var res = self.apply(this, arguments);    return res;  }}// 测试var decoratorFn1 = sum.before(function (...param) {  console.log(param);  console.log('准备开始相加！');  if (param.length < 2) {    return false  }});var res = decoratorFn1(1);console.log(res);

二、责任链

js 责任链，责任链模式，是由很多对象由每一个对象对其下家的引用而连接起来形成一条链。

一般由实现filter的chain类，组装和控制多个filter的执行

// 1、定义Chain，内部有一个filtes数组用来装拦截器var Chain = function () {  this.filters = []; }// 添加filterChain.prototype.setFilter = function (fn) {  this.filters.push(fn);  return this;}// 执行责任链Chain.prototype.doChain = function (request) {  if (this.filters.length > 0) {    var filter = this.filters.shift();    filter.doChain(request, this); // 核心点：将chain传递给下一个filter，那么下一个filter执行就可以执行chain.doChain(request,chain)，取下一个拦截器。  }}// 过滤器1var filter1 = {  doChain: function (request, chain) {    request.msg =  request.msg + ':one';    chain.doChain(request);  }}// 过滤器2var folter2 = {  doChain: function (request, chain) {    request.msg = request.msg + ':two';    chain.doChain(request);  }}// 2，进行测试var req = { msg: '初始信息' };var chains = new Chain();chains.setFilter(filter1);chains.setFilter(folter2);chains.doChain(req, chains);console.log(req.msg);

三、状态模式

状态模式依赖于其状态的变化时其内部的行为发// 生变化，将动作委托到代表当前状态的对象，对外表现为类发生了变化。var Light = function () {  this.currState = FSM.off;}Light.prototype.change = function () {  this.currState.handle(this);};// 有限状态机 (finite state machine)var FSM = {  on: {    handle: function (light) {      console.log('开')      light.currState = FSM.off;    }  },  off: {    handle: function (light) {      console.log('关')      light.currState = FSM.on;    }  }}var light = new Light();light.change();light.change();light.change();

转载地址：http://ceuni.baihongyu.com/