箭头函数中this的问题

terasum 发布于2019-08-22 14:59 / 2219人阅读

摘要：有人说，是中最令人厌烦的风格的编程，虽然令人厌烦，但还是要理解且使用它，就像生活一样，总要做一些自己不喜欢或不擅长的事。

有人说，this是javascript OPP中最令人厌烦的风格的编程，
虽然令人厌烦，但还是要理解且使用它，就像生活一样，总要做一些自己不喜欢或不擅长的事。

在箭头函数出现之前，每个新定义的函数都有它自己的this值：
1、在构造函数的情况下，是一个新的对象（实例）；
2、如果该函数被称为‘对象方法’，则为该基础对象；
3、如果作为函数调用，则指向全局；

function Person() {
  // Person() 构造函数定义 `this`作为它自己的实例.
  this.age = 0;

  setInterval(function growUp() {
    // 在非严格模式, growUp()函数定义 `this`作为全局对象, 
    // 与在 Person()构造函数中定义的 `this`并不相同.
    this.age++;
  }, 1000);
}

var p = new Person();

而箭头函数不会创建自己的this,它使用封闭执行上下文的this值，因此，在下面的代码中，传递给setInterval的函数内的this与封闭函数中的this值相同：

function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| 正确地指向person 对象
  }, 1000);
}

var p = new Person();

云服务器 GPU云服务器 js中回调函数问题箭头函数 java中this javascript中this详解

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/93070.html

关于ES6中箭头函数的this问题

摘要：对象的指向是可变的，但是在箭头函数中，它是固定的。同样的由于箭头函数没有自己的所以传统的显性绑定无效内部的指向外部在的学习中，的指向问题一直是个难点，特别是在对象方法中使用时，必须更加小心。由此箭头函数在很大程度上减少了我们的困扰。什么是箭头函数用法 ES6 允许使用箭头（=>）定义函数测试 var p1 = document.getElementById(test1)...

LeviDing 2019-08-22 10:53 评论0 收藏0
ES6—箭头函数（5）

摘要：因为它不产生属于它自己上下文的箭头函数的另一个用处是简化回调函数。箭头函数使用场景箭头函数适合于无复杂逻辑或者无副作用的纯函数场景下，例如用在的回调函数定义中，另外目前等库，都大量使用箭头函数，直接定义的情况已经很少了。 0.为什么会出现箭头函数？ 1.传统的javascript函数语法并没有提供任何的灵活性，每一次你需要定义一个函数时，你都必须输入function () {},这至少...

yanwei 2019-08-23 17:20 评论0 收藏0
「前端面试题系列5」ES6 中箭头函数的用法

摘要：在这里，如果用箭头函数，可以这样改写箭头函数并没有自己的，所以事件处理函数的调用者并不受影响。比如，在需要动态上下文的场景中，使用箭头函数需要格外地小心，这些场景包括对象的方法原型方法事件的回调构造函数。 showImg(https://segmentfault.com/img/bVboce6?w=1304&h=734); 前言年味儿渐散，收拾下心情，继续敲代码吧。对于即将到来金三...

betacat 2019-08-23 15:08 评论0 收藏0
箭头函数中this的指向问题

摘要：箭头函数中指向等箭头函数箭头函数的，总是指向定义时所在的对象，而不是运行时所在的对象。关键字通常不能在箭头函数中使用除非是嵌套在允许使用的函数内。参考资料的博客可以说很厉害了图解指向什么阮一峰关于箭头函数的讨论箭头函数中this指向等箭头函数 javascript this 箭头函数的this，总是指向定义时所在的对象，而不是运行时所在的对象。箭头函数位于foo函数内部。只有...

DDreach 2019-08-22 13:53 评论0 收藏0
es6 - 箭头函数

摘要：也就是说箭头函数的的值不再根据调用时上下文确定，而是像普通变量那样根据定义时的作用域链进行查找。箭头函数中的依然要根据定义时的作用域链进行查找。知乎这篇文章对箭头函数的一些不适合的场景进行了总结，可以作为参考。 es6 - 箭头函数哇，箭头函数...，听起来好NB，但是如果你知道它是因为使用了=>这样类似箭头的符号，所以才叫箭头函数。瞬间感觉：呵，这名字起的...。 es6增加了...

13651657101 2019-08-26 11:46 评论0 收藏0
箭头函数你想知道的都在这里

摘要：没有箭头函数没有自己的对象，这不一定是件坏事，因为箭头函数可以访问外围函数的对象那如果我们就是要访问箭头函数的参数呢你可以通过命名参数或者参数的形式访问参数不能通过关键字调用函数有两个内部方法和。 1、基本语法回顾我们先来回顾下箭头函数的基本语法。ES6 增加了箭头函数： var f = v => v; // 等同于 var f = function (v) { return ...

xiaoqibTn 2019-08-23 16:44 评论0 收藏0