JavaScript基础教程 Javascript中的AOP编程浅谈
沉沙 2018-06-11 来源 : 阅读 1506 评论 0

摘要:AOP全称为Aspect-oriented programming,很明显这是相对于Object-oriented programming而言。Aspect可以翻译为“切面”或者“侧面”,所以AOP也就是面向切面编程。希望阅读本篇文章以后大家有所收获,帮助大家对JavaScript的理解更加深入。

Duck punch

我们先不谈AOP编程,先从duck punch编程谈起。

如果你去wikipedia中查找duck punch,你查阅到的应该是monkey patch这个词条。根据解释,Monkey patch这个词来源于 guerrilla patch,意为在运行中悄悄的改变代码,而guerrilla 这个词与 gorilla 同音,而后者意又与monkey相近(前者为“猩猩”的意思),最后就演变为了monkey patch。

虽然duck punch有些暴力,但不失为一个有效的方法。落实到代码上来说就是让原有的代码兼容我们需要的功能。比如Paul Irish博客上的这个例子:

/**
我们都知道jQuery的`$.css`方法可以通过使用颜色的名称给元素进行颜色赋值。
但jQuery内置的颜色并非是那么丰富,如果我们想添加我们自定义的颜色名称应该怎么办?比如我们想添加`Burnt Sienna`这个颜色

*/
(function($){
// 把原方法暂存起来:var _oldcss = $.fn.css;
// 重写原方法:$.fn.css = function(prop,value){
// 把自定义的颜色写进分支判断里,特殊情况特殊处理if (/^background-?color$/i.test(prop) && value.toLowerCase() === ‘burnt sienna’) {return _oldcss.call(this,prop,’#EA7E5D’);
// 一般情况一般处理,调用原方法} else {return _oldcss.apply(this,arguments);}};})(jQuery);
// 使用方法:jQuery(document.body).css(‘backgroundColor’,'burnt sienna’)

同时可以推倒出duck punch的模式不过如此:

(function($){
var _old = $.fn.method;
$.fn.method = function(arg1,arg2){
if ( … condition … ) {return  ….} else {           // do the defaultreturn _old.apply(this,arguments);}};})(jQuery);

但是这么做有一个问题:需要修改原方法。这违背了“开放-封闭”原则,本应对拓展开放,对修改关闭。怎么解决这个问题呢?使用AOP编程。

AOP

入门

AOP全称为Aspect-oriented programming,很明显这是相对于Object-oriented programming而言。Aspect可以翻译为“切面”或者“侧面”,所以AOP也就是面向切面编程。

怎么理解切面?

在面向对象编程中,我们定义的类通常是领域模型,它的拥有的方法通常是和纯粹的业务逻辑相关。比如:

Class Person
{
private int money;
public void pay(int price)
{
this.money = this.money – price;
}
}

但通常实际情况会更复杂,比如我们需要在付款的pay方法中加入授权检测,或者用于统计的日志发送,甚至容错代码。于是代码会变成这样:

Class Person{private int moneypublic void pay(price){try{if (checkAuthorize() == true) {this.money = this.money – price;sendLog();}}catch (Exception e){
}}}

更可怕的是,其他的方法中也要添加相似的代码,这样以来代码的可维护性和可读性便成了很大的问题。我们希望把这些零散但是公共的非业务代码收集起来,更友好的使用和管理他们,这便是切面编程。切面编程在避免修改远代码的基础上实现了代码的复用。就好比把不同的对象横向剖开,关注于内部方法改造。而面向对象编程更关注的是整体的架构设计。

实现

在上一节中介绍的duck punch与切面编程类似,都是在改造原方法的同时保证原方法功能。但就像结尾说的一样,直接修改原方法的模式有悖于面向对象最佳实践的原则。

Javascript可以采用装饰者模式(给原对象添加额外的职责但避免修改原对象)实现AOP编程。注意在这里强调的是实现,我进一步想强调的是,切面编程只是一种思想,而装饰者模式只是实践这种思想的一种手段而已,比如在Java中又可以采用代理模式等。切面编程在Java中发挥的余地更多,也更标准,本想把Java的实现模式也搬来这篇文章中,但不才Java水平有限,对Java的实现不是非常理解。在这里就只展示Javascript的实现。

AOP中有一些概念需要介绍一下,虽然我们不一定要严格执行

· joint-point:原业务方法;

· advice:拦截方式

· point-cut:拦截方法

关于这三个概念我们可以串起来可以这么理解:

当我们使用AOP改造一个原业务方法(joint-point)时,比如加入日志发送功能(point-cut),我们要考虑在什么情况下(advice)发送日志,是在业务方法触发之前还是之后;还是在抛出异常的时候,还是由日志发送是否成功再决定是否执行业务方法。

比如gihub上的meld这个开源项目,就是一个很典型的AOP类库,我们看看它的API:

// 假设我们有一个对象myObject, 并且该对象有一个doSomething方法:

var myObject = {
doSomething: function(a, b) {
return a + b;
}
};

// 现在我们想拓展它,在执行那个方法之后打印出刚刚执行的结果:

var remover = meld.after(myObject, ‘doSomething’, function(result) {
console.log(‘myObject.doSomething returned: ‘ + result);
});

// 试试执行看:

myObject.doSomething(1, 2); // Logs: “myObject.doSomething returned: 3″

// 这个时候我们想移除刚刚的修改:

remover.remove();

由此可以看出,AOP接口通常需要三个参数,被修改的对象,被修改对象的方法(joint-point),以及触发的时机(adivce),还有触发的动作(point-cut)。上面说了那么多的概念,现在可能要让各位失望了,Javascript的实现原理其实非常简单

function doAfter(target, method, afterFunc){
var func = target[method];
return function(){
var res = func.apply(this, arguments);
afterFunc.apply(this, arguments);
return res;
};
}

当然,如果想看到更完备的解决方案和代码可以参考上面所说的meld项目


本文由职坐标整理并发布,了解更多内容,请关注职坐标WEB前端JavaScript频道!

本文由 @沉沙 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式AI+学习就业服务平台 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved