Обеспечение выполнения asyncronous '.then() в сложных обещаниях

Question

Я использую машинописный текст для написания обещаний JS. У меня есть соединение обещание, то есть обещание, которое возвращает обещание у меня есть:

test() { 
    addElement("first") 
     .then(
      function (val){ 
       addElement("second"); 
       console.log("second*); 
      }) 
      .then(
      function (val){ 
       addElement("third"); 
       console.log("third*"); 
      }); 
} 


export function addElement(elementText){ 
    return new Promise(function(resolve,reject){ 
     setTimeout(function(){ 
      resolve(); 
     }, Math.random() * 2000); 
    }) 
    .then(console.log(elementText)); 
} 

Я хотел бы эти функции, чтобы распечатать, first, second*, second, third*, third. Тем не менее, я получаю:

JS: первая JS: второй * JS: третий * JS: третий JS: второй

Как я могу получить then выполнить после названных обещаний 'then завершено?

Answer 1

Вы не , возвращающий ваше обещание в блоке then. Если вы не вернете обещание, то блок then немедленно отправит return undefined, и ничего не будет ждать его. Если вы вернете обещание вместо этого, то выполнение цепочки обещаний приостановится до тех пор, пока обещанное вами обещание не будет удовлетворено.

test() { 
    addElement("first") 
     .then(
      function (val){ 
       console.log("second*"); 
       return addElement("second"); 
      }) 
      .then(
      function (val){ 
       console.log("third*"); 
       return addElement("third"); 
      }); 
} 

Хотя лично я не считаю это «новобранец ошибка», ваше описание соответствует «Rookie Ошибка № 5» в Нолан Лоусона «We have a problem with promises»; читайте дальше для более подробного объяснения.