JS中如何将JSON数组转化为url参数

 更新时间:2023年04月17日 14:11:07   作者:InterestAndFun  
这篇文章主要介绍了JS中如何将JSON数组转化为url参数问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

JS将JSON数组转化为url参数

有需求要用nodejs做一个爬虫工具,发送请求的时候,需要将json数据转换成url参数。在python中我们可以使用urllib.urlencode轻松来完成,在nodejs中就需要手动封装一个工具了。

本来不想努力了,在百度上随便找一个算了。但是感觉百度上的那些写得太长,一个小工具没必要牺牲那么多行代码来完成。于是就自己弄了一个。

前置知识点

  • Object.entries():返回一个数组,其元素是与直接在object上找到的可枚举属性键值对相对应的数组。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。
  • forEach: 对数组的每个元素执行一次给定的函数,可以理解相当于 for 循环的简写版(实质不只那么简单)。
  • Array.push(): 方法将一个或多个元素添加到数组的末尾,并返回该数组的新长度。
  • Array.join(): 将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目,那么将返回该项目而不使用分隔符。

代码

const converToUrl = requestParams => {
  let params = [];
  Object.entries(requestParams).forEach(([key, value]) => {
      let param = key + '=' + value;
      params.push(param);
  });
  return '?' + params.join('&');
}

实例演示

const urlUtil = require('./reqParamsConverToUrl.util');

const requestParams = {
  'name' : "zhangsan",
  'age' : 18
}

const urlParams = urlUtil.converToUrl(requestParams);
console.log(urlParams);

运行结果:

JavaScript JSON与URL参数互转

JSON转URL参数

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参数转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"}

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • js仿微博动态栏功能

    js仿微博动态栏功能

    本文主要介绍了js仿微博动态栏功能的示例代码,具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • 再谈javascript注入 黑客必备!

    再谈javascript注入 黑客必备!

    这篇文章主要为大家详细介绍了js注入,黑客之路必备!本文告诉大家js注入是什么,js注入攻防如何进行,感兴趣的小伙伴们可以参考一下
    2016-09-09
  • 利用jsonp与代理服务器方案解决跨域问题

    利用jsonp与代理服务器方案解决跨域问题

    这篇文章主要给大家介绍了关于利用jsonp与代理服务器方案解决跨域问题的相关资料,文中通过示例代码给大家介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2017-09-09
  • 一行JavaScript代码如何实现瀑布流布局

    一行JavaScript代码如何实现瀑布流布局

    这篇文章主要给大家介绍了如何通过一行JavaScript代码实现瀑布流布局的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-12-12
  • JavaScript实现把rgb颜色转换成16进制颜色的方法

    JavaScript实现把rgb颜色转换成16进制颜色的方法

    这篇文章主要介绍了JavaScript实现把rgb颜色转换成16进制颜色的方法,涉及javascript实现数制转换的相关技巧,需要的朋友可以参考下
    2015-06-06
  • js和jquery如何获取图片真实的宽度和高度

    js和jquery如何获取图片真实的宽度和高度

    按照插入的图片的尺寸来判断图片是横图还是竖图。然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度
    2014-09-09
  • 使用canvas实现仿新浪微博头像截取上传功能

    使用canvas实现仿新浪微博头像截取上传功能

    用户提供图像大小尺寸不合适,如何用截取上传呢?接下来小编教大家使用使用canvas实现仿新浪微博头像截取上传功能解决问题,需要的朋友一起学习吧。
    2015-09-09
  • js 转json格式的字符串为对象或数组(前后台)的方法

    js 转json格式的字符串为对象或数组(前后台)的方法

    下面小编就为大家带来一篇js 转json格式的字符串为对象或数组(前后台)的方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-11-11
  • 解决layer.open弹出框不能获取input框的值为空的问题

    解决layer.open弹出框不能获取input框的值为空的问题

    今天小编就为大家分享一篇解决layer.open弹出框不能获取input框的值为空的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • js密码强度实时检测代码

    js密码强度实时检测代码

    这篇文章主要为大家详细介绍了js密码强度实时检测代码,密码强度的判断, 在注册网站用户的时候, 是一个必须要做的事情,如何实现js密码强度检测,感兴趣的小伙伴们可以参考一下
    2016-03-03

最新评论