Cadena de consulta a objeto

Beginner

This tutorial is from open-source community. Access the source code

Introducción

En este laboratorio, exploraremos cómo convertir una cadena de consulta o URL en un objeto utilizando JavaScript. Utilizaremos el método String.prototype.split() para extraer los parámetros de la URL, luego crearemos un objeto utilizando el constructor URLSearchParams y lo convertiremos en una matriz de pares clave-valor. Finalmente, utilizaremos Array.prototype.reduce() para convertir la matriz en un objeto de JavaScript. Este laboratorio te ayudará a entender cómo manipular y extraer datos de URLs y cadenas de consulta en JavaScript.

Convertir una cadena de consulta en un objeto

Para convertir una cadena de consulta o URL en un objeto, siga estos pasos:

  1. Abra la Terminal/SSH y escriba node para comenzar a practicar la codificación.
  2. Utilice String.prototype.split() para extraer los parámetros de la url dada.
  3. Utilice el constructor URLSearchParams para crear un objeto y conviértalo en una matriz de pares clave-valor utilizando el operador de propagación (...).
  4. Utilice Array.prototype.reduce() para convertir la matriz de pares clave-valor en un objeto.

A continuación, se muestra el código para convertir la cadena de consulta:

const queryStringToObject = (url) =>
  [...new URLSearchParams(url.split("?")[1])].reduce(
    (a, [k, v]) => ((a[k] = v), a),
    {}
  );

Uso de ejemplo:

queryStringToObject("https://google.com?page=1&count=10");
// {page: '1', count: '10'}

Resumen

¡Felicidades! Has completado el laboratorio de convertir una cadena de consulta en un objeto. Puedes practicar más laboratorios en LabEx para mejorar tus habilidades.