JS中如何將JSON數(shù)組轉(zhuǎn)化為url參數(shù)
JS將JSON數(shù)組轉(zhuǎn)化為url參數(shù)
有需求要用nodejs做一個(gè)爬蟲(chóng)工具,發(fā)送請(qǐng)求的時(shí)候,需要將json數(shù)據(jù)轉(zhuǎn)換成url參數(shù)。在python中我們可以使用urllib.urlencode輕松來(lái)完成,在nodejs中就需要手動(dòng)封裝一個(gè)工具了。
本來(lái)不想努力了,在百度上隨便找一個(gè)算了。但是感覺(jué)百度上的那些寫(xiě)得太長(zhǎng),一個(gè)小工具沒(méi)必要犧牲那么多行代碼來(lái)完成。于是就自己弄了一個(gè)。
前置知識(shí)點(diǎn)
Object.entries():
返回一個(gè)數(shù)組,其元素是與直接在object上找到的可枚舉屬性鍵值對(duì)相對(duì)應(yīng)的數(shù)組。屬性的順序與通過(guò)手動(dòng)循環(huán)對(duì)象的屬性值所給出的順序相同。forEach:
對(duì)數(shù)組的每個(gè)元素執(zhí)行一次給定的函數(shù),可以理解相當(dāng)于 for 循環(huán)的簡(jiǎn)寫(xiě)版(實(shí)質(zhì)不只那么簡(jiǎn)單)。Array.push():
方法將一個(gè)或多個(gè)元素添加到數(shù)組的末尾,并返回該數(shù)組的新長(zhǎng)度。Array.join():
將一個(gè)數(shù)組(或一個(gè)類(lèi)數(shù)組對(duì)象)的所有元素連接成一個(gè)字符串并返回這個(gè)字符串。如果數(shù)組只有一個(gè)項(xiàng)目,那么將返回該項(xiàng)目而不使用分隔符。
代碼
const converToUrl = requestParams => { let params = []; Object.entries(requestParams).forEach(([key, value]) => { let param = key + '=' + value; params.push(param); }); return '?' + params.join('&'); }
實(shí)例演示
const urlUtil = require('./reqParamsConverToUrl.util'); const requestParams = { 'name' : "zhangsan", 'age' : 18 } const urlParams = urlUtil.converToUrl(requestParams); console.log(urlParams);
運(yùn)行結(jié)果:
JavaScript JSON與URL參數(shù)互轉(zhuǎn)
JSON轉(zhuǎn)URL參數(shù)
function parseParams(data) { ? ? try { ? ? ? ? var tempArr = []; ? ? ? ? for (var i in data) { ? ? ? ? ? ? var key = encodeURIComponent(i); ? ? ? ? ? ? var value = encodeURIComponent(data[i]); ? ? ? ? ? ? tempArr.push(key + '=' + value); ? ? ? ? } ? ? ? ? var urlParamsStr = tempArr.join('&'); ? ? ? ? return urlParamsStr; ? ? } catch (err) { ? ? ? ? return ''; ? ? } } ?? var obj = { ? ? name: 'zhangsan', ? ? age: 100 }; parseParams(obj); //"name=zhangsan&age=100"
URL參數(shù)轉(zhuǎn)JSON
function getParams(url) { ? try { ? ? url = url.match(/\?([^#]+)/)[1]; ? ? const obj = {}; ? ? const arr = url.split('&'); ? ? for (let i = 0; i < arr.length; i++) { ? ? ? let subArr = arr[i].split('='); ? ? ? let key = decodeURIComponent(subArr[0]); ? ? ? let value = decodeURIComponent(subArr[1]); ? ? ? obj[key] = value; ? ? } ? ? return obj; ? } catch (err) { ? ? return null; ? } } var urlStr = 'http://www.xxx.com/test?name=zhangshan&age=100#hello'; getParams(urlStr); //{name: "zhangshan", age: "100"}
總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
深入理解javascript函數(shù)參數(shù)與閉包
函數(shù)是javascript的一等對(duì)象,想要學(xué)好javascript,就必須深刻理解函數(shù)。本文對(duì)javascript函數(shù)參數(shù)與閉包進(jìn)行詳細(xì)分析介紹。需要的朋友一起來(lái)看下吧2016-12-12javascript實(shí)現(xiàn)圖片輪換動(dòng)作方法
這篇文章主要介紹了javascript實(shí)現(xiàn)圖片輪換動(dòng)作方法,文章通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08js實(shí)現(xiàn)文本框支持加減運(yùn)算的方法
這篇文章主要介紹了js實(shí)現(xiàn)文本框支持加減運(yùn)算的方法,可實(shí)現(xiàn)文本框輸入加減運(yùn)算式同時(shí)右側(cè)實(shí)時(shí)顯示對(duì)應(yīng)計(jì)算結(jié)果的功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08js?剪切、復(fù)制、粘貼功能實(shí)現(xiàn)
Navigator.clipboard?API可以用來(lái)訪問(wèn)系統(tǒng)剪貼板,可以實(shí)現(xiàn)【剪切、復(fù)制、粘貼】功能。該?API?被設(shè)計(jì)用來(lái)取代使用?document.execCommand()?的剪貼板訪問(wèn)方式,不兼容?IE2023-05-05js實(shí)現(xiàn)將json數(shù)組顯示前臺(tái)table中
本文主要介紹了把JSON數(shù)組顯示在前臺(tái)的table中的方法。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01使用documentElement正確取得當(dāng)前可見(jiàn)區(qū)域的大小
如何取得當(dāng)前瀏覽器里面可見(jiàn)區(qū)域的大???其他方法都不適用,只有documentElement才可以,需要的朋友可以參考下2014-07-07微信小程序?qū)崿F(xiàn)動(dòng)態(tài)渲染Markdown示例詳解
這篇文章主要為大家介紹了微信小程序?qū)崿F(xiàn)動(dòng)態(tài)渲染Markdown示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08