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 相关文章推荐
用javascript实现的支持lrc歌词的播放器
May 17 Javascript
070823更新的一个[消息提示框]组件 兼容ie7
Aug 29 Javascript
jQuery UI的Dialog无法提交问题的解决方法
Jan 11 Javascript
腾讯UED 漂亮的提示信息效果代码
Sep 12 Javascript
javascript:文字不间断向左移动的实例代码
Aug 08 Javascript
javascript教程:关于if简写语句优化的方法
May 17 Javascript
javascript正则表达式参数/g与/i及/gi的使用指南
Aug 27 Javascript
JS实现的4种数字千位符格式化方法分享
Mar 02 Javascript
全面解析Bootstrap中tab(选项卡)的使用方法
Jun 06 Javascript
Vue.JS入门教程之事件监听
Dec 01 Javascript
JS实现滑动门效果的方法详解
Dec 19 Javascript
vue实现列表拖拽排序的功能
Nov 02 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实现邮件发送并带有附件
2014/01/24 PHP
PHP的switch判断语句的“高级”用法详解
2014/10/01 PHP
在Nginx上部署ThinkPHP项目教程
2015/02/02 PHP
PHP中is_file()函数使用指南
2015/05/08 PHP
用PHP代码在网页上生成图片
2015/07/01 PHP
php判断文件上传图片格式的实例详解
2017/09/30 PHP
模拟jQuery中的ready方法及实现按需加载css,js实例代码
2013/09/27 Javascript
利用javaScript实现点击输入框弹出窗体选择信息
2013/12/11 Javascript
js根据日期判断星座的示例代码
2014/01/23 Javascript
js动态修改整个页面样式达到换肤效果
2014/05/23 Javascript
AngularJS快速入门
2015/04/02 Javascript
使用jquery.qrcode.js生成二维码插件
2016/10/17 Javascript
详解AngularJS跨页面传值(ui-router)
2017/08/23 Javascript
javascript高级模块化require.js的具体使用方法
2017/10/31 Javascript
AngularJS2 与 D3.js集成实现自定义可视化的方法
2017/12/01 Javascript
vue scroller返回页面记住滚动位置的实例代码
2018/01/29 Javascript
vue 多入口文件搭建 vue多页面搭建的实例讲解
2018/03/12 Javascript
node.js读取Excel数据(下载图片)的方法示例
2018/08/02 Javascript
微信小程序网络封装(简单高效)
2018/08/06 Javascript
js判断一个对象是数组(函数)的方法实例
2019/12/19 Javascript
详解如何在Javascript中使用Object.freeze()
2020/10/18 Javascript
分析用Python脚本关闭文件操作的机制
2015/06/28 Python
Python实现随机生成任意数量车牌号
2020/01/21 Python
From CSV to SQLite3 by python 导入csv到sqlite实例
2020/02/14 Python
美国家用电器和电子产品商店:Abt
2016/09/06 全球购物
Boden澳大利亚官网:英国在线服装公司
2018/08/05 全球购物
HomeAway英国:全球领先的度假租赁在线市场
2020/02/03 全球购物
全球精选男装和家居用品:Article
2020/04/13 全球购物
技术总监个人的自我评价范文
2013/12/18 职场文书
写给妈妈的道歉信
2014/01/11 职场文书
无故旷工检讨书
2014/01/26 职场文书
2014社区三八妇女节活动总结
2014/03/01 职场文书
森林病虫害防治方案
2014/06/02 职场文书
会计专业求职信范文
2015/03/19 职场文书
Python识别花卉种类鉴定网络热门植物并自动整理分类
2022/04/08 Python
CentOS7 minimal 最小化安装网络设置过程
2022/12/24 Servers