has() - это метод объекта URLSearchParams, который проверяет, есть ли параметр в строке запроса.
Он возвращает true или false.
const params = new URLSearchParams("q=javascript&page=2");
console.log(params.has("q")); // true
console.log(params.has("sort")); // false
has() нужен, когда важно узнать не значение параметра, а сам факт его присутствия в URL.
Синтаксис
params.has(name)
Где name - имя параметра, который нужно проверить.
Результат:
true, если параметр естьfalse, если параметра нет
const params = new URLSearchParams("category=books");
console.log(params.has("category")); // true
console.log(params.has("page")); // false
Метод ничего не изменяет. Он только проверяет текущие параметры.
Проверка обычного параметра
Простой пример:
const params = new URLSearchParams("q=javascript&page=1");
if (params.has("q")) {
console.log("Поисковый запрос есть");
}
Так можно понять, передал ли пользователь конкретный параметр в адресе.
const url = new URL("https://learn-javascript.ru/search?q=javascript");
if (url.searchParams.has("q")) {
console.log("Нужно выполнить поиск");
}
has() и get()
has() проверяет наличие параметра.
get() возвращает значение параметра.
const params = new URLSearchParams("q=javascript");
console.log(params.has("q")); // true
console.log(params.get("q")); // "javascript"
Если параметра нет:
console.log(params.has("page")); // false
console.log(params.get("page")); // null
Главное отличие: has() отвечает на вопрос “есть ли такой параметр?”, а get() - “какое у него значение?”.
Пустое значение тоже считается параметром
Параметр может быть пустым.
const params = new URLSearchParams("q=");
console.log(params.has("q")); // true
console.log(params.get("q")); // ""
has() вернул true, потому что параметр q действительно есть в URL.
Если нужно проверить, что значение не пустое, используйте get().
const value = params.get("q");
if (value !== null && value !== "") {
console.log("Значение заполнено");
}
Query-флаги
Иногда параметр используют как флаг: важно только наличие имени.
Например:
https://learn-javascript.ru/catalog?debug
Такой параметр можно проверить через has().
const params = new URLSearchParams("debug");
console.log(params.has("debug")); // true
console.log(params.get("debug")); // ""
Это удобно для режимов вроде preview, debug, modal, когда само значение не так важно.
const url = new URL("https://learn-javascript.ru/page?preview");
const isPreview = url.searchParams.has("preview");
console.log(isPreview); // true
Повторяющиеся параметры
Если параметр встречается несколько раз, has() всё равно вернёт true.
const params = new URLSearchParams("tag=javascript&tag=dom");
console.log(params.has("tag")); // true
Метод проверяет имя параметра, а не количество значений.
Если нужно получить все значения, используйте getAll().
console.log(params.getAll("tag")); // ["javascript", "dom"]
Проверка конкретного значения
В современных браузерах у has() есть вариант со вторым аргументом.
params.has(name, value)
Он проверяет, есть ли параметр с указанным именем и значением.
const params = new URLSearchParams("tag=javascript&tag=dom");
console.log(params.has("tag", "javascript")); // true
console.log(params.has("tag", "async")); // false
Если нужна максимально простая и предсказуемая проверка, можно использовать getAll() и includes().
const hasDomTag = params.getAll("tag").includes("dom");
console.log(hasDomTag); // true
Использование вместе с URL
С полным адресом удобнее работать через объект URL.
const url = new URL("https://learn-javascript.ru/catalog?category=books&page=2");
console.log(url.searchParams.has("category")); // true
console.log(url.searchParams.has("sort")); // false
Например, можно понять, нужно ли брать значение из URL или подставить настройку по умолчанию.
function getPageFromUrl(address) {
const url = new URL(address);
if (!url.searchParams.has("page")) {
return 1;
}
return Number(url.searchParams.get("page"));
}
console.log(getPageFromUrl("https://learn-javascript.ru/catalog")); // 1
console.log(getPageFromUrl("https://learn-javascript.ru/catalog?page=3")); // 3
Практический пример
Допустим, на странице каталога есть режим отображения только избранных материалов.
Адрес может быть таким:
https://learn-javascript.ru/catalog?favorites
Проверка:
function shouldShowFavorites(address) {
const url = new URL(address);
return url.searchParams.has("favorites");
}
console.log(shouldShowFavorites("https://learn-javascript.ru/catalog?favorites"));
// true
console.log(shouldShowFavorites("https://learn-javascript.ru/catalog"));
// false
Здесь параметр работает как переключатель: есть в URL - режим включён, нет - выключен.
Частые ошибки
Думать, что has() проверяет непустое значение
const params = new URLSearchParams("q=");
console.log(params.has("q")); // true
has() проверяет наличие параметра. Пустое значение всё равно считается существующим параметром.
Проверять наличие через get()
const params = new URLSearchParams("q=");
if (params.get("q")) {
console.log("Параметр есть");
}
Такой код не выполнится, потому что get("q") вернёт пустую строку.
Если нужно проверить именно наличие параметра, используйте has().
if (params.has("q")) {
console.log("Параметр есть");
}
Быстрая памятка
has()проверяет наличие параметра вURLSearchParams- метод возвращает
trueилиfalse has()не изменяет параметры- пустое значение всё равно считается параметром
has()отличается отget(): он проверяет наличие, а не возвращает значение- повторяющийся параметр тоже даёт
true - для всех значений используйте
getAll() - с полным адресом удобно работать через
url.searchParams.has(...) - query-флаги вроде
?previewудобно проверять черезhas()
Коротко
has() нужен, чтобы проверить, есть ли query-параметр в URLSearchParams. Он возвращает boolean и не смотрит на то, пустое значение или нет. Если нужно получить само значение, используйте get(), а если параметр может повторяться несколько раз - getAll().