javascriptURL and URLSearchParamsپارامترهای نشانی در جاوااسکریپت
پارامتر نشانی در جاوااسکریپت را با URL و URLSearchParams بخوانید و بسازید؛ متن query، مقدار تکراری و تفاوت نبود کلید با رشتهٔ خالی.
مفهوم به زبان ساده
نشانی یک صفحه میتواند وضعیت جستوجو یا شمارهٔ صفحه را در بخش query نگه دارد. URL اجزای نشانی را جدا میکند و searchParams برای خواندن و تغییر پارامترها ابزار میدهد. این کار از بریدن دستی رشته با علامتهای سؤال و مساوی روشنتر است و قواعد کدگذاری متن را هم مدیریت میکند. ساختن URL در نمونه، خودش صفحه را جابهجا نمیکند.
get نخستین مقدار یک کلید را به شکل متن میدهد و در نبود کلید null برمیگرداند. یک کلید میتواند چند بار تکرار شود؛ getAll همهٔ مقدارهای همان نام را میگیرد. set مقدار قبلی آن کلید را جایگزین میکند، در حالی که append مقدار دیگری اضافه میکند. نمونه با دادهٔ فارسی و دو برچسب، تفاوت این خواندنها را نشان میدهد.
شمارهٔ صفحهٔ خواندهشده هنوز متن است و پیش از استفاده به تبدیل و بررسی محدوده نیاز دارد. از قبل متن را percent-encode نکنید و سپس به set ندهید؛ این ابزار هنگام تولید نشانی کدگذاری لازم را انجام میدهد. در تمرین، پارامتر q را خالی و سپس کاملاً حذف کنید و خروجی get را مقایسه کنید. دادهٔ حساس را در نشانی نگذارید؛ URL میتواند در تاریخچه، گزارشها و پیوندهای اشتراکی دیده شود.
کجا به کار میآید؟
- ساخت پیوند قابل اشتراک برای جستوجو و فیلتر
- خواندن شمارهٔ صفحه و چند مقدار همنام بدون تجزیهٔ دستی نشانی
از تعریف تا یک مثال واقعی
const url = new URL('https://example.com/lessons?page=2&tag=js&tag=web');
url.searchParams.set('q', 'آموزش وب');
console.log(url.searchParams.get('page'));
console.log(typeof url.searchParams.get('page'));
console.log(url.searchParams.getAll('tag').join(', '));
console.log(url.searchParams.get('q'));
console.log(url.searchParams.get('missing') === null);
2 string js, web آموزش وب true
این مثال چطور کار میکند؟
URL یک شیء محلی از نشانی نمونه میسازد و هیچ درخواستی نمیفرستد.
page متن است و getAll هر دو برچسب را میدهد.
set متن فارسی را نگه میدارد؛ کلید ناموجود null میدهد.
اشتباه رایج
get مقدار عددی یا بولی تحویل نمیدهد. همچنین get فقط نخستین مقدار را میگیرد؛ برای پارامتر تکرارشونده getAll و قرارداد مشخص لازم است.
این را به خاطر بسپارید
نشانی را با ابزار URL پردازش کنید و دادهٔ query را مانند هر ورودی بیرونی، متن نیازمند بررسی بدانید.