《高级前端3.5》JavaScript面向切面编程——AOP（未完）

Aspect Oriented Programming(AOP)，面向切面编程，是一个比较热门的话题。AOP主要实现的目的是针对业务处理过程中的切面进行提取，它所面对的是处理过程中的某个步骤或阶段，以获得逻辑过程中各部分之间低耦合性的隔离效果。

我们可以用JavaScript来实现面向切面，可以方便我们对代码进行无侵入式的开发。如统计某个函数的执行时间。 

 

先来看一个小例子：

//你要统计一下当前的所有的函数谁耗时最长
function test(){
    var start = new Date();
    console.log("hehe");
    var end = new Date();
    console.log(end-start);
}
test();

上面这个例子我们直接往函数内部添加了新的代码，当js中的逻辑特别多特别复杂的时候，这样就非常难看，而且万一和人家申明的变量一样，还污染了别人的代码。

由此引出下面的办法：

//你要统计一下当前的所有的函数谁耗时最长
function test(){
    console.log(2);
}
Function.prototype.before = function(fn){
    var __self = this;
    return function(){
        //this指向了调用的函数window
        //console.log(this);
        fn.apply(this, arguments);    //1
        __self.apply(__self, arguments);    //2
    }
    
};
Function.prototype.after = function(fn){
    //after 限制性本身this 再执行回调
    var __self = this;
    return function(){
        __self.apply(__self, arguments);
        fn.apply(this, arguments);
    }
    
};
//默认函数被执行2遍 test作为中专
//before回调和before一起送到after去
//after和test一起送到before去
//挂在 self=>test 执行before回调 执行Self after自己执行回调
test.before(function(){
    console.log(1);
}).after(function(){
    console.log(3);
})();

test.after(function(){
    console.log(3);
}).before(function(){
    console.log(1);
})();

 

 

再进一步延伸：

...

 

面向切面编程是进入高级前端工程师必须的一个基本技能。

这样不会导致在项目中乱插点而弄乱项目。