ES学习笔记

2017-08-19  本文已影响0人  Faye大白菜

[摘抄自网络]

箭头函数

箭头函数中的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
上一篇下一篇

猜你喜欢

热点阅读