每日 30 秒 ⏱ 函數參數騷操做

前言

函數、參數、解構、優雅、可讀性、技巧javascript

無論是調用第三方庫或者是項目自身的函數,開發過程當中總少不了函數。能夠說函數是解放代碼的第一輩子產力,有的同窗會說了那你把類放在那裏了。其實用函數和數據同樣能夠模擬出來類,類更多的是對函數的歸集複用進行擴充升級。java

在調用函數時不得不提的就是 參數 了,不少小夥伴寫函數很容易就寫成了:git

function area (width, height) {  
    return width * height;
}
複製代碼

兩個參數還好腦子記得住,可是下面這種狀況乍辦:程序員

function infomation ( name, sex, height, birthday, color, likes, follow, age ) {
    // ...
}
複製代碼

這麼多參數每次開發調用時有使用 ide 會自動提示還好,若是沒有則有可能須要翻文檔或者跳轉到定義處查看,除了比較麻煩點外還行。github

程序員何須爲難程序員。編程

不知道你們有沒有和別人對接過開發,有的同窗開發有時候不會考慮別人是否對他的代碼有依賴,直接腦殼一拍就給你的參數順序對調了,結果代碼提交後全軍崩潰各類報錯飄紅安全

傳遞對象而不是參數列表

能夠利用 JavaScript 的對象來傳遞參數:微信

function infomation (user) {
    // user.name
}

infomation({ name: 'xiaoer', age: 18 })
複製代碼

相對於參數列表傳遞對象屬性更好記也沒有強制的順序,若是命名足夠清晰在後期維護代碼的時候甚至只要看屬性名就能夠立刻理解過來。若是其餘同窗開發新的功能也不會怕他順序亂調了,可是最好要對新加的參數作出兼容,否則仍是會讓依賴的其餘函數一路飄紅。ide

使用解構賦值

參數列表被對象替換解決了參數列表順序的問題,但是每次調用的時候都須要從對象中取值使得函數每次都要訪問對象,帶來了變量長度變長和不少無心義的賦值。再者若是調用者不當心多傳遞了參數,再不巧函數中遍歷了對象這可能會產生BUG,能夠利用解構賦值來解決:函數

function infomation ({ name, age, height }) {

}
複製代碼

這樣既對傳遞的參數作出了防護又能夠方便的使用參數。

使用默認值

你永遠不知道用戶會怎麼使用產品。

產品上線後總會出現各類奇奇怪怪的錯誤,用戶老是不按照預期進行操做產品,不斷的 BUG 傳來實在讓人難受。

其實在調用函數時咱們也是一個用戶,有的參數不能爲空可是咱們卻給出了空值,致使函數不能按預期執行。在書寫函數時應該作好別人調用函數時不按套路出牌的狀況,例如給出默認值和對數據進行轉化:

function infomation ({ name = 'anonymous', age = 0, height = 160 }) {
    // ...
}
複製代碼

固然你也可使用 TypeScript 等工具來提高編程的安全性,但 巧婦難爲無米之炊 在有的時候不是你想用就能用的,須要整個公司一塊兒進行技術的升級。

參數變爲可選參數

上面例子中的函數在 infomation({ age: 16 }) 這樣調用的狀況下,能夠按照預期的默認值執行。可是想讓這個對象也可選的時候 infomation() 將會報錯,由於沒有對象讓其解構,能夠利用 {} 來使得對象也可選:

function infomation ({ name = 'anonymous', age = 0, height = 160 } = {}) {
    // ...
}
複製代碼

重命名

有時候須要對參數進行重命名,可是已經不少地方都使用了這個參數時。能夠在函數執行最開始的時候進行重命名,可是這樣顯然不夠 geek(主要是不夠偷懶)依舊利用 解構賦值 來實現重命名:

function infomation ({ name:username = 'anonymous', age = 0, height = 160 } = {}) {
    // ...
}
複製代碼

固然 解構賦值 也能夠在日常開發中使用,方便咱們寫出 規範奇淫技巧,帶來偷懶摸魚同時也帶來優雅。

強制傳遞參數

除了使用參數默認值,也能夠對函數參數進行強制傳遞參數:

腳本
// 幫助函數
const err = ( message ) => {
    throw new Error( message );
}

// 函數
const sum = function ( num = err('first param is not defined'), otherNum = err('second param is not defined') ) {
    return num + otherNum;
}
複製代碼
調用測試
// 測試函數
// 輸出: 3
console.log(sum(1, 2));

// 測試第一個參數不傳遞
// Uncaught Error: first param is not defined
sum( undefined, 10 );

// 測試第二個參數不傳遞
// Uncaught Error: second param is not defined
sum( 10 );
複製代碼

一塊兒成長

在困惑的城市裏總少不了並肩同行的 夥伴 讓咱們一塊兒成長。

  • 若是您想讓更多人看到文章能夠點個 點贊
  • 若是您想激勵小二能夠到 Github 給個 小星星
  • 若是您想與小二更多交流添加微信 m353839115

微信公衆號

本文原稿來自 PushMeTop

相關文章
相關標籤/搜索