jQuery Aop 简明教程

在jQuery中添加AOP的功能，可以使用jquery plugin.http://code.google.com/p/jquery-aop/。使用非常简单，包含.js文件，然后调用添加通知的函数。
一共有四种通知:前置通知，后置通知，环绕通知和引入。

前置通知：before (Map pointcut, Function advice) return Array<Function>
在指定织入点创建一个前置通知。通知在被织入的方法之前执行，不能改变原方法的行为或阻止它执行。

参数：
pointcut: 织入点对象
   target:被织入的对象
   method:被织入的方法名字
advice: 通知函数

例：

jQuery.aop.before( {target: window, method: 'MyGlobalMethod'}, 
  function() { 
    alert('About to execute MyGlobalMethod'); 
  }
);

jQuery.aop.before( {target: window, method: /My/}, 
  function() { 
    alert('About to execute one of my global methods'); 
  }
);

jQuery.aop.before( {target: String, method: 'indexOf'}, 
  function(index) { 
    alert('About to execute String.indexOf on: ' + this); 
  }
);

   
后置通知：after (Map pointcut, Function advice) return Array<Function>
通知(advice)在定义的切入点后面执行(pointcut),并接收切入点方法运行后的返回值作为参数


参数：
pointcut: 织入点对象
   target:被织入的对象
   method:被织入的方法名字。
advice: 通知函数，并接受切入点方法执行后的返回值作为参数

例：

jQuery.aop.after( {target: window, method: 'MyGlobalMethod'}, 
  function(result) { 
    alert('Returned: ' + result); 
  } 
);

jQuery.aop.after( {target: String, method: 'indexOf'}, 
  function(index) { 
    alert('Result found at: ' + index + ' on:' + this); 
  }
);

环绕通知：around (Map pointcut, Function advice) return Array<Function>
在指定切入点处创建一个环绕通知，此类型的同志通过调用innovation.proceed()能够控制切入点方法的执行，也能在函数执行前更改它的参数。

参数：
pointcut: 织入点对象
   target:被织入的对象
   method:被织入的方法名字。
advice: 通知函数，有一个参数innovation。包含.proceed()方法和两个属性：.argurments及.method

例：

jQuery.aop.around( {target: window, method: 'MyGlobalMethod'}, 
  function(invocation) {
    alert('# of Arguments: ' + invocation.arguments.length); 
    return invocation.proceed(); 
  }
);

jQuery.aop.around( {target: String, method: 'indexOf'}, 
  function(invocation) { 
    alert('Searching: ' + invocation.arguments[0] + ' on: ' + this); 
    return invocation.proceed(); 
  }
);

jQuery.aop.around( {target: window, method: /Get(\d+)/}, 
  function(invocation) {
    alert('Executing method ' + invocation.method); 
    return invocation.proceed(); 
  }
);

引入：introduction (Map pointcut, Function advice) return Array<Function>
此类型的通知的方法（advice)将替代制定切入点的方法。要恢复原方法，唯有卸载通知。

pointcut: 织入点对象
   target:被织入的对象
   method:被织入的方法名字。
advice: 通知函数。

例：

jQuery.aop.introduction( {target: String, method: 'log'}, 
  function() { 
    alert('Console: ' + this);
  }
);

评论

14 楼 zstsr 2009-08-06  

night_stalker 写道

yicone 写道

也没想到太好的用途, 关键是提供一种统一的扩展机制吧, 当然别的"统一"机制也可以, 不"统一"也没关系. 只是多一种选择.
还注意到一个特性:
Allows to define point-cuts using regex to match multiple methods.

这个用什么办法可以实现呢?

不用 AOP 就超简单，譬如想调用 obj 所有与 /aa/ 匹配的方法，只需这样：

for(x in obj){
  if(x.match(/aa/)){
    obj[x]() // 如果想修改 obj[x]，也很清晰简单……
  }
}

百无一用 AOP ……

这个能实现？麻烦举个例！

13 楼 wnzz95391511 2009-08-06  

这个插件挺好的！
在JS中实现AOP还是有很多用处的~

12 楼 liuchaoyong 2009-07-14  

js也面向切面了？有创意

11 楼 yicone 2009-07-02  

不用 AOP 就超简单，譬如想调用 obj 所有与 /aa/ 匹配的方法，只需这样：

for(x in obj){
  if(x.match(/aa/)){
    obj[x]() // 如果想修改 obj[x]，也很清晰简单……
  }
}

百无一用 AOP ……


学到了.

10 楼 香克斯 2009-06-29  

动态语言强套java中的一些概念很不合适

9 楼 soni 2009-06-22  

哪位高手能告诉我aop是啥么？

8 楼 night_stalker 2009-06-22  

yicone 写道

也没想到太好的用途, 关键是提供一种统一的扩展机制吧, 当然别的"统一"机制也可以, 不"统一"也没关系. 只是多一种选择.
还注意到一个特性:
Allows to define point-cuts using regex to match multiple methods.

这个用什么办法可以实现呢?

不用 AOP 就超简单，譬如想调用 obj 所有与 /aa/ 匹配的方法，只需这样：

for(x in obj){
  if(x.match(/aa/)){
    obj[x]() // 如果想修改 obj[x]，也很清晰简单……
  }
}

百无一用 AOP ……

7 楼 yicone 2009-06-22  

也没想到太好的用途, 关键是提供一种统一的扩展机制吧, 当然别的"统一"机制也可以, 不"统一"也没关系. 只是多一种选择.
还注意到一个特性:
Allows to define point-cuts using regex to match multiple methods.

可以用这个特性, 对所有自己写的方法添加一个计时机制, 而在将代码放到生产环境时, 统一关闭计时.

希望能得到大家更多的启示和教导.

6 楼 androidnew 2009-06-02  

在下菜鸟。。 js居然也能aop。。 学习了

5 楼 kjj 2009-05-09  

aop 的实现有什么特别之处吗，用了你的能解决那些现在难以解决的问题！！

4 楼 night_stalker 2009-05-08  

block 写道

还是有必要的。
比如说有个前端的UI框架你想使用，但是有个效果与你想要的有所区别，这个效果缺少了一个操作。那么你可以找到这个function，使用上面介绍的aop特性，就可以在不修改框架源代码的基础上完成这个功能。

js 的函数本来就是可变的，这样其实是走了弯路……

譬如要在不影响原代码的情况下修改 obj.func ：

// 保存老函数
old_func = obj.func

// 赋予新函数
obj.func = function(){
  // before
  old_func()
  // after
}

比 aop 简单多了。 before + after 都有就相当于环绕织入， 不调用 old_func 就相当于替代织入。

3 楼 fuzan 2009-05-08  

个人愚见，我要想在原有框架上加方法不需要什么aop，直接hack他了，例如下面这个：
  <HEAD>
  <SCRIPT LANGUAGE="JavaScript">
  <!--
    function show(){
alert(123);
    }
  //-->
  </SCRIPT>
  <SCRIPT LANGUAGE="JavaScript">
  <!--
  _Myshow = window.show;
  window.show = myShow;
    function myShow(){
      alert('456')
      _Myshow();
    }
  //-->
  </SCRIPT>
  </HEAD>

  <BODY>
 
    <SCRIPT LANGUAGE="JavaScript">
    <!--
show();
    //-->
    </SCRIPT>
  </BODY>
</HTML>

    这种hack方式要求使用者对所hack的作用域非常清晰，要不然很可能影响原有的很多代码功能,当然jq的实现方式肯定比这个好很多，只是aop这种概念js里面其实就是上面代码的实现。
    人家的代码很好看，写得也很优雅，粘出一点点：
if (advice.type == _after)
    aspect = function() {
      var returnValue = old.apply(this, arguments);
      return advice.value.apply(this, [returnValue, method]);
   };
else if (advice.type == _before)
    aspect = function() {
      advice.value.apply(this, [arguments, method]);
      return old.apply(this, arguments);
   };

2 楼 block 2009-05-07  

sunshan 写道

关键是js用得着aop吗？js已经有了完善的事件处理回调，如果用js实现太多java的事情,没有太大必要。
个人愚见，如有不周，请谅解

还是有必要的。
比如说有个前端的UI框架你想使用，但是有个效果与你想要的有所区别，这个效果缺少了一个操作。那么你可以找到这个function，使用上面介绍的aop特性，就可以在不修改框架源代码的基础上完成这个功能。

1 楼 sunshan 2009-05-07  

关键是js用得着aop吗？js已经有了完善的事件处理回调，如果用js实现太多java的事情,没有太大必要。
个人愚见，如有不周，请谅解