JavaScript-də URLSearchParams ilə işləmək

Artıq bildiyiniz kimi, JavaScript-də formalar və GET sorğuları ilə işləyərkən aşağıdakı növ sətirlər yaranır:

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

Bəzən proqram şəkildə bu sətirdən hər hansı bir parametrin dəyərini dəyişmək lazım gəlir. Bunu edən kodu yazmaq çox rahat deyil. Buna görə də JavaScript-də bu cür sətirlərlə işləmək üçün xüsusi URLSearchParams sinfi daxil edilib.

Gəlin bu sinfin obyektini yaradaq, parametr kimi parametr sətrimizi ötürək:

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

Gəlin yaradılan obyektin hansı metodları olduğuna baxaq.

Parametrin dəyərini almaq

get metodu ilə parametrin dəyərini almaq olar:

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

Gəlin mövcud olmayan parametrin dəyərini almağa çalışaq:

javascriptlet res = searchParams.get('x');
console.log(res); // null çap edəcək

Parametrin olmasını yoxlamaq

has metodu ilə parametrin olmasını yoxlamaq olar. Mövcud parametri yoxlayaq:

javascriptlet res = searchParams.has('a');
console.log(res); // true çap edəcək

Mövcud olmayanı yoxlayaq:

javascriptlet res = searchParams.has('x');
console.log(res); // false çap edəcək

Sətirə çevirmək

toString metodu ilə obyektimizi yenidən sətirə çevirmək olar:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3' çap edəcək

Parametrləri dəyişmək

set metodu ilə parametrin dəyərini dəyişmək olar:

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

Dəyişiklikləri yoxlayaq:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=x&c=3' çap edəcək

Parametrləri əlavə etmək

set metodu ilə həmçinin yeni parametr əlavə etmək olar:

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

Dəyişiklikləri yoxlayaq:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&d=4' çap edəcək

Parametrləri əlavə etmək

append metodu ilə də yeni parametr əlavə etmək olar:

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

Dəyişiklikləri yoxlayaq:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&d=4' çap edəcək

Gəlin artıq mövcud olan parametri əlavə etməyə çalışaq:

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

Bu halda metod sadəcə eyni adlı parametri sona əlavə edəcək:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&b=2&c=3&a=4' çap edəcək

set və append metodları arasındakı fərq burada özünü göstərir. Birincisi mövcud parametri dəyişir, ikincisi isə onun dublikatını sona əlavə edir.

Parametrləri silmək

delete metodu ilə parametrləri silmək olar:

javascriptsearchParams.delete('b');

Dəyişiklikləri yoxlayaq:

javascriptlet res = searchParams.toString();
console.log(res); // 'a=1&c=3' çap edəcək

Parametrlərin dövrə ilə iterasiyası

Parametrləri dövrə ilə iterasiya etmək olar:

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

Bir neçə eyni parametr

Tutaq ki, sətirimizdə bir neçə eyni parametr var:

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

getAll metodu ilə bu parametrlərin dəyərlər massivini almaq olar:

javascriptlet res = searchParams.getAll('a');
console.dir(res); // [1, 2] çap edəcək

Praktiki tapşırıqlar

Tutaq ki, aşağıdakı parametr sətri verilib:

javascriptlet paramsString = 'test1=param1&test2=param2&test3=param3';
Задание 1

Bu sətirə test3 adlı başqa bir parametr əlavə edin.

Задание 2

Bu sətirdən test2 parametrini silin.

Задание 3

test1 parametrini yeni dəyərə dəyişin.