Запутался в обещаниях

Question

У меня есть следующий код, и я не могу понять, почему он не выполняет то, что я хочу. как новичок как в JS, так и в jQuery, я запутался с:

1) Даже если я не пишу код внутри функции ready (), обещания выполняются. Я имею в виду, что обещания выполняются, даже если я им не позвоню. 2) Цель этого кода - напечатать 1, 2, затем сделать паузу в 3 секунды, напечатать 3 и напечатать END. Вместо этого он печатает 1, 2, КОНЕЦ и через три секунды 3.

Я нашел другие примеры и здесь, и на других сайтах и ​​в блогах, но, будучи новичком в JS, я их не понял. Что я делаю не так?

$(document).ready(function (){
  $.when(f1)
    .then(f2)
    .then(f3)
    .then(final);
});

function prn(texto) {
  $('p').append(texto);
}

var f1 = new Promise(function(resolve, reject) {
  resolve(prn('1<br><br>'));
  reject('err');
});

var f2 = new Promise(function(resolve, reject) {
  resolve(prn('2<br><br>'));
  reject('err');
});

var f3 = new Promise(function(resolve, reject) {
  setTimeout(function(){
    resolve(prn('3<br><br>'));
    reject('err');
  }, 3000);
});

var final = new Promise(function(resolve, reject) {
  resolve(prn('END<br><br>'));
  reject('err');
});

Answer 1

В вашем коде есть пара ошибок,

1. Вы выполняете как разрешение, так и отклонение, либо разрешаете, либо отклоняете. В этом случае отклонение никогда не вызывается.

2. Вы обеспокоены тем, что он вызывается, даже не имея кода в функции .ready ---- Вы непосредственно выполняете обещания, как они выполняются тогда и там сами.

var f1 = new Promise(function(resolve, reject) {
  resolve(prn('1<br><br>'));
  reject('err');
});

Это будет выполнено немедленно, как только он увидит код.

3. Обещания, если они разрешены или отклонены, их работа выполнена. Они не могут быть решены снова. Так как они уже разрешены (в тот момент, когда вы определили их, они разрешены), и даже если вы вызовете их снова в функции загрузки, они не будут разрешены, и код внутри вашего .load ничего не выводит.

Чтобы избежать всего, сохраните обещания в функции и возвращайте их при вызове функции Я изменил код для запуска в обычном JS ...

var test = function (){
  Promise.resolve().then(f1)
    .then(f2)
    .then(f3)
    .then(final);
};

function prn(texto) {
 console.log(texto);
}

var f1 = function(){ return new Promise(function(resolve, reject) {
  resolve(prn('1<br><br>'));
})};

var f2 = function(){return new Promise(function(resolve, reject) {
  resolve(prn('2<br><br>'));
});}

var f3 = function(){return new Promise(function(resolve, reject) {
  setTimeout(function(){
    resolve(prn('3<br><br>'));
  }, 3000);
});}

var final = function(){return new Promise(function(resolve, reject) {
  resolve(prn('END<br><br>'));
});}

Answer 2

Как только Обещание определено, оно может начать выполняться, если это возможно.

Затем ожидает, если выполнение еще не закончилось, или возвращает значение resolve, если функция внутри завершена.

Вы можете избежать запуска обещания раньше, чем определив фабричную функцию, то есть функцию, которая будет создавать обещание только при вызове.