在不知道JavaScript对象的键的情况下,我如何将…

var obj = {
   param1: 'something',
   param2: 'somethingelse',
   param3: 'another'
}

obj[param4] = 'yetanother';

…到…

var str = 'param1=something&param2=somethingelse&param3=another&param4=yetanother';

...?


当前回答

使用Axios和无限深度:

<pre> <style> textarea { width: 80%; margin-bottom: 20px; } label { font-size: 18px; font-weight: bold; } </style> <label>URI</label> <textarea id="uri" rows="7"></textarea> <label>All Defaults (Bonus): </label> <textarea id="defaults" rows="20"></textarea> </pre> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <script> const instance = axios.create({ baseUrl: 'http://my-api-server', url: '/user' }) const uri = instance.getUri({ params: { id: '1234', favFruits: [ 'banana', 'apple', 'strawberry' ], carConfig: { items: ['keys', 'laptop'], type: 'sedan', other: { music: ['on', 'off', { foo: 'bar' }] } } } }) const defaults = JSON.stringify(instance.defaults, null, 2) document.getElementById('uri').value = uri document.getElementById('defaults').value = defaults </script>

祝你好运…

其他回答

我需要处理嵌套对象和数组的东西。

const Util = {
  isArray: function(val) {
    return Object.prototype.toString.call(val) === '[object Array]';
  },
  isNil: function(val) {
    return val === null || Util.typeOf(val)
  },
  typeOf: function(val, type) {
    return (type || 'undefined') === typeof val;
  },
  funEach: function(obj, fun) {
    if (Util.isNil(obj))
      return;      // empty value

    if (!Util.typeOf(obj, 'object'))
      obj = [obj]; // Convert to array

    if (Util.isArray(obj)) {
      // Iterate over array
      for (var i = 0, l = obj.length; i < l; i++)
        fun.call(null, obj[i], i, obj);
    } else {
      // Iterate over object
      for (var key in obj)
        Object.prototype.hasOwnProperty.call(obj, key) && fun.call(null, obj[key], key, obj);
    }
  }
};

const serialize = (params) => {
  let pair = [];

  const encodeValue = v => {
    if (Util.typeOf(v, 'object'))
      v = JSON.stringify(v);

    return encodeURIComponent(v);
  };

  Util.funEach(params, (val, key) => {
    let isNil = Util.isNil(val);

    if (!isNil && Util.isArray(val))
      key = `${key}[]`;
    else
      val = [val];

    Util.funEach(val, v => {
      pair.push(`${key}=${isNil ? "" : encodeValue(v)}`);
    });
  });

  return pair.join('&');
};

用法:

serialize({
  id: null,
  lat: "27",
  lng: "53",
  polygon: ["27,53", "31,18", "22,62", "..."]
}); // "id=&lat=27&lng=53&polygon[]=27%2C53&polygon[]=31%2C18&polygon[]=22%2C62&polygon[]=..."

由于我对递归函数做了这么大的研究,下面是我自己的版本。

function objectParametize(obj, delimeter, q) {
    var str = new Array();
    if (!delimeter) delimeter = '&';
    for (var key in obj) {
        switch (typeof obj[key]) {
            case 'string':
            case 'number':
                str[str.length] = key + '=' + obj[key];
            break;
            case 'object':
                str[str.length] = objectParametize(obj[key], delimeter);
        }
    }
    return (q === true ? '?' : '') + str.join(delimeter);
}

http://jsfiddle.net/userdude/Kk3Lz/2/

如果你使用jQuery,这是它用来参数化GET XHR请求的选项:

$.param( obj )

http://api.jquery.com/jQuery.param/

功能性方法。

var kvToParam = R.mapObjIndexed((val, key) => { 返回'&' + key + '=' + encodeURIComponent(val); }); var objToParams = R.compose( R.replace (/^&/, '?'), R.join(”), R.values, kvToParam ); 变量o = { 用户名:“sloughfeg9', 密码:澳大利亚 }; console.log (objToParams(的); < script src = " https://cdnjs.cloudflare.com/ajax/libs/ramda/0.22.1/ramda.min.js " > < / >脚本

const obj = { id: 1, name: 'Neel' }; 设 str = ''; str = Object.entries(obj).map(([key, val]) => '${key}=${val}').join('&'); console.log(str);