有没有一种简单的方法可以将复杂的 JS 对象转换为查询参数？

Question

我有一个嵌套数组的JS对象，以这个为例：

{
   array: [
    {
        name: 'test-1'
    },
    {
        name: 'test-2'
    }
   ]
   simpleParam: 1,
   complexParam: {
    attribute: 2
   }
}

我需要将其转换为查询参数，因为我正在使用的 API 需要以下列格式读取它们：

"array[0].name='test-1'&array[1].name='test-2'&simpleParam=1&complexParam.attribute=2"

我想知道是否有像 JSON.stringify() 这样的简单方法，在这种情况下不符合我的需要，或者我是否需要编写自己的通用算法来完成这种转变。

编辑我想使用纯 JS，重要的是要注意我要格式化的对象中有数组

Answer 1

您可以使用 jQuery.param() 和 decodeURI() 这样做，希望输出是您要查找的内容。

var myObj = {
   array: [
    {
        name: 'test-1'
    },
    {
        name: 'test-2'
    }
   ],
   simpleParam: 1,
   complexParam: {
    attribute: 2
   }
};

console.log(decodeURI($.param(myObj)));
// array[0][name]=test-1&array[1][name]=test-2&simpleParam=1&complexParam[attribute]=2

Answer 2

这来自 class 我为别的东西写的：

var data = {
  array: [{
      name: 'test-1'
    },
    {
      name: 'test-2'
    }
  ],
  simpleParam: 1,
  complexParam: {
    attribute: 2
  }
};

var urlstring = stringifyObject(data);

console.log(urlstring);
console.log(decodeURIComponent(urlstring));

/**
 * Provided an object, it will convert it to a query string
 * @param data object to convert
 * @returns query string
 */
function stringifyObject(data) {
  var value, key, tmp = [];
  const encodeFunc = data => encodeURIComponent('' + data).replace(/!/g, '%21')
    .replace(/'/g, '%27').replace(/\(/g, '%28').replace(/\)/g, '%29')
    .replace(/\*/g, '%2A').replace(/%20/g, '+');
  const _hbqHelper = (key, val) => {
    var k, tmp = [];
    if (val === true) val = '1';
    else if (val === false) val = '0';
    if (val !== null) {
      if (typeof val === 'object') {
        for (k in val)
          if (val[k] !== null)
            tmp.push(_hbqHelper(key + '[' + k + ']', val[k], '&'));
        return tmp.join('&');
      } else if (typeof val !== 'function') return encodeFunc(key) + '=' + encodeFunc(val);
      else return false;
    } else return '';
  };
  for (key in data) {
    value = data[key];
    var query = _hbqHelper(key, value, '&');
    if (query === false) continue;
    if (query !== '') tmp.push(query)
  }
  return tmp.join('&');
}

有没有一种简单的方法可以将复杂的 JS 对象转换为查询参数？

Is there a simple way to convert a complex JS object to query params?

javascript

arrays

query-parameters