ES学习笔记

[摘抄自网络]

箭头函数

箭头函数中的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
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 函数参数的默认值 基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。 上面代码检查函数l...
    呼呼哥阅读 3,494评论 0 1
  • 《你不知道的JavaScript》系列丛书给出了很多颠覆以往对JavaScript认知的点, 读完上卷,受益匪浅,...
    牧云云阅读 1,187评论 0 18
  • 本文是大神廖雪峰的JavaScript教程学习笔记。并不是教程,如有需要,请前往廖雪峰大神大博客. 一、函数定义和...
    0o冻僵的企鹅o0阅读 512评论 1 3
  • 函数函数定义与调用变量作用域全局变量方法高阶函数闭包箭头函数$generator$ 函数 函数定义与调用 定义函数...
    染微言阅读 629评论 0 5
  • 1 好久没有遇到神人了,今天在见客户的车上遇到一位�先生,在那里夸夸其谈。 所讲到的比较冷门的知识是大家听不懂的。...
    杨庆瑞阅读 268评论 0 2