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 相关文章推荐
接收键盘指令的脚本
Jun 26 Javascript
破解Session cookie的方法
Jul 28 Javascript
jquerydom对象的事件隐藏显示和对象数组示例
Dec 10 Javascript
使用jquery操作session方法分享
Jan 22 Javascript
JavaScript中各种引用类型的常用操作方法小结
May 05 Javascript
input获取焦点时底部菜单被顶上来问题的解决办法
Jan 24 Javascript
基于JQuery的Ajax方法使用详解
Aug 16 jQuery
基于对象合并功能的实现示例
Oct 10 Javascript
JavaScript静态作用域和动态作用域实例详解
Jun 17 Javascript
vue elementUI使用tabs与导航栏联动
Jun 21 Javascript
javascript实现简易的计算器
Jan 17 Javascript
详解JavaScript作用域、作用域链和闭包的用法
Sep 03 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生成图片的缩略图的方法
2015/08/18 PHP
php7安装yar扩展的方法详解
2017/08/03 PHP
静态页面下用javascript操作ACCESS数据库(读增改删)的代码
2007/05/14 Javascript
javascript比较文档位置
2008/04/08 Javascript
Javascript中的this绑定介绍
2011/09/22 Javascript
网页前端优化之滚动延时加载图片示例
2013/07/13 Javascript
SuperSlide2实现图片滚动特效
2014/06/20 Javascript
Javascript正则控制文本框只能输入整数或浮点数
2014/09/02 Javascript
node+express+jade制作简单网站指南
2014/11/26 Javascript
Javascript基础教程之if条件语句
2015/01/18 Javascript
jQuery的load()方法及其回调函数用法实例
2015/03/25 Javascript
jQuery使用addClass()方法给元素添加多个class样式
2015/03/26 Javascript
原生js和jquery实现图片轮播特效
2015/04/23 Javascript
浅谈javascript的分号的使用
2015/05/12 Javascript
使用Angular和Nodejs、socket.io搭建聊天室及多人聊天室
2015/08/21 NodeJs
基于JS实现EOS隐藏错误提示层代码
2016/04/25 Javascript
jQuery post数据至ashx实例详解
2016/11/18 Javascript
Web开发中客户端的跳转与服务器端的跳转的区别
2017/03/05 Javascript
js编写选项卡效果
2017/05/23 Javascript
利用百度地图API获取当前位置信息的实例
2017/11/06 Javascript
JS使用canvas中的measureText方法测量字体宽度示例
2019/02/02 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
2019/02/22 Javascript
ant-design-vue 实现表格内部字段验证功能
2019/12/16 Javascript
[01:08]2014DOTA2展望TI 剑指西雅图LGD战队专访
2014/06/30 DOTA
浅析Python基础-流程控制
2016/03/18 Python
Banggood官网:面向全球客户的综合商城
2017/04/19 全球购物
Vilebrequin美国官方网上商店:法国豪华泳装品牌
2020/02/22 全球购物
KOHLER科勒美国官网:国际著名卫浴橱柜领先品牌
2020/06/27 全球购物
高中生期末评语大全
2014/01/28 职场文书
保护环境倡议书300字
2014/05/19 职场文书
空气的环保标语
2014/06/12 职场文书
2014年政风行风评议工作总结
2014/10/21 职场文书
2014年体育教学工作总结
2014/12/09 职场文书
爱心捐款感谢信
2015/01/20 职场文书
vue 实现上传组件
2021/05/31 Vue.js
SpringBoot2零基础到精通之数据与页面响应
2022/03/22 Java/Android