将URL参数转换为JavaScript对象

Question

将URL参数转换为JavaScript对象我有一根这样的绳子：abc=foo&def=%5Basf%5D&xyz=5如何将其转换为这样的JavaScript对象？{   abc: 'foo',   def: '[asf]',   xyz: 5}

Answer 1

编辑

此编辑改进并解释了基于注释的答案。

var search = location.search.substring(1);JSON.parse('{"' + decodeURI(search).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g,'":"') + '"}')

例

解析abc=foo&def=%5Basf%5D&xyz=5分五个步骤：

• decdeURI：abc=foo&def=[asf]&xyz=5
• 转义引号：相同，因为没有引号
• 替换&：

  abc=foo","def=[asf]","xyz=5

• 取代=：

  abc":"foo","def":"[asf]","xyz":"5

• 有卷曲和引号：

  {"abc":"foo","def":"[asf]","xyz":"5"}

这是合法的JSON。

阿改进解允许搜索字符串中的更多字符。它使用一个REVERVER函数对URI进行解码：

var search = location.search.substring(1);JSON.parse('{"' + search.replace(/&/g, '","').replace(/=/g,'":"') + '"}', function(key, value) { return key===""?value:decodeURIComponent(value) })

例

search = "abc=foo&def=%5Basf%5D&xyz=5&foo=b%3Dar";

施予

Object {abc: "foo", def: "[asf]", xyz: "5", foo: "b=ar"}

原始答案

单线：

JSON.parse('{"' + decodeURI("abc=foo&def=%5Basf%5D&xyz=5".replace(/&/g, "\",\"").replace(/=/g,"\":\"")) + '"}')

Answer 2

从ES6和ON开始，Javascript提供了几个构造，以便为这个问题创建一个可执行的解决方案。

这包括使用URLSearchParams和迭代器

let params = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');params.get("abc"); // "foo"

如果用例要求实际将其转换为对象，则可以实现以下功能：

function paramsToObject(entries) {
  let result = {}
  for(let entry of entries) { // each 'entry' is a [key, value] tupple
    const [key, value] = entry;
    result[key] = value;
  }
  return result;}

基本演示

const urlParams = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');const entries = urlParams.entries(); //returns an iterator of decoded [key,value] tuplesconst params = paramsToObject(entries); //{abc:"foo",def:"[asf]",xyz:"5"}

使用Object.From Entry和Side

我们可以用Object.fromEntry(目前处于第4阶段)，paramsToObject带着Object.fromEntries(entries).

因为URLParams返回可迭代对象，使用扩展算子而不是打电话.entries还将根据其规范生成条目：

要迭代的值对是列表名称-值对，键是名称，值是值。

const urlParams = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');const params = Object.fromEntries(...params); // {abc: "foo", def: "[asf]", xyz: "5"}

注：所有值都自动为字符串，按照URLSearchParams规范

Answer 3

裂开&若要获取名称/值对，请将每对拆分为=..下面是一个例子：

var str = "abc=foo&def=%5Basf%5D&xy%5Bz=5"var obj = str.split("&").reduce(function(prev, curr, i, arr) {
    var p = curr.split("=");
    prev[decodeURIComponent(p[0])] = decodeURIComponent(p[1]);
    return prev;}, {});

另一种方法是使用正则表达式：

var obj = {}; str.replace(/([^=&]+)=([^&]*)/g, function(m, key, value) {
    obj[decodeURIComponent(key)] = decodeURIComponent(value);});

这是从约翰·雷西格的作品中改编而来的“搜索而不替换”.