普通函数:

$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的详细

es6箭头函数中this的更多相关文章

  1. ES6 箭头函数中的 this?你可能想多了(翻译)

    箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...

  2. 深入理解ES6箭头函数中的this

    简要介绍:箭头函数中的this,指向与一般function定义的函数不同,比较容易绕晕,箭头函数this的定义:箭头函数中的this是在定义函数的时候绑定,而不是在执行函数的时候绑定. 1.何为定义时 ...

  3. es6箭头函数 this 指向问题

    es5中 this 的指向 var factory = function(){ this.a = 'a'; this.b = 'b'; this.c = { a:'a+', b:function(){ ...

  4. ES6之箭头函数中的this

    在讲箭头函数中的this之前我们先介绍一下普通函数中的this.      普通函数中的this: (1)this指向它的直接调用者 (2)默认的,非严格模式下,没找到直接调用者则指向window ( ...

  5. es6 箭头函数(arrow function) 学习笔记

    箭头函数有两个好处. 1.他们比传统函数表达式简洁. const arr = [1, 2, 3]; const squares = arr.map(x => x * x); // 传统函数表达式 ...

  6. es6箭头函数讲解

    es6箭头函数的用法 箭头函数是es6的一种函数的简写方法. 如下: var f = v = > v; //等同于 var f = function(v){ return v; } var su ...

  7. js中的this和箭头函数中的this

    一.ES6 允许使用"箭头"(=>)定义函数. // var f = v => v;// 上面的箭头函数等同于: // var f = function(v) {// ...

  8. ES6 — 箭头函数

    一 为什么要有箭头函数 我们在日常开发中,可能会需要写类似下面的代码 const Person = { 'name': 'little bear', 'age': 18, 'sayHello': fu ...

  9. 前端分享----JS异步编程+ES6箭头函数

    前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...

随机推荐

  1. JQuery1.11版本对prop和attr接口的含义分离导致问题分析

    问题背景 实验中, 在jquery1.7版本, attr("value")  和 val() 接口获取 input 控件的值, 都是一致的, 都是当前控件值. 但是 jquery1 ...

  2. js购物车计算价格

    <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta nam ...

  3. Information

    \\server01DESKTOP-RE5QEBU\pqpqlabs\\fileserverpansq@sh.pqlabs.comP1q2w3e

  4. c#与.net的简介

    c语言诞生于上世纪60年代,后来诞生了面向对象的c++,后来出现看更为精简的java,微软之后又出了c#语言.早期的c#语言和java语言类似.经过长足的发展,c#变得越来越完美. 面向对象 简单,安 ...

  5. Ugly Number II

    注意负数,所以要使用long,而不能用int 详细解释 请参见http://www.cnblogs.com/julie-yang/p/5147460.html #include<vector&g ...

  6. css样式控制鼠标滑过显示

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. http接口测试——Jmeter接口测试实例讲解

    摘要: 最近做的项目需要测试很多接口,上网查一查,发现完整讲述接口测试的资料太少,所以最近自己做完这个项目,把测试的东西整理一下和大家分享一下,希望对看到的人有所帮助     一.测试需求描述 1. ...

  8. python学习之字典

    1.字典 列表存储的数据比较单一也不够灵活,这时我们可以使用字典来存储某些多内容的数据,字典是无顺序的 1.简单的字典 book={ 'huqiang':13457412571, 'Jasper':1 ...

  9. Cheatsheet: 2015 12.01 ~ 12.31

    Mobile Setting Up the Development Environment iOS From Scratch With Swift: How to Test an iOS Applic ...

  10. Creating Custom Login Screen In Oracle Forms 10g

    Below is the example plsql unit to validate login credentials and after successful validation open a ...