普通函數和箭頭函數

寫在前面

函數（Function）是 JavaScript 里的‘一等公民’。是由稱為函數體的一系列語句組成。可以當做入參，出參（返回值）使用。和對象一樣，有自己的屬性和方法。區別之處在于可以被調用。數據類型是 function（用 typeof 判斷），用 Object.prototype.toString.call() 判斷是 [object Function]。如果沒有使用 retrun 語句，則默認返回 undefined。反之則函數必須使用 return 語句來指定一個要返回的值。(使用 new 關鍵字調用一個構造函數除外，不再是實例化一個對象)。函數執行時，this 關鍵字并不會指向正在運行的函數本身，而是指向調用該函數的對象。 函數表達式不會提升，因此在使用之前必須先聲明。和用 var 聲明變量不一樣。

產生原因

箭頭函數的產生原因就是在于 this 關鍵字指向問題。它很容易讓人產生疑惑，尤其是當函數調用層級比較多的時候。和傳統函數定義相比，語法也相對簡潔。并且沒有自己的this，arguments，super或 new.target。這些函數表達式更適用于那些本來需要匿名函數的地方，并且它們不能用作構造函數。箭頭函數 this 指向的固定化，并不是因為函數內部做了處理，而是因為箭頭函數在創建的時候根本就沒有自己的 this。

使用箭頭函數需要注意的點

1，函數體內的 this 對象，是定義時所在對象，而不是調用該函數的對象。 2，正因為自己本身沒有 this 對象，因此不可以用作構造函數，不能用 call()，apply()，bind()這些方法去改變 this 的指向。 3，不綁定 arguments 對象，可以使用 rest 參數來解決。 4，嚴格模式（use strict）中，指定的與 this 相關的規則都將被忽略。

var aaa = () => {'use strict';console.log(this);// window }var bbb = function() {'use strict';console.log(this);// undefined } 復制代碼

5，不能使用 new 操作符，否則會報錯

var Func = () => {}; var func = new Func(); // TypeError: Func is not a constructor 復制代碼

6，沒有 prototype 屬性

var Func = () => {}; console.log(Func.prototype); // undefined 復制代碼

7，不能用作生成器。 yield 關鍵字通常不能在箭頭函數中使用（除非是嵌套在允許使用的函數內）。 8，箭頭函數的簡寫，可以直接省略 return，在塊體中，必須使用明確的 return 語句。如果需要返回對象字面量的話，記得用圓括號包起來。

var func = () => ({num: 1}); 復制代碼

寫在后面

拋一個大佬留下的問題，有箭頭函數的 IIEF:

(() => { console.log('執行看看'); // 執行看看 })(); 復制代碼

這個是可以的，但是下面的寫法就會報錯

(() => { console.log('執行看看'); // Uncaught SyntaxError: Unexpected token ( }());復制代碼

有知道原因的小伙伴嗎？

轉載于:https://juejin.im/post/5b3c9872f265da0fa21a5e32

總結

以上是生活随笔為你收集整理的# 普通函数和箭头函数的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。