Получение параметра из адресной строки в JavaScript

Обновлено: поддержка множественных значений

Часто при написание кода на JavaScript возникает необходимость получить из адреса определенный параметр. Особенно это актуально сейчас, когда сплош и рядом все делают одностраничные приложения.

Представим, что адрес выглядит вот так http://site.com/?search=sometext&page=100&abc=1&abc=qwe. Нам необходимо получить значения параметров search, page и abc. В JavaScript мы можем взять строку параметров из window.location.search.

window.location.search // ?search=sometext&page=100&abc=1&abc=qwe

Далее мы можем разбить строку на элементы и затем использовать их. Но куда более логично написать небольшую утилиту, которая при запросе определенного параметра будет просто возвращать его значение.

Вот такой код написал я:

var getQueryParam = function getQueryParam (param) {
  var queries = window.location.search, regex, resRegex, results, response;
  param = encodeURIComponent(param);
  regex = new RegExp('[\\?&]' + param + '=([^&#]*)', 'g');
  resRegex = new RegExp('(.*)=([^&#]*)');
  results = queries.match(regex);

  if (!results) {
      return '';
  }
  response = results.map(function (result) {
    var parsed = resRegex.exec(result);

    if (!parsed) {
        return '';
    }

    return parsed[2].match(/(^\d+$)/) ? Number(parsed[2]) : parsed[2];
  })

  return response.length > 1 ? response : response[0];
};

Функция не только вовзращает значение, но и пытается определить, является ли значение числом.

getQueryParam('search') // текст 'sometext'
getQueryParam('page') // цифра '100'
getQueryParam('abc') // массив [1, 'qwe']

Получение параметра из адресной строки в JavaScript

Комментарии