【问题标题】:Make a JavaScript array from URL从 URL 创建一个 JavaScript 数组
【发布时间】:2011-05-16 21:56:49
【问题描述】:

我需要从 URL 中创建一个 Javascript 数组,例如:

转这个:

http://maps.google.com/maps/api/staticmap?center=Baker Street 221b, London&size=450x450&markers=Baker Street 221b, London&sensor=false

变成这样的:

array['center'] = Baker Street 221b, London
array['size'] = 450x450
// and so on...

我需要使这个序列化/反序列化双向工作(url 到数组和数组到 url 的一部分)。是否有一些内置函数可以做到这一点?

提前致谢!

【问题讨论】:

  • 可能重复:stackoverflow.com/questions/2090551/… 这个其他问题不讨论序列化(仅反序列化)。
  • 这不是一个真正的数组,它是一个具有属性的对象。换句话说,符号是正确的,但术语是错误的。
  • @Pointy:是的,但我实际上认为“(关联)数组”比“对象”更具可读性,并且可以理解。
  • @casablanca 我不反对,但问题明确地说,“JavaScript 数组”,但真正描述的不应该是 Array 实例。

标签: javascript url


【解决方案1】:

数组的URL:(改编自my answer here

function URLToArray(url) {
    var request = {};
    var pairs = url.substring(url.indexOf('?') + 1).split('&');
    for (var i = 0; i < pairs.length; i++) {
        if(!pairs[i])
            continue;
        var pair = pairs[i].split('=');
        request[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
     }
     return request;
}

数组到 URL:

function ArrayToURL(array) {
  var pairs = [];
  for (var key in array)
    if (array.hasOwnProperty(key))

      pairs.push(encodeURIComponent(key) + '=' + encodeURIComponent(array[key]));
  return pairs.join('&');
}

【讨论】:

  • 我不需要解析位置,而是一个包含 URL 的变量。我尝试运行它(将位置替换为变量名)并且它“挂起”在这一行 var pairs = location.search.substring(1).split('&');
  • @skazhy:我已经编辑了函数以接受参数。
  • 感谢您提供此解决方案,它非常适合我的需要 [仅需要第一个功能]。我打算将 URI.js 与 jQuery 一起使用,但这是一个更简单、更有说服力的解决方案。
  • 不错的功能,但如果您的 url 字符串中有类似 elem[]=23&elem[]=55;
  • 谢谢!这很好用。但是,如果您给它一个不带参数的 URL,它会返回对象中的 URL:{http://example.com: "undefined"}。我稍作修改以返回未定义:var qIndex = url.indexOf('?'); if(qIndex == -1){ return undefined; } var pairs = url.substring(qIndex + 1).split('&amp;');
【解决方案2】:

当 url 字符串有 elem[]=23&elem[]=56.. 时,上述函数 URLToArray 不起作用。 请参阅下面的改编功能...希望它可以正常工作 - 不是 100% 测试

function URLToArray(url) {
        var request = {};
        var arr = [];
        var pairs = url.substring(url.indexOf('?') + 1).split('&');
        for (var i = 0; i < pairs.length; i++) {
          var pair = pairs[i].split('=');

          //check we have an array here - add array numeric indexes so the key elem[] is not identical.
          if(endsWith(decodeURIComponent(pair[0]), '[]') ) {
              var arrName = decodeURIComponent(pair[0]).substring(0, decodeURIComponent(pair[0]).length - 2);
              if(!(arrName in arr)) {
                  arr.push(arrName);
                  arr[arrName] = [];
              }

              arr[arrName].push(decodeURIComponent(pair[1]));
              request[arrName] = arr[arrName];
          } else {
            request[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
          }
        }
        return request;
    }

endWith 取自here

function endsWith(str, suffix) {
    return str.indexOf(suffix, str.length - suffix.length) !== -1;
}

【讨论】:

    【解决方案3】:
     /**
     * (C)VIOLONIX inc.
     * Parser for make multidim array from
     * foo[]=any&foo[]=boy, or foo[0][kids]=any&foo[1][kids]=boy
     * result: foo=[[any],[boy]] or foo=[kids:[any],kids:[boy]]
     */    
    
     var URLToArray = function(url){
            function parse_mdim(name, val, data){
                let params = name.match(/(\[\])|(\[.+?\])/g);
                if(!params)params = new Array();
                let tg_id = name.split('[')[0];
    
    
                if(!(tg_id in data)) data[tg_id] = [];
                var prev_data = data[tg_id];
    
                for(var i=0;i<params.length;i++){
                    if(params[i]!='[]'){
                        let tparam = params[i].match(/\[(.+)\]/i)[1];
                        if(!(tparam in prev_data)) prev_data[tparam] = [];
                        prev_data = prev_data[tparam];
                    }else{
                        prev_data.push([]);
                        prev_data = prev_data[prev_data.length-1];
                    }
    
                }
                prev_data.push(val);
    
            }
    
    
            var request = {};
            var arr = [];
            var pairs = url.substring(url.indexOf('?') + 1).split('&');
    
            for (var i = 0; i < pairs.length; i++) {
               var pair = pairs[i].split('=');
               if(decodeURIComponent(pair[0]).indexOf('[')!=-1)
                   parse_mdim(decodeURIComponent(pair[0]), decodeURIComponent(pair[1]), request);
               else 
                   request[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
             }
    
            //To-do here check array and simplifity it: if parameter end with one index in array replace it by value [0]    
    
             return request;
    
        }
    

    【讨论】:

    • 考虑为您发布的代码添加任何描述、解释、评论。
    【解决方案4】:

    query-object jQuery plugin 就是为了这个

    【讨论】:

      猜你喜欢
      • 2013-12-30
      • 2015-03-25
      • 1970-01-01
      • 1970-01-01
      • 2019-01-01
      • 1970-01-01
      • 2012-01-14
      • 1970-01-01
      • 2018-06-17
      相关资源
      最近更新 更多