JavaScript'те URLSearchParams менен иштөө

Сиздер билгендей, формалар жана GET сурамдары менен иштөөдө JavaScript'те төмөнкүдөй саптар пайда болот:

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';