Skip to main content
12 de 12
adicionou 1 caractere ao conteúdo
Luiz Felipe
  • 36,5mil
  • 10
  • 74
  • 154

O AJAX é uma "maneira" de se usar o XmlHttpRequest, que não é uma linguagem, mas sim uma API do JavaScript, assim como File API, DOM API, etc.

O que o XHR (XmlHttpRequest API) faz é uma comunicação de cliente e servidor, não quer dizer que ele é assíncrono, já o AJAX é a maneira de usar XHR "assincronamente".

Exemplo de XHR síncrono (isto não é AJAX):

var oReq = new XMLHttpRequest();

//Defina como false
oReq.open("GET", "/url", false);

//Espera completar a requisição, geralmente congela o browser
oReq.send(null);

alert(oReq.responseText);

Exemplo de XHR assíncrono (isto é AJAX):

var oReq = new XMLHttpRequest();

//Defina como true
oReq.open("GET", "/url", true);

//Função assíncrona que aguarda a resposta
oReq.onreadystatechange = function()
{
    if (oReq.readyState === 4) {
        alert(oReq.responseText);
    }
};

//Envia a requisição, mas a resposta fica sendo aguardada em Background
oReq.send(null);

Então Ajax significa Asynchronous JavaScript and XML (que traduzindo é JavaScript e XML assíncronos) e é a maneira de se usar o XHR que o torna AJAX ou não. O termo AJAX seria um apelido para o o XHR usado de modo assíncrono.

É importante notar que o modo síncrono foi "apelidado" de SJAX, que significa Synchronous JavaScript and XML (JavaScript e XML síncronos)), mas note também que o SJAX está em desuso e os navegadores modernos tem começado a emitir warnings no console e provavelmente virão a "bloquear" esta maneira, no entanto dentro de Web Workers, pois roda em uma "thread" separada, assim como a mensagem de erro afirma:

synchronous xmlhttprequest on the main thread is deprecated

Ou seja só no main thread, que se refere a thread principal que executa na aba, o Web Works executam em sub-threads, o que não causa problema e neste caso não esta em desuso.

Mais detalhes em https://xhr.spec.whatwg.org/#sync-warning

Outra situação é que nem sempre usamos XML, mas na época que o apelido surgiu era bastante usado por ter suporte ao .resposeXML do XHR, pra usar JSON hoje podemos fazer o parse do .responseText com algo como:

var resposta = JSON.parse(oReq.responseText);

console.log(resposta);

Ou pode ajustar a propriedade XMLHttpRequest.responseType para o "json" e usar o XMLHttpRequest.response para obter o JSON, isto supondo que a resposta do servidor seja de fato JSON, ficando algo como:

oReq.responseType = "json";

var resposta = oReq.response;

console.log(oReq.response);

Callback e assíncrono em JavaScript/ECMAScript

Para entender um pouco melhor sobre como corre os callbacks, dê uma lida em:

Syzoth
  • 100,5mil
  • 23
  • 169
  • 361