Objeto para Query String

Introdução

Neste laboratório, exploraremos como gerar uma query string a partir de pares chave-valor de um objeto usando JavaScript. Usaremos o método Array.prototype.reduce() em Object.entries() para criar a query string e determinar o símbolo apropriado a ser usado com base no comprimento da queryString. Ao final deste laboratório, você será capaz de gerar eficientemente uma query string para suas aplicações web.

Convertendo um Objeto para uma Query String

Para converter um objeto em uma query string, use a função objectToQueryString(), que gera uma query string a partir dos pares chave-valor do objeto fornecido.

A função funciona da seguinte forma:

• Ela usa Array.prototype.reduce() em Object.entries() para criar a query string a partir de queryParameters.
• Ela determina o symbol a ser ? ou & com base no comprimento de queryString.
• Ela concatena val a queryString somente se for uma string.
• Ela retorna a queryString ou uma string vazia quando queryParameters é falsy.

Aqui está o código para a função 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;
        },
        ""
      )
    : "";
};

Exemplo de uso da função objectToQueryString():

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

Resumo

Parabéns! Você concluiu o laboratório de Objeto para Query String. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.