zoukankan      html  css  js  c++  java
  • es6箭头函数中this

    普通函数:

    $scope.$on('$stateChangeSuccess',function(){this.list = this.getList();});

    箭头函数:

    $scope.$on('$stateChangeSuccess',()=>{this.list = this.getList();});

    上面的代码是在es6中class的constructor体中的语句。函数的作用是调用该模块中的getList函数,将函数的返回值赋值给class中的list值。从写法上来看两种不同的写法表达的意思是一样的。

    但是由于他们中调用了this这个特别的对象,其执行结果有着很大的不同:

    普通函数:报错(找不到getList方法)

    箭头函数:执行正常。

    查找原因:箭头函数和普通函数之间有一个重要的差别:箭头函数没有自己的this值,其this值是继承外域的this值。

    分析:函数function的本质也是一个对象。类似js中的Array,object,Function也是一个内部对象。js对运行function的时候也是将其当做一个对象来处理。

      如果对面向对象稍有了解的话,我们知道对象中的this是用来获取对象本身的属性或者方法的。在上面的例子中,普通函数体里的this对象取值是function里的属性或者方法,由于普通函数里并未定义getList方法,所以其会报错undefined。

      而在箭头函数中,由于其自身没有this属性,所以函数体里面的this均是从外域获取的属性或者方法,因此是正确的。

    所以箭头函数不仅仅是从外观上简化了函数的写法,更解决了普通函数中this的hack问题。

    http://www.cnblogs.com/yuzhongwusan/archive/2012/04/09/2438569.html 可以访问该篇博客了解function的详细

  • 相关阅读:
    备库归档重新传命令
    DG 参数详解
    ACTIVATE STANDBY
    Matplotlib模块:绘图和可视化
    Django总结一
    Django之用户认证—auth模块
    最长上升子序列
    Pandas模块:表计算与数据分析
    Django ORM操作

  • 原文地址:https://www.cnblogs.com/perallina/p/5795513.html
Copyright © 2011-2022 走看看