Putuskan rantai janji dan panggil fungsi berdasarkan langkah dalam rantai yang memutuskannya (ditolak)

Memperbarui:

Untuk membantu pemirsa postingan ini di masa mendatang, saya membuat demo jawaban pluma ini .

Pertanyaan:

Tujuan saya tampaknya cukup mudah.

  step(1)
  .then(function() {
    return step(2);
  }, function() {
    stepError(1);
    return $q.reject();
  })
  .then(function() {

  }, function() {
    stepError(2);
  });

  function step(n) {
    var deferred = $q.defer();
    //fail on step 1
    (n === 1) ? deferred.reject() : deferred.resolve();
    return deferred.promise;
  }
  function stepError(n) {
    console.log(n); 
  }

Masalahnya di sini adalah jika saya gagal pada langkah 1, stepError(1)DAN keduanya stepError(2)dipecat. Jika saya tidak return $q.rejectmaka stepError(2)tidak akan dipecat, tetapi step(2)akan, yang saya mengerti. Saya telah mencapai segalanya kecuali apa yang saya coba lakukan.

Bagaimana cara menulis promise sehingga saya bisa memanggil fungsi saat ditolak, tanpa memanggil semua fungsi di rantai error? Atau apakah ada cara lain untuk melakukannya?

Ini demo langsung jadi Anda punya sesuatu untuk dikerjakan.

Memperbarui:

Saya sepertinya telah menyelesaikannya. Di sini, saya menangkap kesalahan di akhir rantai dan meneruskan data reject(data)sehingga saya akan tahu masalah apa yang harus ditangani dalam fungsi kesalahan. Ini sebenarnya tidak memenuhi persyaratan saya karena saya tidak ingin bergantung pada data. Ini akan menjadi timpang, tetapi dalam kasus saya akan lebih bersih untuk melewatkan callback kesalahan ke fungsi daripada bergantung pada data yang dikembalikan untuk menentukan apa yang harus dilakukan.

Demo langsung di sini (klik).

step(1)
  .then(function() {
    return step(2);
  })
  .then(function() {
    return step(3);
  })
  .then(false, 
    function(x) {
      stepError(x);
    }
  );
  function step(n) {
    console.log('Step '+n);
    var deferred = $q.defer();
    (n === 1) ? deferred.reject(n) : deferred.resolve(n);
    return deferred.promise;
  }
  function stepError(n) {
    console.log('Error '+n); 
  }

Alasan kode Anda tidak berfungsi seperti yang diharapkan adalah karena kode tersebut melakukan sesuatu yang berbeda dari yang Anda kira.

Katakanlah Anda memiliki sesuatu seperti berikut:

stepOne()
.then(stepTwo, handleErrorOne)
.then(stepThree, handleErrorTwo)
.then(null, handleErrorThree);

Untuk lebih memahami apa yang terjadi, anggaplah ini adalah kode sinkron dengan try/ catchblok:

try {
    try {
        try {
            var a = stepOne();
        } catch(e1) {
            a = handleErrorOne(e1);
        }
        var b = stepTwo(a);
    } catch(e2) {
        b = handleErrorTwo(e2);
    }
    var c = stepThree(b);
} catch(e3) {
    c = handleErrorThree(e3);
}

The onRejectedhandler (argumen kedua then) pada dasarnya adalah mekanisme koreksi kesalahan (seperti catchblok). Jika kesalahan dilemparkan handleErrorOne, itu akan ditangkap oleh blok catch berikutnya ( catch(e2)), dan seterusnya.

Ini jelas bukan yang Anda inginkan.

Katakanlah kita ingin seluruh rantai resolusi gagal tidak peduli apa yang salah:

stepOne()
.then(function(a) {
    return stepTwo(a).then(null, handleErrorTwo);
}, handleErrorOne)
.then(function(b) {
    return stepThree(b).then(null, handleErrorThree);
});

Catatan: Kita bisa membiarkannya handleErrorOne, karena hanya akan dipanggil jika stepOneditolak (ini adalah fungsi pertama dalam rantai, jadi kita tahu bahwa jika rantai ditolak pada titik ini, itu hanya bisa karena janji fungsi itu) .

Perubahan penting adalah bahwa penangan kesalahan untuk fungsi lain bukan bagian dari rantai perjanjian utama. Sebaliknya, setiap langkah memiliki "sub-rantai" -nya sendiri dengan onRejectedyang hanya dipanggil jika langkah tersebut ditolak (tetapi tidak dapat dicapai oleh rantai utama secara langsung).

Alasan ini berhasil adalah karena keduanya onFulfilleddan onRejectedmerupakan argumen opsional untuk thenmetode tersebut. Jika sebuah promise terpenuhi (yaitu diselesaikan) dan thenrantai berikutnya tidak memiliki onFulfilledpenangan, rantai akan berlanjut sampai ada penangan dengan penangan tersebut.

Ini berarti dua baris berikut ini setara:

stepOne().then(stepTwo, handleErrorOne)
stepOne().then(null, handleErrorOne).then(stepTwo)

Tetapi baris berikut tidak sama dengan dua di atas:

stepOne().then(stepTwo).then(null, handleErrorOne)

Pustaka janji Angular $qdidasarkan pada pustaka kriskowal Q(yang memiliki API yang lebih kaya, tetapi berisi semua yang dapat Anda temukan di dalamnya $q). Dokumen API Q di GitHub terbukti berguna. Q mengimplementasikan spesifikasi Promises / A + , yang menjelaskan secara mendetail tentang cara thendan perilaku penyelesaian promise berfungsi dengan tepat.

EDIT:

Juga perlu diingat bahwa jika Anda ingin keluar dari rantai di penangan kesalahan Anda, itu perlu mengembalikan janji yang ditolak atau melempar Kesalahan (yang akan tertangkap dan dibungkus dalam janji yang ditolak secara otomatis). Jika Anda tidak mengembalikan suatu janji, thenbungkus nilai pengembaliannya dalam sebuah janji keputusan untuk Anda.

Ini berarti bahwa jika Anda tidak mengembalikan apa pun, Anda secara efektif mengembalikan janji yang telah ditetapkan untuk nilainya undefined.

Agak terlambat ke pesta tetapi solusi sederhana ini berhasil untuk saya:

function chainError(err) {
  return Promise.reject(err)
};

stepOne()
.then(stepTwo, chainError)
.then(stepThreee, chainError);

Hal ini memungkinkan Anda untuk memecahkan keluar dari rantai.

Yang Anda butuhkan adalah .then()rantai berulang dengan kasing khusus untuk memulai dan kasing khusus untuk diselesaikan.

Keahliannya adalah untuk mendapatkan nomor langkah dari kasus kegagalan untuk melewati ke penanganan kesalahan akhir.

• Mulai: panggil step(1)tanpa syarat.
• Pola berulang: rantai a .then()dengan callback berikut:
  • sukses: panggil langkah (n + 1)
  • kegagalan: membuang nilai yang sebelumnya ditangguhkan ditolak atau memunculkan kembali kesalahan.
• Selesai: rantai a .then()tanpa penangan sukses dan penangan kesalahan akhir.

Anda dapat menulis semuanya dengan tangan tetapi lebih mudah untuk mendemonstrasikan pola dengan fungsi yang diberi nama dan digeneralisasikan:

function nextStep(n) {
    return step(n + 1);
}

function step(n) {
    console.log('step ' + n);
    var deferred = $q.defer();
    (n === 3) ? deferred.reject(n) : deferred.resolve(n);
    return deferred.promise;
}

function stepError(n) {
    throw(n);
}

function finalError(n) {
    console.log('finalError ' + n);
}
step(1)
    .then(nextStep, stepError)
    .then(nextStep, stepError)
    .then(nextStep, stepError)
    .then(nextStep, stepError)
    .then(nextStep, stepError)
    .then(null, finalError);});

lihat demo

Perhatikan bagaimana masuk step(), penangguhan ditolak atau diselesaikan dengan n, sehingga membuat nilai tersebut tersedia untuk callback berikutnya .then()dalam rantai. Setelah stepErrordipanggil, kesalahan berulang kali ditampilkan kembali hingga ditangani oleh finalError.

Saat menolak, Anda harus meneruskan kesalahan penolakan, kemudian membungkus penanganan kesalahan langkah dalam fungsi yang memeriksa apakah penolakan harus diproses atau "dicabut kembali" hingga akhir rantai:

// function mocking steps
function step(i) {
    i++;
    console.log('step', i);
    return q.resolve(i);
}

// function mocking a failing step
function failingStep(i) {
    i++;
    console.log('step '+ i + ' (will fail)');
    var e = new Error('Failed on step ' + i);
    e.step = i;
    return q.reject(e);
}

// error handler
function handleError(e){
    if (error.breakChain) {
        // handleError has already been called on this error
        // (see code bellow)
        log('errorHandler: skip handling');
        return q.reject(error);
    }
    // firs time this error is past to the handler
    console.error('errorHandler: caught error ' + error.message);
    // process the error 
    // ...
    //
    error.breakChain = true;
    return q.reject(error);
}

// run the steps, will fail on step 4
// and not run step 5 and 6
// note that handleError of step 5 will be called
// but since we use that error.breakChain boolean
// no processing will happen and the error will
// continue through the rejection path until done(,)

  step(0) // 1
  .catch(handleError)
  .then(step) // 2
  .catch(handleError)
  .then(step) // 3
  .catch(handleError)
  .then(failingStep)  // 4 fail
  .catch(handleError)
  .then(step) // 5
  .catch(handleError)
  .then(step) // 6
  .catch(handleError)
  .done(function(){
      log('success arguments', arguments);
  }, function (error) {
      log('Done, chain broke at step ' + error.step);
  });

Apa yang Anda lihat di konsol:

step 1
step 2
step 3
step 4 (will fail)
errorHandler: caught error 'Failed on step 4'
errorHandler: skip handling
errorHandler: skip handling
Done, chain broke at step 4

Berikut beberapa kode yang berfungsi https://jsfiddle.net/8hzg5s7m/3/

Jika Anda memiliki penanganan khusus untuk setiap langkah, pembungkus Anda bisa seperti ini:

/*
 * simple wrapper to check if rejection
 * has already been handled
 * @param function real error handler
 */
function createHandler(realHandler) {
    return function(error) {
        if (error.breakChain) {
            return q.reject(error);
        }
        realHandler(error);
        error.breakChain = true;
        return q.reject(error);    
    }
}

lalu rantaimu

step1()
.catch(createHandler(handleError1Fn))
.then(step2)
.catch(createHandler(handleError2Fn))
.then(step3)
.catch(createHandler(handleError3Fn))
.done(function(){
    log('success');
}, function (error) {
    log('Done, chain broke at step ' + error.step);
});

Jika saya mengerti dengan benar, Anda hanya ingin menampilkan kesalahan untuk langkah yang gagal, bukan?

Itu harus sesederhana mengubah kasus kegagalan janji pertama menjadi ini:

step(1).then(function (response) {
    step(2);
}, function (response) {
    stepError(1);
    return response;
}).then( ... )

Dengan kembali $q.reject()pada kasus kegagalan langkah pertama, Anda menolak janji itu, yang menyebabkan errorCallback dipanggil di langkah kedua then(...).

var s = 1;
start()
.then(function(){
    return step(s++);
})
.then(function() {
    return step(s++);
})
.then(function() {
    return step(s++);
})
.then(0, function(e){
   console.log(s-1); 
});

http://jsbin.com/EpaZIsIp/20/edit

Atau otomatis untuk sejumlah langkah:

var promise = start();
var s = 1;
var l = 3;
while(l--) {
    promise = promise.then(function() {
        return step(s++);
    });
}
promise.then(0, function(e){
   console.log(s-1); 
});

http://jsbin.com/EpaZIsIp/21/edit

Coba ro gunakan ini seperti libs:

https://www.npmjs.com/package/promise-chain-break

    db.getData()
.then(pb((data) => {
    if (!data.someCheck()) {
        tellSomeone();

        // All other '.then' calls will be skiped
        return pb.BREAK;
    }
}))
.then(pb(() => {
}))
.then(pb(() => {
}))
.catch((error) => {
    console.error(error);
});

Jika Anda ingin menyelesaikan masalah ini menggunakan async / await:

(async function(){    
    try {        
        const response1, response2, response3
        response1 = await promise1()

        if(response1){
            response2 = await promise2()
        }
        if(response2){
            response3 = await promise3()
        }
        return [response1, response2, response3]
    } catch (error) {
        return []
    }

})()

Lampirkan penangan kesalahan sebagai elemen rantai terpisah langsung ke pelaksanaan langkah-langkah:

        // Handle errors for step(1)
step(1).then(null, function() { stepError(1); return $q.reject(); })
.then(function() {
                 // Attach error handler for step(2),
                 // but only if step(2) is actually executed
  return step(2).then(null, function() { stepError(2); return $q.reject(); });
})
.then(function() {
                 // Attach error handler for step(3),
                 // but only if step(3) is actually executed
  return step(3).then(null, function() { stepError(3); return $q.reject(); });
});

atau menggunakan catch():

       // Handle errors for step(1)
step(1).catch(function() { stepError(1); return $q.reject(); })
.then(function() {
                 // Attach error handler for step(2),
                 // but only if step(2) is actually executed
  return step(2).catch(function() { stepError(2); return $q.reject(); });
})
.then(function() {
                 // Attach error handler for step(3),
                 // but only if step(3) is actually executed
  return step(3).catch(function() { stepError(3); return $q.reject(); });
});

Catatan: Ini pada dasarnya adalah pola yang sama seperti yang disarankan oleh pluma dalam jawabannya tetapi menggunakan penamaan OP.

Promise.prototype.catch()Contoh yang ditemukan di MDN di bawah ini sangat membantu.

(Jawaban yang diterima menyebutkan then(null, onErrorHandler)yang pada dasarnya sama dengan catch(onErrorHandler).)

Menggunakan dan merangkai metode tangkapan

var p1 = new Promise(function(resolve, reject) {
  resolve('Success');
});

p1.then(function(value) {
  console.log(value); // "Success!"
  throw 'oh, no!';
}).catch(function(e) {
  console.log(e); // "oh, no!"
}).then(function(){
  console.log('after a catch the chain is restored');
}, function () {
  console.log('Not fired due to the catch');
});

// The following behaves the same as above
p1.then(function(value) {
  console.log(value); // "Success!"
  return Promise.reject('oh, no!');
}).catch(function(e) {
  console.log(e); // "oh, no!"
}).then(function(){
  console.log('after a catch the chain is restored');
}, function () {
  console.log('Not fired due to the catch');
});

Gotchas saat melempar kesalahan

// Throwing an error will call the catch method most of the time
var p1 = new Promise(function(resolve, reject) {
  throw 'Uh-oh!';
});

p1.catch(function(e) {
  console.log(e); // "Uh-oh!"
});

// Errors thrown inside asynchronous functions will act like uncaught errors
var p2 = new Promise(function(resolve, reject) {
  setTimeout(function() {
    throw 'Uncaught Exception!';
  }, 1000);
});

p2.catch(function(e) {
  console.log(e); // This is never called
});

// Errors thrown after resolve is called will be silenced
var p3 = new Promise(function(resolve, reject) {
  resolve();
  throw 'Silenced Exception!';
});

p3.catch(function(e) {
   console.log(e); // This is never called
});

Jika sudah teratasi

//Create a promise which would not call onReject
var p1 = Promise.resolve("calling next");

var p2 = p1.catch(function (reason) {
    //This is never called
    console.log("catch p1!");
    console.log(reason);
});

p2.then(function (value) {
    console.log("next promise's onFulfilled"); /* next promise's onFulfilled */
    console.log(value); /* calling next */
}, function (reason) {
    console.log("next promise's onRejected");
    console.log(reason);
});

Solusi terbaik adalah melakukan refactor pada rantai janji Anda untuk menggunakan ES6 menunggu. Kemudian Anda bisa kembali dari fungsi untuk melewati perilaku lainnya.

Saya telah membenturkan kepala saya terhadap pola ini selama lebih dari setahun dan menggunakan await's adalah surga.

Jika suatu saat Anda kembali, Promise.reject('something')Anda akan dilemparkan ke dalam blok tangkapan pada janji itu.

promiseOne
  .then((result) => {
    if (!result) {
      return Promise.reject('No result');
    }
    return;
  })
  .catch((err) => {
    console.log(err);
  });

Jika janji pertama tidak memberikan hasil apa pun, Anda hanya akan mendapatkan 'Tidak ada hasil' di konsol.

Gunakan Modul SequentialPromise

Niat

Sediakan modul yang tanggung jawabnya untuk menjalankan permintaan secara berurutan, sambil melacak indeks saat ini dari setiap operasi secara ordinal. Tentukan operasi dalam Pola Perintah untuk fleksibilitas.

Peserta

• Konteks : Objek yang metode anggotanya melakukan operasi.
• SequentialPromise : Mendefinisikan executemetode untuk merangkai & melacak setiap operasi. SequentialPromise mengembalikan Rantai-Janji dari semua operasi yang dilakukan.
• Invoker : Membuat instance SequentialPromise, memberinya konteks & tindakan, dan memanggil executemetodenya sambil meneruskan daftar opsi ordinal untuk setiap operasi.

Konsekuensi

Gunakan SequentialPromise ketika perilaku ordinal dari resolusi Promise diperlukan. SequentialPromise akan melacak indeks yang Janji ditolaknya.

Penerapan

clear();

var http = {
    get(url) {
        var delay = Math.floor( Math.random() * 10 ), even = !(delay % 2);
        var xhr = new Promise(exe);

        console.log(`REQUEST`, url, delay);
        xhr.then( (data) => console.log(`SUCCESS: `, data) ).catch( (data) => console.log(`FAILURE: `, data) );

        function exe(resolve, reject) {
            var action = { 'true': reject, 'false': resolve }[ even ];
            setTimeout( () => action({ url, delay }), (1000 * delay) );
        }

        return xhr;
    }
};

var SequentialPromise = new (function SequentialPromise() {
    var PRIVATE = this;

    return class SequentialPromise {

        constructor(context, action) {
            this.index = 0;
            this.requests = [ ];
            this.context = context;
            this.action = action;

            return this;
        }

        log() {}

        execute(url, ...more) {
            var { context, action, requests } = this;
            var chain = context[action](url);

            requests.push(chain);
            chain.then( (data) => this.index += 1 );

            if (more.length) return chain.then( () => this.execute(...more) );
            return chain;
        }

    };
})();

var sequence = new SequentialPromise(http, 'get');
var urls = [
    'url/name/space/0',
    'url/name/space/1',
    'url/name/space/2',
    'url/name/space/3',
    'url/name/space/4',
    'url/name/space/5',
    'url/name/space/6',
    'url/name/space/7',
    'url/name/space/8',
    'url/name/space/9'
];
var chain = sequence.execute(...urls);
var promises = sequence.requests;

chain.catch( () => console.warn(`EXECUTION STOPPED at ${sequence.index} for ${urls[sequence.index]}`) );

// console.log('>', chain, promises);

Inti

SequentialPromise