javascript如何獲取function的形參？

作為一個每天與JavaScript打交道的前端開發，雖然明知這樣的問題沒人看?，但還是忍不住要答一波以正視聽。

既然題主強調是“形參(形式參數，formal parameters)”，那我覺得回答說用arguments對象的肯定都不對。arguments是“實參(實際參數，actual parameters)”。

形參: 函數聲明時指定的參數聲明列表。實參: 函數調用時傳遞進來的參數列表。

有了以上的概念，再來看題主的問題“javascript如何獲取function的形參”。題主其實是想做類似反射的操作，給定一個函數變量，然后得到該函數定義時的參數聲明列表。

首先，如果題主并非真的想拿到每個實參的詳細信息，而是只需要實參個數，那么簡單的使用length屬性就可以了。這個方式，對箭頭函數(arrow function)也是適用的。

如果題主真的想拿到每個實參的詳細信息，那就比較有意思了，因為JavaScript里目前并沒有提供直接的方式來實現這個操作，甚至最新的Reflect也幫不上什么忙。好在function的toString方法可以以字符串方式返回函數定義時的代碼，這就提供了一個突破口（jiu ming dao cao），可以從function的定義里自行解析出參數列表。

而這也是流行的框架AngularJS實現基于形參的依賴注入(DI)的關鍵。這里直接給出AngularJS里的相關代碼片段。

從代碼中可以看到，該方法調用了toString拿到function的定義，使用正則來去除注釋并提取形參列表。該實現也同時具備處理箭頭函數的能力。

可以看到，這個方法相當的高效，而且兼容性也相當不錯，即使參數中存在默認值、解構、可變參數等ES6的新語法，也不會出錯，但也不會給出進一步的信息。

如果需要提取參數默認值、分析解構、或者判斷是否為可變參數，則需要進一步的逐個分析，這里不再展開討論。但有個相當簡便的方法是，使用JavaScript語法分析器來解析，例如esprima，但可能會有較大的性能開銷（可參考https://stackoverflow.com/questions/1007981/how-to-get-function-parameter-names-values-dynamically）。

另外，如果代碼經過壓縮，則這種方法就失效了。Angular.js的解決方法是在需要注入的地方，接收一個手動輸入的數組作為函數的參數描述（也可以通過給函數設置靜態屬性提供注入信息），從而不受壓縮的影響。但這樣增加了開發人員的工作量（每個參數列表都需要重復兩遍）。因此，有人開發了叫做ng-annotate的工具，可以集成的構建工具里自動為方法添加參數描述信息。

覺得不錯請轉發、點贊。

歡迎在評論區留下你的觀點。