由于功能上的需求,需要在js的N个方法前执行一些判断代码,M个方法后执行处理代码。如果直接将代码写在具体方法里面增加处理代码,那会导致代码很难维护。对于这个需求,当时想到有2种解决方案。
1.新建一个抽象类,统一入口,然后在入口再分发到具体的方法。但需要对源代码进行不少改动。而且如何分发也是一些问题,如方法参数不一。所以就没坚持这种方案。
2.搬照spring的AOP编程。最后发现是可以实现的。
网上找了一些资料,修改整理了一个util类
/*
aop工具类
onedear 2011-06-10
*/
var AOPUtil = {
/*
className:个人称之为作用域,也可称之为类名
fnName:方法名,字符串类型
beforeFn:before function
*/
before : function (className , fnName , beforeFn) {
if(typeof(className) == 'function')
className = className.prototype ;
if(typeof(className[fnName]) != 'function')
return ;
if(typeof(beforeFn) != 'function')
return ;
var target = className[fnName] ;
className[fnName] = function () {
beforeFn.apply(this,arguments);
return target.apply(this, arguments);
}
},
beforeJudge : function (className , fnName , beforeFn) {
if(typeof(className) == 'function')
className = className.prototype ;
if(typeof(className[fnName]) != 'function')
return ;
if(typeof(beforeFn) != 'function')
return ;
var target = className[fnName] ;
className[fnName] = function () {
var result = beforeFn.apply(this,arguments);
if(!result)
return ;
return target.apply(this, arguments);
}
},
//同上
after : function (className , fnName , afterFn ) {
if(typeof(className) == 'function')
className = className.prototype ;
if(typeof(className[fnName]) != 'function')
return ;
if(typeof(afterFn) != 'function')
return ;
var target = className[fnName] ;
className[fnName] = function () {
var returnValue = target.apply(this, arguments);
afterFn.apply(this,arguments);
return returnValue;
}
}
};
调用sample
function before(){
alert("before");
}
function after() {
alert("after");
}
本人习惯的方法定义有这么几种:
1.handle = {
testHandle : function() {
alert("testHandle");
}
}
则调用方法为
AOPUtil.before(window.handle,"testHandle" , after);
2.function test2() {
alert("test2");
}
则调用方法为:
AOPUtil.before(window,"test2" , before);
3.var t = function(){};
t.prototype.test = function(param1 , param2) {
alert(param1+"_"+param2);
}
则调用方法为:
AOPUtil.before(t, "test" , before);
js还有其他方法定义否?
资料参考:
http://www.w3cschool.cn/pro_js_inheritance_implementing.html
http://zhaohengzhan.blog.163.com/blog/static/255044432010214390711/
分享到:
相关推荐
主要给大家介绍了关于AOP在JS中的实现与应用的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用JS具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
AOP面向切面编程的JavaScript实现
AOP基本功能在JavaScript中的研究和实现.pdf
1. 简介 AOP (Aspect Oriented Programming) ,意为:面向切面编程,通过预编译方式和运行期动态代理实现程序功能的统一...下面我们分别在js调用方法时实现这三种通知: before(前置通知) 顾名思义,就是在函数调
AOP编程技术分享,包括iOS和javascript等多个平台实现
JavaScript实现AOP的思路? 通常,在 JavaScript 中实现 AOP,都是指把一个函数“动态织入”到另外一个函数之中,具体的实现技术有很多,下面我用扩展 Function.prototype 来做到这一点。请看下面代码:
javascript AOP 实现ajax回调函数使用比较方便,需要的朋友可以参考下。
Aop又叫面向切面编程,其中“通知”是切面的具体实现,分为...dojo中aop的实现在dojo/aspect模块中,主要有三个方法:before、after、around,本文会带领大家一步步实现around方法,后续文章将会深入解析dojo/aspect
5.AOP Jquery [jQuery][9] [jQuery架构设计与实现][10] [jQuery选择器库][11] [zepto][12] 1.jQuery 插件推荐 2. jQuery 中 closure Javascript-Design-Pattern 1. Singleton-Pattern 2. Chaining 3.Factory-...
采用js面向对象、面向切面的方式实现的坦克大战游戏。通过jquery来操作dom。 文件描述: init.js --- 初始化的JS,初始化全局对象 Util.js --- 用到的一些公共方法的JS Panel.js --- 面板JS Steel.js --- 障碍物...
主要介绍了JavaScript AOP编程,实例分析了javascript实现AOP编程的基本技巧,需要的朋友可以参考下
该项目利用了基于springboot + vue + mysql的开发模式框架实现的课设系统,包括了项目的源码资源、sql文件、相关指引文档等等。 【项目资源】:包含前端、后端、移动开发、操作系统、人工智能、物联网、信息化管理...
主要介绍了JavaScript的AOP编程,以实例形式分析了javascript面向切面编程的实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下
5.AOP Jquery [jQuery][9] [jQuery架构设计与实现][10] [jQuery选择器库][11] [zepto][12] 1.jQuery 插件推荐 2. jQuery 中 closure Javascript-Design-Pattern 1. Singleton-Pattern 2. Chaining 3.Factory-...
javascript ...5.AOP Jquery [jQuery][9] [jQuery架构设计与实现][10] [jQuery选择器库][11] [zepto][12] 1.jQuery 插件推荐 2. jQuery 中 closure Javascript-Design-Pattern 1. Singleton-Pattern
在系统实现过程中,我们充分利用了Spring Boot的快速开发特性和Vue.js的灵活性,通过前后端分离的方式提高了系统的可维护性和扩展性。系统具有良好的用户界面设计和用户体验,能够有效地提升景区管理效率,优化服务...