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的详细
es6箭头函数中this的更多相关文章
- ES6 箭头函数中的 this?你可能想多了(翻译)
箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...
- 深入理解ES6箭头函数中的this
简要介绍:箭头函数中的this,指向与一般function定义的函数不同,比较容易绕晕,箭头函数this的定义:箭头函数中的this是在定义函数的时候绑定,而不是在执行函数的时候绑定. 1.何为定义时 ...
- es6箭头函数 this 指向问题
es5中 this 的指向 var factory = function(){ this.a = 'a'; this.b = 'b'; this.c = { a:'a+', b:function(){ ...
- ES6之箭头函数中的this
在讲箭头函数中的this之前我们先介绍一下普通函数中的this. 普通函数中的this: (1)this指向它的直接调用者 (2)默认的,非严格模式下,没找到直接调用者则指向window ( ...
- es6 箭头函数(arrow function) 学习笔记
箭头函数有两个好处. 1.他们比传统函数表达式简洁. const arr = [1, 2, 3]; const squares = arr.map(x => x * x); // 传统函数表达式 ...
- es6箭头函数讲解
es6箭头函数的用法 箭头函数是es6的一种函数的简写方法. 如下: var f = v = > v; //等同于 var f = function(v){ return v; } var su ...
- js中的this和箭头函数中的this
一.ES6 允许使用"箭头"(=>)定义函数. // var f = v => v;// 上面的箭头函数等同于: // var f = function(v) {// ...
- ES6 — 箭头函数
一 为什么要有箭头函数 我们在日常开发中,可能会需要写类似下面的代码 const Person = { 'name': 'little bear', 'age': 18, 'sayHello': fu ...
- 前端分享----JS异步编程+ES6箭头函数
前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...
随机推荐
- JQuery1.11版本对prop和attr接口的含义分离导致问题分析
问题背景 实验中, 在jquery1.7版本, attr("value") 和 val() 接口获取 input 控件的值, 都是一致的, 都是当前控件值. 但是 jquery1 ...
- js购物车计算价格
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta nam ...
- Information
\\server01DESKTOP-RE5QEBU\pqpqlabs\\fileserverpansq@sh.pqlabs.comP1q2w3e
- c#与.net的简介
c语言诞生于上世纪60年代,后来诞生了面向对象的c++,后来出现看更为精简的java,微软之后又出了c#语言.早期的c#语言和java语言类似.经过长足的发展,c#变得越来越完美. 面向对象 简单,安 ...
- Ugly Number II
注意负数,所以要使用long,而不能用int 详细解释 请参见http://www.cnblogs.com/julie-yang/p/5147460.html #include<vector&g ...
- css样式控制鼠标滑过显示
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- http接口测试——Jmeter接口测试实例讲解
摘要: 最近做的项目需要测试很多接口,上网查一查,发现完整讲述接口测试的资料太少,所以最近自己做完这个项目,把测试的东西整理一下和大家分享一下,希望对看到的人有所帮助 一.测试需求描述 1. ...
- python学习之字典
1.字典 列表存储的数据比较单一也不够灵活,这时我们可以使用字典来存储某些多内容的数据,字典是无顺序的 1.简单的字典 book={ 'huqiang':13457412571, 'Jasper':1 ...
- Cheatsheet: 2015 12.01 ~ 12.31
Mobile Setting Up the Development Environment iOS From Scratch With Swift: How to Test an iOS Applic ...
- Creating Custom Login Screen In Oracle Forms 10g
Below is the example plsql unit to validate login credentials and after successful validation open a ...