JavaScript之AOP编程实例


Posted in Javascript onJuly 17, 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 相关文章推荐
jsTree 基于JQuery的排序节点 Bug
Jul 26 Javascript
jQuery操作select的实例代码
Jun 14 Javascript
js图片延迟加载的实现方法及思路
Jul 22 Javascript
JQuery触发事件例如click
Sep 11 Javascript
使用堆实现Top K算法(JS实现)
Dec 25 Javascript
JavaScript实现获取某个元素相邻兄弟节点的prev与next方法
Jan 25 Javascript
VUEJS实战之修复错误并且美化时间(2)
Jun 13 Javascript
json2.js 入门教程之使用方法与实例分析
Sep 14 Javascript
在 Vue-CLI 中引入 simple-mock实现简易的 API Mock 接口数据模拟
Nov 28 Javascript
如何通过javaScript去除字符串两端的空白字符
Feb 06 Javascript
Element Input输入框的使用方法
Jul 26 Javascript
Vue实现返回顶部按钮实例代码
Oct 21 Javascript
js+html5实现可在手机上玩的拼图游戏
Jul 17 #Javascript
javascript封装的sqlite操作类实例
Jul 17 #Javascript
js实现头像图片切割缩放及无刷新上传图片的方法
Jul 17 #Javascript
javascript实现根据3原色制作颜色选择器的方法
Jul 17 #Javascript
javascript实现树形菜单的方法
Jul 17 #Javascript
JSON与XML优缺点对比分析
Jul 17 #Javascript
浅谈jQuery的offset()方法及示例分享
Jul 17 #Javascript
You might like
PHP编程最快明白(第一讲 软件环境和准备工作)
2010/10/25 PHP
利用php绘制饼状图的实现代码
2013/06/07 PHP
探讨fckeditor在Php中的配置详解
2013/06/08 PHP
thinkphp,onethink和thinkox中验证码不显示的解决方法分析
2016/06/06 PHP
jQuery UI Datepicker length为空或不是对象错误的解决方法
2010/12/19 Javascript
javascript常用方法、属性集合及NodeList 和 HTMLCollection 的浏览器差异
2010/12/25 Javascript
深入理解Javascript闭包 新手版
2010/12/28 Javascript
Javascript正则控制文本框只能输入整数或浮点数
2014/09/02 Javascript
详解js中的apply与call的用法
2016/07/30 Javascript
View.post() 不靠谱的地方你知道多少
2017/08/29 Javascript
BootStrap Table实现server分页序号连续显示功能(当前页从上一页的结束序号开始)
2017/09/12 Javascript
vue.js实现标签页切换效果
2018/06/07 Javascript
angular2 组件之间通过service互相传递的实例
2018/09/30 Javascript
Python和Perl绘制中国北京跑步地图的方法
2016/03/03 Python
Python编程实战之Oracle数据库操作示例
2017/06/21 Python
对Python中range()函数和list的比较
2018/04/19 Python
Python使用OpenCV进行标定
2018/05/08 Python
Django实战之用户认证(初始配置)
2018/07/16 Python
用Python中的turtle模块画图两只小羊方法
2019/04/09 Python
Python 给屏幕打印信息加上颜色的实现方法
2019/04/24 Python
Python爬虫图片懒加载技术 selenium和PhantomJS解析
2019/09/18 Python
Python3.7+tkinter实现查询界面功能
2019/12/24 Python
实现ECharts双Y轴左右刻度线一致的例子
2020/05/16 Python
完美解决pycharm 不显示代码提示问题
2020/06/02 Python
python装饰器代码深入讲解
2021/03/01 Python
如何使用html5与css3完成google涂鸦动画
2012/12/16 HTML / CSS
施华洛世奇加拿大官网:SWAROVSKI加拿大
2018/06/03 全球购物
Bugatchi官方网站:男士服装在线
2019/04/10 全球购物
公司承诺书怎么写
2014/05/24 职场文书
四风问题党员个人整改措施
2014/10/27 职场文书
2014年高校辅导员工作总结
2014/12/09 职场文书
2015医德医风个人工作总结
2015/04/02 职场文书
Mysql基础之常见函数
2021/04/22 MySQL
Oracle更换为MySQL遇到的问题及解决
2021/05/21 Oracle
mysql 直接拷贝data 目录下文件还原数据的实现
2021/07/25 MySQL
用Python实现屏幕截图详解
2022/01/22 Python