JavaScript AOP编程实例


Posted in Javascript onJune 16, 2015

本文实例讲述了JavaScript AOP编程。分享给大家供大家参考。具体如下:

/*
// aop({options});
// By: adamchow2326@yahoo.com.au
// Version: 1.0
// Simple aspect oriented programming module
// support Aspect before, after and around
// usage:
    aop({
      context: myObject,   // scope context of the target function.
      target: "test",     // target function name
      before: function() {  // before function will be run before the target function
        console.log("aop before");
      },
      after: function() {   // after function will be run after the target function
        console.log("aop after");
      },
      around: function() {  // around function will be run before and after the target function
        console.log("aop around");
      }
    });
*/
var aop = (function() {
  var options = {},
    context = window,
    oFn,
    oFnArg,
    targetFn,
    targetFnSelector,
    beforeFn,
    afterFn,
    aroundFn,
    cloneFn = function(Fn) {
      if (typeof Fn === "function") {
        return eval('[' +Fn.toString()+ ']')[0];
      }
      return null;
    },
    checkContext = function() {
      if (options.context) {
        context = options.context;
      }
      if (typeof context[(options.target).name] === "function") {
        targetFnSelector = (options.target).name;
        targetFn = context[targetFnSelector];
      }
      else if (typeof context[options.target] === "function") {
        targetFnSelector = options.target;
        targetFn = context[targetFnSelector];
      }
      if (targetFn) {
        oFn = cloneFn(targetFn);
        oFnArg = new Array(targetFn.length);
        return true;
      }
      else {
        return false;
      }
    },
    run = function() {
      context[targetFnSelector] = function(oFnArg) {
        if (aroundFn){
          aroundFn.apply(this, arguments);
        }
        if (beforeFn){
          beforeFn.apply(this, arguments); // 'this' is context
        }
        oFn.apply(this, arguments);
        if (afterFn){
          afterFn.apply(this, arguments); // 'this' is context
        }
        if (aroundFn){
          aroundFn.apply(this, arguments);
        }
      };
    };
  return function(opt){
    if (opt && typeof opt === "object" && !opt.length) {
      options = opt;
      if (options.target && checkContext()) {
        if (options.before && typeof options.before === "function") {
          beforeFn = options.before;
        }
        if (options.after && typeof options.after === "function") {
          afterFn = options.after;
        }
        if (options.around && typeof options.after === "function") {
          aroundFn = options.around;
        }
        run();
      }
    }
  };
})();
// test examples
// ----------------- aop modify global function ---------------//
function test(name, age) {
  console.log("test fn. name = " + name + " age: " + age);
}
aop({
  target: "test",
  before: function() {
    console.log("aop before");
  },
  after: function() {
    console.log("aop after");
  },
  around: function() {
    console.log("aop around");
  }
});
// run
test("adam", 6);
// ----------------- aop test modify method in an object ---------------//
var myobj = {
  myName: "testName",
  sayName: function() {
    console.log(this.myName);
  },
  childObj: {
    age: 6,
    say: function() {
      console.log(this.age);
    }
  }
};
aop({
  context: myobj,
  target: "sayName",
  before: function() {
    console.log("aop before say name = " + this.myName);
  },
  after: function() {
    console.log("aop after say name = " + this.myName);
  },
  around: function() {
    console.log("aop around say name = " + this.myName);
  }
});
// run
myobj.sayName();
aop({
  context: myobj.childObj,
  target: "say",
  before: function() {
    console.log("aop before say name = " + this.age);
  },
  after: function() {
    console.log("aop after say name = " + this.age);
  },
  around: function() {
    console.log("aop around say name = " + this.age);
  }
});
myobj.childObj.say();

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
js获取TreeView控件选中节点的Text和Value值的方法
Nov 24 Javascript
关于jquery css的使用介绍
Apr 18 Javascript
判定是否原生方法的JS代码
Nov 12 Javascript
深入分析jQuery的ready函数是如何工作的(工作原理)
Dec 17 Javascript
jQuery中的siblings用法实例分析
Dec 24 Javascript
jQuery on()绑定动态元素出现的问题小结
Feb 19 Javascript
javascript中this指向详解
Apr 23 Javascript
JavaScript实现QQ列表展开收缩扩展功能
Oct 30 Javascript
vue实现密码显示隐藏切换功能
Feb 23 Javascript
JQuery Ajax动态加载Table数据的实例讲解
Aug 09 jQuery
Vue 样式绑定的实现方法
Jan 15 Javascript
React性能优化系列之减少props改变的实现方法
Jan 17 Javascript
js+HTML5基于过滤器从摄像头中捕获视频的方法
Jun 16 #Javascript
动态加载jQuery的方法
Jun 16 #Javascript
详解AngularJS中的表格使用
Jun 16 #Javascript
js+HTML5实现视频截图的方法
Jun 16 #Javascript
AngularJS中的过滤器使用详解
Jun 16 #Javascript
简述AngularJS的控制器的使用
Jun 16 #Javascript
详解AngularJS中的表达式使用
Jun 16 #Javascript
You might like
第一个无线电台是由谁发明的
2021/03/01 无线电
PHP使用gmdate实现将一个UNIX 时间格式化成GMT文本的方法
2015/03/19 PHP
thinkphp中U方法按路由规则生成url的方法
2018/03/12 PHP
Yii框架中用response保存cookie,用request读取cookie的原理解析
2019/09/04 PHP
prototype class详解
2006/09/07 Javascript
javascript下查找父节点的简单方法
2007/08/13 Javascript
看了就知道什么是JSON
2007/12/09 Javascript
js 手机号码合法性验证代码集合
2012/09/29 Javascript
jquery选择器的选择使用及性能介绍
2013/01/16 Javascript
将文本输入框内容加入表中的js代码
2013/08/18 Javascript
js(JavaScript)实现TAB标签切换效果的简单实例
2014/02/26 Javascript
jquery和css3实现的炫酷时尚的菜单导航
2014/09/01 Javascript
使用js画图之正弦曲线
2015/01/12 Javascript
jquery利用拖拽方式在图片上添加热链接
2015/11/24 Javascript
详解angularjs实现echart图表效果最简洁教程
2017/11/29 Javascript
webpack常用配置总览(小结)
2019/11/18 Javascript
[01:24:09]Ti4 冒泡赛第二轮DK vs C9 1
2014/07/14 DOTA
Python脚本实现格式化css文件
2015/04/08 Python
OpenCV2.3.1+Python2.7.3+Numpy等的配置解析
2018/01/05 Python
python自动截取需要区域,进行图像识别的方法
2018/05/17 Python
Python实现的爬取网易动态评论操作示例
2018/06/06 Python
python实现自动登录
2018/09/17 Python
Face++ API实现手势识别系统设计
2018/11/21 Python
python 使用正则表达式按照多个空格分割字符的实例
2018/12/20 Python
Python爬虫学习之获取指定网页源码
2019/07/30 Python
Pytorch 定义MyDatasets实现多通道分别输入不同数据方式
2020/01/15 Python
印度在线杂货店:bigbasket
2018/08/23 全球购物
Tenstickers法国:墙贴和装饰贴纸
2019/08/26 全球购物
简历中的自我评价怎么写
2014/01/29 职场文书
学校募捐倡议书
2014/05/14 职场文书
公司贷款承诺书
2014/05/30 职场文书
乡镇综治宣传月活动总结
2014/07/02 职场文书
2014年银行员工年终自我评价
2014/09/19 职场文书
立春观后感
2015/06/18 职场文书
运动会跳远广播稿
2015/08/19 职场文书
FP-growth算法发现频繁项集——发现频繁项集
2021/06/24 Python