GoConqr has a new look! Let us know what you think.

Sign up free

Flashcards

JavaScript AJAX Basics

Victor Bini Technical Skills asa English 35 cards

Cards in this deck (35)

  1. 1Ajax é um acrônimo de quais palavras?Asynchronous JavaScript And XML
    Que é a técnica de carregar novos conteúdos sem a necessidade de um novo Loading na pagina.
  2. 2O que o AJAX faz?Pemite carregar um novo conteúdo na "Current Web Page" sem carregar uma nova pagina.
  3. 3Com quais linguagens Back End AJAX pode ser comunicar?Ruby, Python, PHP, Cold Fusion e muitas outras.
  4. 4Quando um servidor responde a uma "AJAX Request" ele retorna uma?Response, e então performa a "callback function" que definimos no AJAX.
  5. 5Você usa AJAX para se comunicar com um SERVIDOR enviando uma?Request, para então o servidor receber esses dados, manipulá-los e retornar a "Response" para que o Ajax performe a "Call Back Function".
  6. 6Qual é uma das principais características da "asynchronous" de uma AJAX request?É que a "Callbacks" para múltiplas requests podem não serem executadas na ordem que foram enviadas.
  7. 7Quais são os 4 passos para um "AJAX Request"?1. Criar um objeto XMLHttpRequest Object
    2. Criar uma "callback function"
    3. Abrir a "request"
    4. Enviar a "request"
  8. 8Como criamos um XMLHttpRequest Object?var variable = new XMLHttpRequest;
  9. 9Como criamos uma função "callback" para o AJAX?STEP 1
    var variable = new XMLHttpRequest();
    STEP 2
    variable.onreadystatechange = function () {
    if (request.readyState === 4) {
    do something
    }
    };
  10. 10Como abrimos a "Request"?variable.open('method', 'database.extention')
    onde metodo pode ser
    GET ou POST
    e no database
    podemos ter qualquer arquivo que queremos manipular, como um HTML para anexar em uma pagina.
  11. 11Como podemos enviar essa "Request"?variable.send();
    envia a request para o servidor.
  12. 12O que é uma "query string"?É uma informação que é enviada para o web server, ela é adicionada ao final da URL.
    lembrar de como fica nas urls, não possuem espaço e alguns caracteries especiais são alterados por outros.
  13. 13Qual é a diferença entre os métodos "GET" e "POST"?A diferença básica é que POST envia dados no "corpo" de uma "request", enquanto o GET envia dados pela URL, tornando assim o método GET com uma capacidade menor de enviar dados.
    Devemos obtar pelo método POST quando :
    Quando queremos enviar dados que podem ser armazenados em nosso bando de dados.
    Quando você quer enviar mais de 2083 caracteries de dados para o web server (limite de dados do método GET)
    Uma razão comum para usar o método "Get" é
    Quando nos só temos interesse de acessar ou pegar informações do servidor e não de modifica-las ou envia-las.
  14. 14O que significa CORS?"Cross-Origin resource sharing" ou compartilhamento de recursos de origem cruzada. É uma especificação de uma tecnologia de navegadores que define meios para um servidor permitir que seus recursos sejam acessados por uma página web de um domínio diferente.
  15. 15Porque o uso de um "Web Proxy" é muito útil quando falamos em uma "AJAX request"?Porque ele permite ignorar a politica dos web browser's da "same origin" de dados, permitindo você acessar dados de outros servidores, mantendo suas "AJAX requests" no mesmo dominio.
  16. 16Qual é o valor de uma "XMLHttpRequest" ou "AJAX Request" em sua propriedade "readyState" quando o navegador já recebeu TODOS os dados de um servidor, correspodente a request realizada?4, então para sabermos se ocorreu tudo bem no envio desses dados, podemos verificar na call back function, antes de executar algo :
    if (variableAJAXrequest.readyState === 4){
    do something;
    }
  17. 17O que significa o status HTTP 200? e o 404?200 significa que está tudo OK.
    404 significa "File not Found".
    podemos estar se recebemos todas as informações e se tudo ocorreu ok no servidor dessa forma na "callback function"
    variable.onreadystatechange = function() {
    if(variable.readyState === 4 && variable.status === 200) {
    }
    };
  18. 18Como podemos acessar a resposta do servidor, para colocar dentro de um documento HTML, por exemplo?document.getElementById('div').innerHTML = variableAJAXrequest.responseText;
    a resposta do servidor pode ser acessada por:
    variable.responseText;
  19. 19O que significa JSON? Como utilizamos?JavaScript Object Notation, devemos separa em seus arquivos por dupla aspas suas propriedades e valores.
    "property": "value",
    podendo ser formatado como um Array de valores, objeto com propriedade e valores e também um Array de Objetos.
  20. 20Quando um servidor em envia dados JSON para o AJAX, para o javascript o que ele enviou?Ele recebe esse dados como um string, para convertermos precisamos submeter a resposta do servidor ao método:
    JSON.parse() ;
  21. 21O que $('div').load('updatecontent.html') faz?Carrega o conteudo do arquivo 'updatecontent.html' na div selecionada pelo AJAX.
  22. 22O que faz o metódo .load()?.load() Carrega dados de um arquivo ou servidor e coloca os dados retornados em um elemento selecionado.
  23. 23Qual é a diferença entre o método jQuery .load() aos outros métodos do jQuery?Esse método .load() deve estar sempre atrelado a uma seleção jQuery -
    $('elementoAtrelado').load('content.html')
  24. 24O método $.get() ou jQuey.get() aceita 3 argumentos (parâmetros), em qual ordem eles vão?1. URL
    2. Dados do servidor
    3. Callback function para processar a resposta do servidor.
    exemplo
    footer.html é onde queremos extrair os dados .
    devemos lembrar que o parâmetro para rodar a função é o "response" que é a resposta do servidor.
    $.get('footer.html','app.js', function(response){
    do somethig;
    });
  25. 25Qual método jQuery AJAX, posta dados no servidor?$.post()
    ou
    jQuery.post()
  26. 26Como podemos adicionar um "submit event handler" manipulador de eventos em uma form?$('form').submit(function(evt) {
    });
    dessa forma miramos na "form" assim que ela for submetida e então podemos performar uma função para manipular os dados obtidos.
  27. 27O que o método serialize() faz?serialize() codifica os elementos de uma "form" como uma string para submissão( envio ao servidor).
  28. 28Como podemos evitar com jQuey o comportamento padrão do navegador, por exemplo quando submetemos uma "form", então o navegador por padrão vai carregar uma nova pagina, como evitamos isso?$('form').submit(function(){
    evt.preventDefault()
    });
    evitamos o carregamento de uma nova pagina e podemos performar outras ações, como confirmar o login ainda na mesma pagina, sem a necessidade de carregar mais contéudo.
  29. 29Quais são os 2 parametros que o método de "Low-Level interface" $.ajax() ou jQuery.ajax() aceita?1. A URL
    2. Um objeto Javascript contendo as configurações que controlam como a AJAX request é feita.
    Então as propriedades e valores deste objeto definem como será executada e quais dados serão extraídos do servidor.
  30. 30Porque deveriamos usar o método $.ajax() ou jQuery.ajax() em vez de simplesmente usar metodos como, $.get(), $.getJSON(), $.post()?O $.ajax() método, possui mais opções e fornece um grande controle sobre as AJAX requests.
    O $.ajax() ,método permite que você defina um tempo limite e controle o quanto tempo você está disposto a esperar por uma resposta de um servidor.
    O $.ajax() método permite você enviar um nome de usuário e password para as fontes para conseguir uma autenticação.
  31. 31Qual é o método jQuery para manipular erros na resposta AJAX?.fail()
    podemos colocar no final da callback function para performar algo caso a resposta AJAX não tenha tido sucesso.
    porém demoves lembrar que .fail() funciona com $.ajax()
    o parametro para .fail é (jqXHR)
    que é o jQuery XHR object, onde vamos trabalhar o erro.
    os parametros que .fail() recebe da "ajax request" são similares ao que vimos sem jQuery,
    statusText - com a descrição do erro
    status- com o erro (numerico, como 404.)
  32. 32Como podemos utilizar esse .fail()?$.get("missing.html", function(data) {
    $("#footer").html(data);
    }).fail(function(jqXHR){
    alert(jqXHR.statusText);
    });
    jqXHR é o objeto retornado da Request
    .statusText - obtemos qual erro tivemos
    .status- o erro de forma numerica.
  33. 33O que significa API? E quais linguagens de programação podem ser utilizadas para falar com "apis de terceiros"?API siginifica - Application Programming Interface, e pode ser usadas por linguagens como JavaScript, Ruby, PHP, Python.
  34. 34Para que serve uma "API key"?Permite que o desenvolvedor web se conecte com um terceiro servidor como Google Maps, permite que que os donos da API limitem o acesso, pemitem que um site venda o acesso a sua API.
  35. 35Quais são os 3 parametros aceitos pelo método $.getJSON()?$.getJSON() aceita
    1. UMA URL
    2. Um objeto JavaScript para enviar os dados para o servidor.
    3. Uma "callback" function para processar as respostas do servido.
    um exemplo com de uso do método com a api do Open Weather:
    $(document).ready(function() {
    var weatherAPI = 'http://api.openweathermap.org/data/2.5/weather';
    var data = {
    q : "Portland,OR",
    units : "metric"
    };
    function showWeather(weatherReport) {
    $('#temperature').text(weatherReport.main.temp);
    }
    $.getJSON(weatherAPI, data, showWeather);
    });

Information

Description
asa Technical Skills (JavaScript / jQuery) Flashcards on JavaScript AJAX Basics, created by Victor Bini on 09/04/2016.
Created by
Victor Bini
Views
2
Rating

Feedback

What is it about?

What do you think of the new look?

How do you like it?