Comment convertir les paramètres d'une URL en un objet JavaScript ?

Question

J'ai une chaîne de caractères comme celle-ci :

abc=foo&def=%5Basf%5D&xyz=5

Comment puis-je le convertir en un objet JavaScript comme celui-ci ?

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

Answer 1

En l'an 2021... Veuillez considérer ceci comme obsolète.

Editar

Cette édition améliore et explique la réponse en se basant sur les commentaires.

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

Exemple

Analyser abc=foo&def=%5Basf%5D&xyz=5 en cinq étapes :

• decodeURI : abc=foo&def=[asf]&xyz=5
• Échapper aux guillemets : même chose, car il n'y a pas de guillemets.
• Remplacer & : abc=foo","def=[asf]","xyz=5
• Remplacer = : abc":"foo","def":"[asf]","xyz":"5
• Entourez-vous de boucles et de citations : {"abc":"foo","def":"[asf]","xyz":"5"}

qui est un JSON légal.

Un site solution améliorée permet d'utiliser plus de caractères dans la chaîne de recherche. Il utilise une fonction reviver pour le décodage des URI :

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

Exemple

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

donne

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

Réponse originale

Une seule phrase :

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

Answer 2

Split on & pour obtenir des paires nom/valeur, puis diviser chaque paire sur = . Voici un exemple :

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;
}, {});

Une autre approche, l'utilisation d'expressions régulières :

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

Ceci est adapté du livre de John Resig "Cherchez et ne remplacez pas" .

Answer 3

Il s'agit d'une version simple, mais il est évident que vous devrez ajouter des contrôles d'erreurs :

var obj = {};
var pairs = queryString.split('&');
for(i in pairs){
    var split = pairs[i].split('=');
    obj[decodeURIComponent(split[0])] = decodeURIComponent(split[1]);
}

Answer 4

J'ai trouvé $.String.deparam la solution préconstruite la plus complète (peut faire des objets imbriqués, etc.). Consultez le site documentation .

Answer 5

À ma connaissance, il n'existe pas de solution native. Dojo a une méthode de désérialisation intégrée si vous utilisez ce framework par hasard.

Sinon, vous pouvez le mettre en œuvre vous-même assez simplement :

function unserialize(str) {
  str = decodeURIComponent(str);
  var chunks = str.split('&'),
      obj = {};
  for(var c=0; c < chunks.length; c++) {
    var split = chunks[c].split('=', 2);
    obj[split[0]] = split[1];
  }
  return obj;
}

edit : ajouté decodeURIComponent()