Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Não consigo receber dados do ajax em um vetor.

Alguém poderia me ajudar?

HTML

<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
     <section id="lista-filmes"></section>
</body>

</html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="js/ajax.js"></script>

///////////////////////////////////////////////

ajax.js

$("#lista-filmes").ready(function(){
    var filmes = [];
    $.get("https://www.mocky.io/v2/5ad631b32e00001000c93a96", function(data){
        console.log(data);
        console.log(typeof data);
        filmes.concat(data);
    });


    console.log(filmes);
});

retorna um vetor em branco, fiz com forEach, e "deu certo" só que quando eu faço filmes[0] o resultado é undefined

2 respostas
solução!

O seu get está correto, o que acontece é que chamadas ajax são assíncronas. Enquanto você executa seu get o javascript executa o restante do código. E quando você roda console.log(filmes) a API ainda não trouxe o resultado da busca, então filmes ainda é um array vazio. Se você fizer isso como no exemplo abaixo terá um resultado mais satisfatório:

$("#lista-filmes").ready(function(){
    var filmes = [];
    $.get("https://www.mocky.io/v2/5ad631b32e00001000c93a96", function(data){
        console.log(data);
        console.log(typeof data);

        filmes =  data;
    console.log(filmes);
    });

});

Um recurso do javascript que ajuda a lidar com códigos assíncronos são as promises , que também aparecem no curso de javascript avançado 2

Abraços

Hmm, resolvi o problema, eu não sabia sobre síncrono e assíncrono de ajax, só fui descobrir depois do problema ^^, estou nesse curso de javascript avançado 2 , ainda não cheguei em promises, obrigado pela explicação, tirou completamente minha dúvida.