Estou aqui a fazer uns testes com promises:
const listaClientes = () => {
const promise = new Promise((resolve, reject) => {
const http = new XMLHttpRequest();
http.open("GET", "http://localhost:3000/profile");
for(i = 0; i < 100000; i++) {
for(x = 0; x < 10000; x++) {
}
}
http.onload = () => {
if(http.status >= 400) {
reject(JSON.parse(http.response));
}else{
resolve(JSON.parse(http.response));
}
}
http.send();
});
return promise;
}
const listaFrutas = () => {
const promise = new Promise((resolve, reject) => {
const http = new XMLHttpRequest();
http.open("GET", "http://localhost:3000/frutas");
for(i = 0; i < 100000; i++) {
for(x = 0; x < 10000; x++) {
}
}
http.onload = () => {
if(http.status >= 400) {
reject(JSON.parse(http.response));
}else{
resolve(JSON.parse(http.response));
}
}
http.send();
});
return promise;
}
const criaLinhasPessoas = (data) => {
let pessoas = "";
data.forEach(pessoa => {
pessoas += criaPessoa(pessoa);
});
return pessoas;
}
const criaPessoa = (pessoa) => {
const nome = pessoa.nome;
const email = pessoa.email;
const pessoaHtml =
`<tr>
<td class="td" data-td>${nome}</td>
<td>${email}</td>
<td>
<ul class="tabela__botoes-controle">
<li><a href="../telas/edita_cliente.html" class="botao-simples botao-simples--editar">Editar</a></li>
<li><button class="botao-simples botao-simples--excluir" type="button">Excluir</button></li>
</ul>
</td>
</tr>`;
return pessoaHtml;
}
listaClientes().then((data) => {
criaLinhasPessoas(data);
const dataTabela = document.querySelector("[data-tabela]");
dataTabela.innerHTML = criaLinhasPessoas(data);
console.log("Users obtidos");
}).then(() => {
listaFrutas().then((data) => {
console.log(data);
})
});
Quando termina a promise listaClientes eu executo uma outra promise listaFruta. Se eu tiver muitas promises encadeadas não vai dar o mesmo problema das callbacks?
Há algo que não estou a fazer bem?
Obrigado