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

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

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

Кээде ушул саптан кандайдыр бир параметрдин маанисин программалык жол менен өзгөртүү керек болот. Муну жасаган код жазганы өтө ыңгайлуу эмес. Ошондуктан JavaScript'те ушул сыяктуу саптар менен иштөө үчүн URLSearchParams атайын класы бар.

Келгиле, биздин параметрлер сабын параметр катары берип, ушул класстын объектин түзөлү:

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

Келгиле, түзүлгөн объекттин кандай методдору бар экенин карап чыгалы.

Параметрин маанисин алуу

get методунун жардамы менен параметрин маанисин алууга болот:

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

Жок болгон параметрдин маанисин алууга аракет кылалы:

let res = searchParams.get('x');
console.log(res); // null чыгарат

Параметрдин бар экендигин текшерүү

has методунун жардамы менен параметрдин бар экендигин текшерүүгө болот. Бар болгон параметрди текшерөлү:

let res = searchParams.has('a');
console.log(res); // true чыгарат

Жок болгонун текшерөлү:

let res = searchParams.has('x');
console.log(res); // false чыгарат

Сапка айландыруу

toString методунун жардамы менен биздин объектибизди кайра сапка айландырууга болот:

let res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3' чыгарат

Параметрлерди өзгөртүү

set методунун жардамы менен параметрин маанисин өзгөртүүгө болот:

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

Өзгөртүүлөрдү текшерөлү:

let res = searchParams.toString();
console.log(res); // 'a=1&b=x&c=3' чыгарат

Параметрлерди кошуу

set методунун жардамы менен жаңы параметр да кошууга болот:

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

Өзгөртүүлөрдү текшерөлү:

let res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&d=4' чыгарат

Параметрлерди кошуу

append методунун жардамы менен да жаңы параметрди кошууга болот:

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

Өзгөртүүлөрдү текшерөлү:

let res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&d=4' чыгарат

Келгиле, бар болгон параметрди кошууга аракет кылалы:

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

Бул учурда биздин метод ошол эле аттагы параметрди жөн гана акырына кошот:

let res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&a=4' чыгарат

Бул жерде set жана append методдорунун айырмасы байкалат. Биринчиси бар болгон параметрди өзгөртөт, ал эми экинчиси жөн гана анын дубликатын акырына кошот.

Параметрлерди өчүрүү

delete методунун жардамы менен параметрлерди өчүрүүгө болот:

searchParams.delete('b');

Өзгөртүүлөрдү текшерөлү:

let res = searchParams.toString();
console.log(res); // 'a=1&c=3' чыгарат

Параметрлерди цикл менен айландыруу

Параметрлерди цикл менен айландырууга болот:

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

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

Биздин сапта бир нече бирдей параметрлер болсун:

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

getAll методунун жардамы менен ушул параметрлердин маанилеринин массивин алууга болот:

let res = searchParams.getAll('a');
console.dir(res); // [1, 2] чыгарат

Практикалык тапшырмалар

Төмөнкү параметрлер сабы берилсин:

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

Ушул сапка дагы бир test3 параметрин кошуңуз.

Ушул саптан test2 параметрин өчүрүңүз.

test1 параметрин жаңы мааниге өзгөртүңүз.