1、函數的三種角色html
1）做爲普通函數瀏覽器
2）做爲對象閉包
3）做爲類函數
ps：能夠同時存在，之間沒有任何衝突this
2、怎麼理解函數的三種角色spa
這三種角色能夠同時存在，沒有任何衝突，舉個例子prototype
// 這三種角色是沒有衝突的，看下面的例子 function Fn1() { // 這時候，Fn就是一個普通函數，形參賦值，預解釋，代碼執行 var num = 500 this.x = 100; } Fn.prototype.getX = function () { console.log(this.x); }; Fn.aaa = 1000; // 這時候，Fn就是做爲一個對象（有私有屬性，有方法，還有原型） var f = new Fn; // 這時候，Fn就是一個類，能夠經過new建立對象 ，this指向的是f！！ console.log(f.num); //->undefined 這個時候，Fn就是一個類，num是Fn做爲普通函數纔有用，num跟類徹底不要緊 console.log(f.aaa); //->undefined 這個時候，Fn就是一個類，aaa是Fn做爲對象纔有用，aaa跟類徹底沒有關係 var res = Fn(); console.log(res); //->undefined 這個時候，Fn就是一個普通函數，函數裏沒返回值，this指向的是window！！！！！！！！
上面的例子完美的解釋了，函數三種角色真的沒有任何聯繫。
感受函數真的是模擬了真實人生，就比如我帶着我爸媽，帶着我閨女，我做爲人類、做爲父親、做爲兒子，沒有任何衝突，該幹嗎幹嗎！！code
上面的代碼，能夠打印一下Fn函數裏面到底有什麼東西。htm
dir(Fn)
輸出信息以下：對象
能夠看到，Fn做爲對象，有本身的屬性值（arguments、caller、length、name、prototype、__proto__）
3、深刻理解原型
其實，上面的一二兩點，都是總結，你有想過，爲何函數會存在三種角色嗎？其實，想要理解函數的三種角色，就必須深刻探索一個完整的原型鏈的工做方式。
先看一個例子，幫助咱們理解函數的三種角色
function Fn() { this.x = 100; } Fn.prototype.getX = function () { console.log(this.x); }; var f = new Fn; console.log(f instanceof Fn); //->true console.log(f instanceof Object); //->true
簡單說明一下上面的代碼，使用的原型繼承的方式，首先聲明定義一個Fn函數類，而後再Fn函數類的原型上添加一個公有的方法getX，以後，使用new關鍵字建立一個Fn函數類的一個實例，從而f繼承了Fn的私有+公有的方法。
很明顯，f instanceof Fn 是true的，由於f是經過new Fn來建立出來的，可是爲何f instanceof Object 也是爲true呢？要回答這個問題，得理解下面的話。
1）Function是瀏覽器內置的函數類（Function也是對象），全部的函數都是Function類的一個實例
2）Object是瀏覽器內置的對象類，全部對象都是Object類的一個實例
3）全部實例，都是對象數據類型
4）根據一、2兩點，能夠知道，上面定義的Fn函數，是Function類的一個實例，那麼Fn函數其實就是一個實例，根據第3點，Fn函數就是一個對象數據類型；
同理，由於Object對象類是一個類，類其實也是就函數，因此Object對象類是Function類的一個實例。
5）根據第三、4點，能夠知道，內置類Function、內置類Object、函數Fn它們都是對象，那麼是對象會擁有__proto__屬性，因此它們都擁有__proto__屬性。
4、第三點中代碼的完整原型鏈
值得注意的是，上圖中，Function.prototype其實並非對象，是函數數據類型，很是坑爹！其實它叫作anonymous（匿名函數），沒有實際意義的一個函數，可是操做起來跟對象如出一轍。
打印Function.prototype，樣子以下所示：
5、總結
函數在整個JS中是最複雜也是最重要的知識，一個函數存在多面性，並且相互不衝突：
-> 「函數」：它自己是一個函數，執行的時候造成私有做用域（閉包），形參賦值、預解釋、代碼執行、執行完後棧內存銷燬/不銷燬；
-> 「類」： 它有本身的實例，也有一個叫作prototoype屬性是本身的原型；
-> 「普通對象」：和var obj = {} 中的obj同樣，就是一個普通的對象，它做爲對象有本身的私有屬性，也能夠經過__proto__找到Function.ptototype。
原文出處：https://www.cnblogs.com/pengshengguang/p/10817033.html