Как получить параметры строки запроса (query string) в JavaScript?

Стандартный способ: URLSearchParams

Начиная с современных браузеров (и Node.js), лучший способ — использовать встроенный API URLSearchParams. Он автоматически обрабатывает кодирование, декодирование и отсутствующие параметры.

// Получаем строку запроса из текущего URL
const queryString = window.location.search;
// Создаём объект URLSearchParams
const params = new URLSearchParams(queryString);

// Читаем значения
const name = params.get('name');      // "John"
const age = params.get('age');        // "25"
const city = params.get('city');      // "New York"
const missing = params.get('missing'); // null (не выдаёт ошибку)

console.log(name, age, city, missing); // John 25 New York null

Как это работает?

• URLSearchParams принимает строку, начинающуюся с ? (или без него).
• Метод .get(key) возвращает первое значение для указанного ключа или null, если ключ отсутствует.
• Автоматически декодирует URL-кодированные символы (%20 → пробел, + → пробел).

Дополнительные методы URLSearchParams

// Все значения для одного ключа (если параметр повторяется)
const allNames = params.getAll('name'); // ["John", ...]

// Проверка наличия параметра
const hasAge = params.has('age'); // true

// Перебор всех параметров
params.forEach((value, key) => {
  console.log(`${key}: ${value}`);
});

// Количество параметров
console.log(params.size); // 3

// Преобразование обратно в строку (с декодированием)
console.log(params.toString()); // "name=John&age=25&city=New+York"

Пример с произвольным URL (не текущим)

const url = new URL('https://example.com/page?name=Вася&city=Москва');
const params = url.searchParams;
console.log(params.get('name')); // "Вася"
console.log(params.get('city')); // "Москва"

Полифилл для старых браузеров

Если нужно поддерживать Internet Explorer или очень старые версии браузеров, можно использовать простую функцию:

function getQueryParam(param) {
  const urlParams = new URLSearchParams(window.location.search);
  return urlParams.get(param);
}

// Использование
console.log(getQueryParam('name')); // "John"

На практике URLSearchParams поддерживается всеми современными браузерами (Chrome, Firefox, Safari, Edge) с 2016-2017 годов. Для старых IE можно найти небольшой полифилл.

Важные замечания

• Не используйте ручной парсинг через split — он не обрабатывает спецсимволы и повторяющиеся ключи.
• Всегда проверяйте результат на null перед использованием.
• Для сложных случаев (например, вложенные объекты) используйте библиотеки типа qs или query-string.

function getQueryParams() {
  const query = window.location.search.substring(1); // убираем '?'
  if (!query) return {};
  
  return query.split('&').reduce((params, pair) => {
    const [key, value] = pair.split('=').map(item => 
      decodeURIComponent(item.replace(/\+/g, ' '))
    );
    
    if (key) {
      // Обработка повторяющихся ключей
      if (params.hasOwnProperty(key)) {
        params[key] = Array.isArray(params[key]) 
          ? [...params[key], value] 
          : [params[key], value];
      } else {
        params[key] = value;
      }
    }
    return params;
  }, {});
}

// Использование
const params = getQueryParams();
console.log(params.name); // "John"