JavaScript да URLSearchParams билан ишлаш

Сизга маълумки, JavaScript да формалар ва GET сўровлари билан ишлаганда куйидаги кўринишдаги сатрлар пайдо булади:

javascriptlet paramsString = 'a=1&b=2&c=3';

Базан ушбу сатрдан бирон параметрнинг қийматини дастурли равишда ўзгартириш керак булади. Буни амалга оширадиган код ёзиш жуда қулай эмас. Шу сабабли JavaScript да ушбу хил сатрлар билан ишлаш учун махсус URLSearchParams синфи мавжуд.

Келинг, ушбу синфнинг объектини яратиб, параметрлар сатримизни унга параметр сифатида ўтамиз:

javascriptlet paramsString = 'a=1&b=2&c=3';
let searchParams = new URLSearchParams(paramsString);

Келинг, яратилган объектда қандай методлар борлигини кўриб чиқайлик.

Параметр қийматини олиш

get метода ёрдамида параметрнинг қийматини олиш мумкин:

javascriptlet res = searchParams.get('a');
console.log(res);

Энди мавжуд бўлмаган параметрнинг қийматини олиб кўрайлик:

javascriptlet res = searchParams.get('x');
console.log(res); // null чикади

Параметр мавжудлигини текшириш

has метода ёрдамида параметрнинг мавжудлигини текшириш мумкин. Мавжуд параметрни текширайлик:

javascriptlet res = searchParams.has('a');
console.log(res); // true чикади

Мавжуд бўлмаган параметрни текширайлик:

javascriptlet res = searchParams.has('x');
console.log(res); // false чикади

Сатрга айлантириш

toString метода ёрдамида бизнинг объектимизни яна сатрга айлантириш мумкин:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3' чикади

Параметрларни ўзгартириш

set метода ёрдамида параметрнинг қийматини ўзгартириш мумкин:

javascriptsearchParams.set('b', 'x');

Ўзгаришларни текширайлик:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=x&c=3' чикади

Параметрлар қўшиш

set метода ёрдамида янгі параметр қўшиш ҳам мумкин:

javascriptsearchParams.set('d', '4');

Ўзгаришларни текширайлик:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&d=4' чикади

Параметрлар қўшиш

append метода ёрдамида ҳам янгі параметр қўшиш мумкин:

javascriptsearchParams.append('d', '4');

Ўзгаришларни текширайлик:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&d=4' чикади

Келинг, аллақачон мавжуд бўлган параметрни қўшиб кўрайлик:

javascriptsearchParams.append('a', '4');

Бунда бизнинг методимиз шу номли параметрни охирига қўшиб қўяди:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&a=4' чикади

Бу ерда set ва append методлари орасидаги фарқ намоён булади. Биринчиси мавжуд параметрни ўзгартиради, иккинчиси эса унинг дубликатини охирига қўшиб қўяди.

Параметрларни ўчириш

delete метода ёрдамида параметрларни ўчириш мумкин:

javascriptsearchParams.delete('b');

Ўзгаришларни текширайлик:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&c=3' чикади

Параметрларни сикл билан айланиш

Параметрларни сикл билан айланиб чиқиш мумкин:

javascriptfor (let p of searchParams) {
  console.log(p);
}

Бир нечта бир хил параметрлар

Бизнинг сатримизда бир нечта бир хил параметрлар мавжуд дейлик:

javascriptlet paramsString = 'a=1&a=2b=2&c=3';

getAll метода ёрдамида ушбу параметрларнинг қийматлари массивини олиш мумкин:

javascriptlet res = searchParams.getAll('a');
console.dir(res); // [1, 2] чикади

Амалий вазифалар

Куйидаги параметрлар сатри берилган дейлик:

javascriptlet paramsString = 'test1=param1&test2=param2&test3=param3';