談談神秘的動態傳參？

談談神秘的動態傳參？

今天是星期天，本來想躺屍一天，無奈宿舍太悶，來到公司想玩玩遊戲卻又沒有心情，突然想到還有知乎可以分享技術的東西，也就抱著順氣自然地心情寫吧，希望這樣心情能好受一點。對了，今天廣州的天氣因為下了點雨的緣故略顯得有些悶了，同時，也希望寫完這篇短文後準備去珠江邊跑步的我不會太受到這個的影響。 順便題外話一句（西部世界這部美劇簡直神！！）

好了，言歸正傳。我們開始說一說今天的主題，如何實現動態傳參的問題？，說實話，剛開始工作不久聽到後端同時提到這個字眼時，自己也愣了一跳。動態傳參什麼鬼？這麼高大上?

仔細一想，其實字面意思也能理解，也就是把參數根據特定的條件傳給後端，寫寫判斷也就完了。

繼續，對白開始。。。

說到動態傳參其實需要有一定前端基礎，首先就是請求咯。不同的公司對於請求的封裝不同，但都逃離不開一個本質就是http啦！ 自問？那麼怎麼封裝呢？ 答：不好意思，封裝不是今天的主題，你只需要有一個請求封裝的概念就行了。

有了封裝的概念後無非就是把前段需要傳給後端的參數通過封裝後的介面傳給後端，先來個小demo，對參數進行判斷。

/**

* 渠道列表

*/

function queryChannelList (a, b, c, d, token) {

return this.instance.get(/api/v2/channels, {

params: {

id: a,

name: b,

city: c,

work: d

},

token

})

}

說明：這個請求的instance是一個host的封裝（每個公司不盡相同，暫理解為請求的部分吧），然後，請求的參數要求傳入4個參數和一個token（類似身份證驗證，讀者不必深究）。現在有個需求是這樣的，要求a為空時就不傳，不為空時就傳。 聰明的你很快想到，加個判斷吧！於是乎這樣寫：

/**

* 渠道列表

*/

queryChannelList (a, b, c, d, token) {

let obj = {},

if (a) {

obj = {

id: a,

name: b,

city: c,

work: d

}

} else {

obj = {

name: b,

city: c,

work: d

}

}

return this.instance.get(/api/v2/channels, {

params: obj,

token

})

},

這個代碼很容易懂（不懂？ 對你無語。。。）,但是又有一個問題來了，如何以後要求b和c也要加入和a一樣的判斷怎麼辦呢？ 不會是if （a） {if { b } { if { c } }} 吧？， 如果你這麼寫，只能跟你說，沒錯！！！可以實現，但是太挫，太丑，太low，太不靈活，太冗餘。

來來來，這樣寫吧！

let handles = (orign) => {

let param = orign

Object.keys(param).forEach((v) => {

if (param[v] === )

delete param[v]

})

return param

}

queryChannelList (a, b, c, d, token) {

let param = handles({

id: a,

name: b,

city: c,

work: d

})

return this.instance.get(/api/v2/channels, {

params: param,

token

})

}

懂了沒？？ 還不懂的話，請留言。。。看到樓主會回復

推薦閱讀：