js拼接字符串

http請求(特別是get請求)或者跳轉頁面需要拼接URL請求字符串,而經常性的思維就是利用“+”進行字符串拼接:

  1. var baseUrl = 'www.google.com'

  2. var a = 1, b = 'request', c = true

  3. var finalUrl = baseUrl + '?a=' + a + '&b=' + b + '&c=' + c

高級一點就是使用es6 ““”進行拼接:

const finalUrl = `${baseUrl}?a=${a}&b=${b}&c=${c}`
  •  

還有一種推薦的寫法,也非常適用於實際項目開發,那就是將對象形式轉化爲URL請求字符串的代碼提取成爲一個工具函數,需要的時候import就可以了:

  1. /**

  2. * 拼接對象爲請求字符串

  3. * @param {Object} obj - 待拼接的對象

  4. * @returns {string} - 拼接成的請求字符串

  5. */

  6. export function encodeSearchParams(obj) {

  7. const params = []

  8.  
  9. Object.keys(obj).forEach((key) => {

  10. let value = obj[key]

  11. // 如果值爲undefined我們將其置空

  12. if (typeof value === 'undefined') {

  13. value = ''

  14. }

  15. // 對於需要編碼的文本(比如說中文)我們要進行編碼

  16. params.push([key, encodeURIComponent(value)].join('='))

  17. })

  18.  
  19. return params.join('&')

  20. }

然後使用的姿勢:

  1. const obj = {

  2. a: 1,

  3. b: 'request',

  4. c: true,

  5. }

  6.  
  7. const finalUrl = `${baseUrl}?${encodeSearchParams(obj)}`

再也不用重複寫那些煩人的單雙引號和${}佔位符了

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章