Objeto a Cadena de Consulta

Introducción

En este laboratorio, exploraremos cómo generar una cadena de consulta a partir de los pares clave-valor de un objeto utilizando JavaScript. Utilizaremos el método Array.prototype.reduce() en Object.entries() para crear la cadena de consulta y determinar el símbolo adecuado a utilizar en función de la longitud de la queryString. Al final de este laboratorio, serás capaz de generar eficientemente una cadena de consulta para tus aplicaciones web.

Skills Graph

Convertir un objeto a una cadena de consulta

Para convertir un objeto en una cadena de consulta, utiliza la función objectToQueryString() que genera una cadena de consulta a partir de los pares clave-valor del objeto dado.

La función funciona de la siguiente manera:

• Utiliza Array.prototype.reduce() en Object.entries() para crear la cadena de consulta a partir de queryParameters.
• Determina el símbolo que puede ser ? o & en función de la longitud de queryString.
• Concatena val a queryString solo si es una cadena.
• Devuelve la queryString o una cadena vacía cuando los queryParameters son falsos.

Aquí está el código de la función objectToQueryString():

const objectToQueryString = (queryParameters) => {
  return queryParameters
    ? Object.entries(queryParameters).reduce(
        (queryString, [key, val], index) => {
          const symbol = queryString.length === 0 ? "?" : "&";
          queryString +=
            typeof val === "string" ? `${symbol}${key}=${val}` : "";
          return queryString;
        },
        ""
      )
    : "";
};

Uso de ejemplo de la función objectToQueryString():

objectToQueryString({ page: "1", size: "2kg", key: undefined }); // devuelve '?page=1&size=2kg'

Resumen

¡Felicidades! Has completado el laboratorio de Conversión de Objeto a Cadena de Consulta. Puedes practicar más laboratorios en LabEx para mejorar tus habilidades.