怎么查询-Javascript对象的字符串编码?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (10)
  • 关注 (0)
  • 查看 (115)

你知道如何快速简单地将Java script对象编码为string我可以通过GET请求?

jQuery没有其他框架--只是普通的Javascript:)

提问于
用户回答回答于

是像这样吗?

serialize = function(obj) {
  var str = [];
  for(var p in obj)
    if (obj.hasOwnProperty(p)) {
      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
    }
  return str.join("&");
}

console.log(serialize({foo: "hi there", bar: "100%" }));
// foo=hi%20there&bar=100%25

这个还转换递归对象(使用php“array”符号表示查询字符串)

serialize = function(obj, prefix) {
  var str = [], p;
  for(p in obj) {
    if (obj.hasOwnProperty(p)) {
      var k = prefix ? prefix + "[" + p + "]" : p, v = obj[p];
      str.push((v !== null && typeof v === "object") ?
        serialize(v, k) :
        encodeURIComponent(k) + "=" + encodeURIComponent(v));
    }
  }
  return str.join("&");
}

console.log(serialize({foo: "hi there", bar: { blah: 123, quux: [1, 2, 3] }}));
// foo=hi%20there&bar%5Bblah%5D=123&bar%5Bquux%5D%5B0%5D=1&bar%5Bquux%5D%5B1%5D=2&bar%5Bquux%5D%5B2%5D=3
用户回答回答于

Rails/PHP风格查询生成器

此方法将Javascript对象转换为URI Query String也处理嵌套数组和对象(在Rails/PHP(语法):

function serializeQuery(params, prefix) {
  const query = Object.keys(params).map((key) => {
    const value  = params[key];

    if (params.constructor === Array)
      key = `${prefix}[]`;
    else if (params.constructor === Object)
      key = (prefix ? `${prefix}[${key}]` : key);

    if (typeof value === 'object')
      return serializeQuery(value, key);
    else
      return `${key}=${encodeURIComponent(value)}`;
  });

  return [].concat.apply([], query).join('&');
}

示例用法:

let params = {
  a: 100,
  b: 'has spaces',
  c: [1, 2, 3],
  d: { x: 9, y: 8}
}

serializeQuery(params)
// returns 'a=100&b=has%20spaces&c[]=1&c[]=2&c[]=3&d[x]=9&d[y]=8
用户回答回答于

以下是CoffeeScript版本的解决方案。

serialize = (obj, prefix) ->
  str = []
  for p, v of obj
    k = if prefix then prefix + "[" + p + "]" else p
    if typeof v == "object"
      str.push(serialize(v, k))
    else
      str.push(encodeURIComponent(k) + "=" + encodeURIComponent(v))

  str.join("&")
用户回答回答于
用户回答回答于

你需要发送任意对象吗?如果是这样的话,GET是个坏主意,因为用户代理和Web服务器所接受的URL长度是有限制的。我的建议是构建一个名称-值对数组以发送,然后构建一个查询字符串:

function QueryStringBuilder() {
    var nameValues = [];

    this.add = function(name, value) {
        nameValues.push( {name: name, value: value} );
    };

    this.toQueryString = function() {
        var segments = [], nameValue;
        for (var i = 0, len = nameValues.length; i < len; i++) {
            nameValue = nameValues[i];
            segments[i] = encodeURIComponent(nameValue.name) + "=" + encodeURIComponent(nameValue.value);
        }
        return segments.join("&");
    };
}

var qsb = new QueryStringBuilder();
qsb.add("veg", "cabbage");
qsb.add("vegCount", "5");

alert( qsb.toQueryString() );
用户回答回答于

一些小修正:

serialize = function(obj) {
   var str = [];
   for(var p in obj){
       if (obj.hasOwnProperty(p)) {
           str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
       }
   }
   return str.join("&");
}

检查对象上的hasOwnProperty使JSLint/JSHint很高兴,如果对象不是简单的字典,它可以防止意外地序列化对象的方法或其他东西。关于本页中的声明,见关于以下段落:http://javascript.crockford.com/code.html

用户回答回答于

使用Node.js v6.6.3

const querystring = require('querystring')

const obj = {
  foo: 'bar',
  baz: 'tor'
}

let result = querystring.stringify(obj)
// foo=bar&baz=tor

参考资料:https://nodejs.org/api/querystra.html

用户回答回答于

这是ES6的一条liner:

Object.keys(obj).map(k => `${encodeURIComponent(k)}=${encodeURIComponent(obj[k])}`).join('&');
用户回答回答于
Object.keys(obj).reduce(function(a,k){a.push(k+'='+encodeURIComponent(obj[k]));return a},[]).join('&')

它在语义上与公认的答案相匹配,它将是一个更受欢迎的答案:

function serialize( obj ) {
  return '?'+Object.keys(obj).reduce(function(a,k){a.push(k+'='+encodeURIComponent(obj[k]));return a},[]).join('&')
}
用户回答回答于

jQuery有一个函数,jQuery.param(),如果你已经在使用它,你可以使用这个:http://api.jquery.com/jquery.param/

例子:

var params = { width:1680, height:1050 };
var str = jQuery.param( params );

str现在包含width=1680&height=1050

扫码关注云+社区

领取腾讯云代金券