“URLSearchParams”, les paramètres d’URLs tout simplement en Javascript

J’ai découvert tout récemment l’interface URLSearchParams, qui depuis me fait gagner pas mal de temps avec la gestion des paramètres d’URL en Javascript.

Comment ça marche ? Il suffit de récupérer les paramètres de l’URL courante grâce à l’interface URL.

// on récupère l'url courante
const url = new URL(document.location);

// la propriété "searchParams" de "url" nous retourne un objet de type "URLSearchParams"
const searchParams = url.searchParams;

Imaginons maintenant que nous sommes sur la page suivante : https://mywebsite.com?search=javascript&sort=asc

// on peut facilement vérifier la présence d'une clé
searchParams.has('search') // true

// ou récupérer sa valeur
searchParams.get('search') // "javascript"

// et même itérer sur toutes les valeurs
for (const param of searchParams.entries()) {
  console.log(param)
}
// ["search", "javascript"]
// ["sort", "asc"]

Et voilà, terminé le parsing d’URL à base de ? et de =. Simple non ?

Cette fonctionnalité est supportée par tous les navigateurs modernes, mais pas par IE. Toutes les méthodes disponibles sont décrites dans la documentation officielle.