QueryString with javascript (v31)

Revision 31 of this benchmark created by Dennis on

Description

Test two methods of retrieving QueryString values with javascript.

Preparation HTML

<script>
  var query = "q=my+search+query&value=55";
  
  window.GetQueryString = function(q) {
   return (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i) {
     var p = a[i].split('=');
     if (p.length != 2) continue;
     b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return b;
   })(q.split("&"));
  };
  
 var pl     = /\+/g,
        search = /([^&=]+)=?([^&]*)/g;

window.GetQueryString2 = function() {
    var match,
        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); };

    var urlParams = {};
    while (match = search.exec(query))
       urlParams[decode(match[1])] = decode(match[2]);
    return urlParams;
};


window.GetQueryString3 = function(qsRAW) {

    if(!qsRAW) return {};
    var qs = {};
    var qsLen = qsRAW.length;
    var curKey = "";
    var curVal = "";
    var compilingKey = true;

    for(var i = 0; i < qsLen; i++) {

      var char = qsRAW[i];

      //If we've hit an equal sign, and we're not on the first character, then
      //we should stop compiling our key string, and should move to the val string
      if(char === "=" && i !== 0 && compilingKey === true) {

        compilingKey = false;

        //We've hit an &, and we're in value compile mode, or we're at the last character --> Store the curVal into curKey.
      } else if(char === "&" || char === ";" || i === qsLen-1) {

        var decodedCurVal = decodeURIComponent(curVal);

        //If the key has [] as the last two chars, cut them off. We're dealing with an array of values.
        if(curKey.slice(-2) === "[]") curKey = curKey.slice(0,-2);

        //If we already have a value for this key, turn it into an Array and push the next value into it.
        if(typeof qs[curKey] !== "undefined") {

          if(typeof qs[curKey] === "string") {

            var tmpVal = qs[curKey];
            qs[curKey] = new Array();
            qs[curKey].push(tmpVal);

          };

          qs[curKey].push(decodedCurVal);

        //First time we're seeing this key, just assign the value to it
        } else {

          qs[curKey] = decodedCurVal;

        }

        curKey = "";
        curVal = "";
        compilingKey = true;

      } else {

        if(compilingKey) {
          curKey += char;
        } else {
          curVal += char;
        }

      }
    }

    return qs;

  };
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
Split method
var qs = window.GetQueryString(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];
ready
Regex method
var qs = window.GetQueryString2(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];
ready
String Scan Method
var qs = window.GetQueryString3(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.