美文网首页
ES学习笔记

ES学习笔记

作者: Faye大白菜 | 来源:发表于2017-08-19 16:37 被阅读0次

    [摘抄自网络]

    箭头函数

    箭头函数中的this
    箭头函数看上去是匿名函数的一种简写,但实际上,箭头函数和匿名函数有个明显的区别:箭头函数内部this是词法作用于,由上下文确定。
    由于JavaScript函数对this绑定的错误处理,下面的例子无法得到预期结果:
    以前正确的写法是:

     var obj = {
         birth : 1990,
         getAge : function(){
              var self = this;
              var b = this.birth;   //1990
              var fn = function(){
                return new Date().getFullYear() - self.birth;
              };
              return fn()
         }  
    }
    

    现在使用箭头函数的写法:
    箭头函数完全修复了this的指向,this总是指向词法作用域,也就是外层调用者的obj

    var obj = {
       birth : 1990,
       getAge : function(){
         var b = this.birth;
         var fn = () => new Date().getFullYear() - this.birth; //this指向obj对象
       }
    }
    

    由于this在箭头函数中已经按照词法作用域绑定了,所以,用call()或者apply()调用箭头函数时,无法对this进行绑定,即传入的第一个参数就被忽略:

    var obj = {
       birth : 1990,
       getAge : function(year){
          var b = this.birth;
          var fn = (y) => y-this.birth; //this.birth 仍是1990
          return fn.call({birth:2000}, year); 
       }
    };
    obj.getAge(2015);//25

    相关文章

      网友评论

          本文标题:ES学习笔记

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