Manually concatenating query strings is error-prone. URLSearchParams handles encoding and formatting automatically.
Messy Manual Way:
const query = '?name=' + encodeURIComponent(name) +
'&email=' + encodeURIComponent(email) +
'&age=' + age;
fetch('/api/users' + query);
// Easy to forget encoding, messy to read
Clean URLSearchParams Way:
const params = new URLSearchParams({
name: 'John Doe',
email: 'john@example.com',
age: 30
});
fetch(`/api/users?${params}`);
// Automatically encodes, handles special characters
Dynamic Parameters:
const params = new URLSearchParams();
params.append('search', searchTerm);
if (category) params.append('category', category);
if (minPrice) params.append('min_price', minPrice);
fetch(`/api/products?${params}`);
Clean, safe, readable!
