Como criar parâmetros de consulta em Javascript?

Existe alguma maneira de criar os parâmetros de consulta para fazer uma solicitação GET em JavaScript?

Assim como no Python, você urllib.urlencode()cria um dicionário (ou lista de duas tuplas) e cria uma string como 'var1=value1&var2=value2'.

Aqui está:

function encodeQueryData(data) {
   const ret = [];
   for (let d in data)
     ret.push(encodeURIComponent(d) + '=' + encodeURIComponent(data[d]));
   return ret.join('&');
}

Uso:

const data = { 'first name': 'George', 'last name': 'Jetson', 'age': 110 };
const querystring = encodeQueryData(data);

URLSearchParams tem suporte crescente ao navegador.

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = new URLSearchParams(data);

// searchParams.toString() === 'var1=value1&var2=value2'

O Node.js oferece o módulo querystring .

const querystring = require('querystring');

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = querystring.stringify(data);

// searchParams === 'var1=value1&var2=value2'

funcional

function encodeData(data) {
    return Object.keys(data).map(function(key) {
        return [key, data[key]].map(encodeURIComponent).join("=");
    }).join("&");
}   

O Zabba forneceu em um comentário sobre a resposta atualmente aceita uma sugestão de que para mim é a melhor solução: use jQuery.param () .

Se eu usar jQuery.param()os dados na pergunta original, o código será simplesmente:

const params = jQuery.param({
    var1: 'value',
    var2: 'value'
});

A variável paramsserá

"var1=value&var2=value"

Para exemplos, entradas e saídas mais complicados, consulte a documentação do jQuery.param () .

Acabamos de lançar o arg.js , um projeto que visa solucionar esse problema de uma vez por todas. Tradicionalmente, tem sido tão difícil, mas agora você pode fazer:

var querystring = Arg.url({name: "Mat", state: "CO"});

E a leitura funciona:

var name = Arg("name");

ou obter todo o lote:

var params = Arg.all();

e se você se importa com a diferença entre ?query=truee #hash=trueentão pode usar os métodos Arg.query()e Arg.hash().

Isso deve fazer o trabalho:

const createQueryParams = params => 
      Object.keys(params)
            .map(k => `${k}=${encodeURI(params[k])}`)
            .join('&');

Exemplo:

const params = { name : 'John', postcode: 'W1 2DL'}
const queryParams = createQueryParams(params)

Resultado:

name=John&postcode=W1%202DL

ES2017 (ES8)

Fazendo uso de Object.entries(), que retorna uma matriz de [key, value]pares de objetos . Por exemplo, {a: 1, b: 2}pois retornaria [['a', 1], ['b', 2]]. Não é suportado (e não será) apenas pelo IE.

Código:

const buildURLQuery = obj =>
      Object.entries(obj)
            .map(pair => pair.map(encodeURIComponent).join('='))
            .join('&');

Exemplo:

buildURLQuery({name: 'John', gender: 'male'});

Resultado:

"name=John&gender=male"

Se você estiver usando Prototype, existe Form.serialize

Se você estiver usando jQuery, há Ajax / serialize

Porém, não conheço nenhuma função independente para fazer isso, mas uma pesquisa no google revelou algumas opções promissoras se você não estiver usando uma biblioteca no momento. Se você não é, você realmente deveria, porque eles são o paraíso.

Gostaria de revisitar essa pergunta de quase 10 anos. Nesta era de programação pronta para uso, sua melhor aposta é configurar seu projeto usando um gerente de dependência ( npm). Existe toda uma indústria de bibliotecas caseiras por aí que codifica as strings de consulta e cuida de todos os casos extremos. Este é um dos mais populares -

https://www.npmjs.com/package/query-string

Uma pequena modificação no texto datilografado:

  public encodeData(data: any): string {
    return Object.keys(data).map((key) => {
      return [key, data[key]].map(encodeURIComponent).join("=");
    }).join("&");
  }

Este tópico aponta para algum código para escape de URLs em php. Há escape()e unescape()que fará a maior parte do trabalho, mas você precisará adicionar algumas coisas extras.

function urlencode(str) {
str = escape(str);
str = str.replace('+', '%2B');
str = str.replace('%20', '+');
str = str.replace('*', '%2A');
str = str.replace('/', '%2F');
str = str.replace('@', '%40');
return str;
}

function urldecode(str) {
str = str.replace('+', ' ');
str = unescape(str);
return str;
}