#javascript #asynchronous #promise
Вопрос:
У меня есть две функции, которые содержат асинхронную операцию, возвращающую список. Я использую все обещания, чтобы выполнить их в одно и то же время. Первый список работает, но второй показывает мне неопределенный.
let content = "<div class='clsLines'>";
return Promise.all([
firstList()
]).then((messages) => {
content = messages
secondList()
}).then((messages) => {
content = messages
content ="</div>"; // close clsLinesDiv
$('#id').find('.cls').append(content); // append the lists in a div
});
Как я могу отобразить второй список вместо неопределенного?
Должно ли закрытие div и добавления быть внутри или снаружи обещания
Спасибо!
Комментарии:
1. Вы не выполняете их одновременно. Вы начинаете
secondList()
послеfirstList()
. Но, несмотря на это, вы видите то, что видите, потому что вам не хватаетreturn
утверждения:secondList()
-> >return secondList();
.2. Ваши
then
обратные вызовы должны возвращать обещанное значение, которое должен получить следующий.3. Ваше
Promise.all
довольно бесполезно, так как вы передаете только одно обещание. Так и должно бытьPromise.all([firstList(), secondList()])
.
Ответ №1:
Вы не выполняете их одновременно. Вы начинаете secondList()
после firstList()
. Но, несмотря на это, вы видите то, что видите, потому что вам не хватает return
утверждения. Это должно быть
.then((messages) => {
content = messages
return secondList()
})
Однако вы действительно могли бы выполнить эти обещания «параллельно» и избежать общих переменных:
Promise.all([firstList(), secondList()])
.then(([firstResult, secondResult]) => {
$('#id').find('.cls')
.append(`<div class='clsLines'>${firstResult}${secondResult}</div>`);
})