装饰者模式（AOP方式来添加函数职责）

最新推荐文章于 2023-06-06 20:18:47 发布

scorpio_h

最新推荐文章于 2023-06-06 20:18:47 发布

阅读量290

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： javascript 设计模式装饰者模式

本文链接：https://blog.youkuaiyun.com/scorpio_h/article/details/109582222

javascript 专栏收录该内容

28 篇文章

订阅专栏

本文介绍了一种在JavaScript中实现面向切面编程(AOP)的方法，通过扩展Function.prototype，可以在函数执行前后添加额外的功能，例如日志记录或权限检查。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

通常，在JavaScript中实现AOP（Aspect Oriented Programming，面向切面编程，通过预编译方式和运行期间动态代理实现程序功能的统一维护的一种技术。），都是指把一个函数“动态织入”到另一个函数中，具体实现方式有很多，以下是通过扩展Function.prototype来做到者点。

    Function.prototype.before = function( beforefn ) {
      var _self = this  // 保存原函数引用
      return function() { // 返回包含原函数和新函数的“代理”函数
        beforefn.apply( this, arguments ) // 执行新函数，修正this
        return _self.apply( this, arguments ) // 执行原函数
      }
    }

    Function.prototype.after = function( afterfn ) {
      var _self = this
      return function() {
        var ret = _self.apply( this, arguments )
        afterfn.apply( this, arguments )
        return ret
      }
    }

    var func = function() {
      console.log(2)
    }

    func = func.before(function() {
      console.log(1)
    }).after(function() {
      console.log(3)
    })

    func()

func链式执行before和after，before函数里插入了打印数字1的方法，再连同func方法一起return给after函数执行，所以打印结果是1 2 3，我们把负责打印1和打印3的函数通过AOP的方式动态植入func函数。