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代码
Jan 01 Javascript
jquery实现的可隐藏重现的靠边悬浮层实例代码
May 27 Javascript
原生的html元素选择器类似jquery选择器
Oct 15 Javascript
详解JavaScript的Date对象(制作简易钟表)
Apr 07 Javascript
javascript鼠标右键菜单自定义效果
Dec 08 Javascript
javascript运算符语法全面概述
Jul 14 Javascript
jQuery遍历节点树方法分析
Sep 08 Javascript
jQuery实现的简单排序功能示例【冒泡排序】
Jan 13 Javascript
codeMirror插件使用讲解
Jan 16 Javascript
基于JavaScript实现轮播图原理及示例
Apr 10 Javascript
vue组件文档(.md)中如何自动导入示例(.vue)详解
Jan 25 Javascript
layer实现登录弹框,登录成功后关闭弹框并调用父窗口的例子
Sep 11 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
php下通过IP获取地理位置的代码(小偷程序)
2011/06/09 PHP
PHP中几个常用的魔术常量
2012/02/23 PHP
php下拉选项的批量操作的实现代码
2013/10/14 PHP
PHP filesize函数用法浅析
2019/02/15 PHP
基于PHP实现生成随机水印图片
2020/12/09 PHP
动态加载js文件 document.createElement
2006/10/14 Javascript
jQuery 处理表单元素的代码
2010/02/15 Javascript
jquery ajax abort()的使用方法
2010/10/28 Javascript
定时器(setTimeout/setInterval)调用带参函数失效解决方法
2013/03/26 Javascript
javascript实现playfair和hill密码算法
2014/12/07 Javascript
微信小程序开发之大转盘 仿天猫超市抽奖实例
2016/12/08 Javascript
JQueryEasyUI框架下的combobox的取值和绑定的方法
2017/01/22 Javascript
微信小程序 检查接口状态实例详解
2017/06/23 Javascript
用Vue-cli搭建的项目中引入css报错的原因分析
2017/07/20 Javascript
JSON 数据格式详解
2017/09/13 Javascript
vue导出html、word和pdf的实现代码
2018/07/31 Javascript
让axios发送表单请求形式的键值对post数据的实例
2018/08/11 Javascript
微信小程序文章详情页面实现代码
2018/09/10 Javascript
24行JavaScript代码实现Redux的方法实例
2019/11/17 Javascript
webpack.DefinePlugin与cross-env区别详解
2020/02/23 Javascript
利用python爬取软考试题之ip自动代理
2017/03/28 Python
Python计算一个给定时间点前一个月和后一个月第一天的方法
2018/05/29 Python
python中的RSA加密与解密实例解析
2019/11/18 Python
pytorch 求网络模型参数实例
2019/12/30 Python
python GUI库图形界面开发之PyQt5美化窗体与控件(异形窗体)实例
2020/02/25 Python
matplotlib基础绘图命令之errorbar的使用
2020/08/13 Python
python合并多个excel文件的示例
2020/09/23 Python
css3如何绘制一个圆圆的loading转圈动画
2018/01/09 HTML / CSS
加拿大健康、婴儿和美容产品在线购物:Well.ca
2016/11/30 全球购物
特罗佩亚包官方网站:Tropea
2017/01/03 全球购物
日本民宿预约平台:STAY JAPAN
2017/07/01 全球购物
shallow copy和deep copy的区别
2016/05/09 面试题
房产销售经理职责
2013/12/20 职场文书
管理提升方案
2014/06/04 职场文书
2014小学一年级班主任工作总结
2014/12/05 职场文书
城管年度个人总结
2015/02/28 职场文书