美文网首页
js高阶函数模拟AOP

js高阶函数模拟AOP

作者: 积微微微 | 来源:发表于2017-07-12 00:51 被阅读67次
1.代码
    Function.prototype.before = function(beforefn) {
      let _self = this;//记录原函数
      return function(){
        console.log(this);//
        console.log(arguments);
        beforefn.call(this,arguments);//修正this值
        return _self.apply(this,arguments);
      } 
    }
    Function.prototype.after = function(afterfn) {
      let _self = this;//
      return function(){
        console.log(this);//window
        console.log(arguments);
        let ret = _self.apply(this,arguments);//修正this值,并且执行原函数
        afterfn.apply(this,arguments);
        console.log(ret);
        return ret;
      } 
    }
    let func = function(){
      console.log(2);
    }
    let func2 = func.before(function(){console.log(1)}).after(function(){console.log(3)});
    let obj = {f:func2};
    func2();
    obj.f();
2.输出结果
执行结果
3.分析

func2 = func.before(function(){console.log(1)}).after(function(){console.log(3)});
最关键之处在于这一行代码,拆开来看
func.before(function(){console.log(1)})
func调用before方法,此时在 before方法体内this指向调用before方法的对象,也就是func然后返回了一个匿名函数,此时匿名函数体内_self指向最初的func方法。
再看.after(function(){console.log(3)})
匿名函数调用after方法,在after方法体内,this指向匿名函数,_self保存的是匿名函数,然后after方法返回的仍然是一个匿名函数。在这个匿名函数内_self指向before返回的匿名函数,ret是func的返回值。

然后将返回的匿名函数赋值给func2;

直接执行func2时,this指向全局,非严格模式下默认是window
当通过对象调用时,this指向调用函数的对象。

相关文章

  • js高阶函数模拟AOP

    1.代码 2.输出结果 3.分析 func2 = func.before(function(){console.l...

  • AOP(面向切片编程)

    高阶函数 要理解AOP,那么首先要了解高阶函数,成为高阶函数需要两个条件: 函数的参数是函数 (callback回...

  • [JS函数] (Array)の高阶函数

    JS函数 高阶函数 高阶函数英文叫Higher-order function。那么什么是高阶函数? JavaScr...

  • 高阶函数实现AOP

    简介 AOP(面向切面程序)的主要作用是把一些跟核心业务逻辑模块无关的功能抽离出来,这些跟业务逻辑无关的功能通常包...

  • # 高阶组件 HOC

    高阶组件就是一个函数,且该函数接受一个组件作为参数,并返回一个新的组件。 高阶函数模拟 高阶函数就是一个接收一个函...

  • 【JS】高阶函数与函数柯里化

    高阶函数 至少满足以下条件的函数: 接受一个或多个函数作为输入 输出一个函数JS高阶函数浅析[https://gi...

  • 高级语法

    高阶函数:以其他函数作为其参数或者返回值的函数。跟JS一样,python提供了部分内置高阶函数 匿名函数:pyth...

  • 高阶组件

    高阶函数:接受一个或多个函数并返回一个函数 JS中,array的map、filter、reduce等方法就是高阶函...

  • python函数式编程

    高阶函数 把函数作为参数传入,这样的函数称为高阶函数,函数式编程就是指这种高度抽象的编程范式。与js相似,与c#中...

  • js高阶函数

    一、函数作为参数传递 1、回调函数 ajax异步请求 2、Array.prototype.sort 二、函数作为返...

网友评论

      本文标题:js高阶函数模拟AOP

      本文链接:https://www.haomeiwen.com/subject/xnevhxtx.html