URLSearchParams-თან მუშაობა JavaScript-ში

როგორც უკვე იცით, ფორმებთან და 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 ახალი მნიშვნელობა.