「JavaScript学习笔记」AOP(面向切面程序)

2018-09-11  本文已影响0人  这名字真不对

AOP(面向切面程序)

把一些和核心业务逻辑无关的功能抽离出来,通过动态植入的方式参入业务逻辑模块当中。
一般无关的功能包括:日志统计、安全控制、异常处理

动态植入函数

思路是包装原函数,返回一个函数,带上需要注入的函数,需要注意this的指向

Function.prototype.before = function (beforeFn) {
  var self = this 
  // 原函数调用原型方法,使得self 指向原函数,这里主要是用于保存一个原函数的指向
  // 如果通过其他方式实现的话,可以使用其他方式保存原函数
  
  return function () {
    beforeFn.apply(this, arguments) 
    // beforeFn就是要注入的函数,这里的this arguments是注入后,调用时获取的this
    
    return self.apply(this, arguments)
    // 原函数执行, this指向注入后返回函数的执行时的this,返回结果
  }
}


Function.prototype.after=function(afterFn){
    var self=this  
    return function(){ 
        var ret=self.apply(this, arguments)
        afterFn.apply(this, arguments) 
        return ret
    }
}
// 基本逻辑与前面相同,只是执行顺序是先执行原函数,再执行注入的函数

// 调用

var fn = function () {
  console.log('fn do something')
}
fn = fn.before(function () {
  console.log('before')
}).after(function () {
  console.log('after')
})

fn() 
// 'before'
// 'fn do something'
// 'after'


// 不用原型实现
var injectBefore = function (originalFn, beforeFn) {
  return function () {
    beforeFn.apply(this, arguments) 
    return originalFn.apply(this, arguments)
  }
}

var injectAfter = function (originalFn, afterFn) {
  return function () {
    var ret = originalFn.apply(this, arguments)
    afterFn.apply(this, arguments) 
    return ret
  }
}

参考: https://juejin.im/post/59be38a2f265da0660296eeb

上一篇下一篇

猜你喜欢

热点阅读