普通函數:
$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的詳細