Dapatkah seseorang menjelaskan mengapa mengembalikan janji Axios memungkinkan untuk rantai lebih lanjut, tetapi mengembalikan setelah menerapkan metode then()/catch()
tidak?
Contoh:
const url = 'https://58f58f38c9deb71200ceece2.mockapi.io/Mapss'
function createRequest1() {
const request = axios.get(url)
request
.then(result => console.log('(1) Inside result:', result))
.catch(error => console.error('(1) Inside error:', error))
return request
}
function createRequest2() {
const request = axios.get(url)
return request
.then(result => console.log('(2) Inside result:', result))
.catch(error => console.error('(2) Inside error:', error))
}
createRequest1()
.then(result => console.log('(1) Outside result:', result))
.catch(error => console.error('(1) Outside error:', error))
createRequest2()
.then(result => console.log('(2) Outside result:', result))
.catch(error => console.error('(2) Outside error:', error))
<script src="https://unpkg.com/[email protected]/dist/axios.min.js"></script>
Saya mengerti bahwa metode Promise harus mengembalikan nilai untuk dirantai, tetapi mengapa ada perbedaan antara kedua metode pengembalian ini?
Contoh pertama Anda mengembalikan janji asli. Contoh kedua Anda mengembalikan *janji yang berbeda, yang dibuat dengan memanggil catch
.
Perbedaan penting antara keduanya adalah:
Pada contoh kedua Anda, Anda tidak meneruskan nilai resolusi, sehingga janji yang dikembalikan oleh maka
Anda diselesaikan dengan undefined
(nilai yang dikembalikan dari console.log
).
Pada contoh kedua, anda mengubah penolakan menjadi resolusi dengan undefined
(dengan mengembalikan hasil dari console.log
dari catch
). Handler catch
yang tidak melempar atau mengembalikan janji yang ditolak akan mengubah penolakan menjadi resolusi.
Salah satu hal penting tentang rantai janji adalah bahwa mereka mengubah hasilnya; setiap panggilan ke then
atau catch
menciptakan janji baru, dan penangannya dapat memodifikasi apa yang dikirim ke hilir saat hasilnya melewati mereka.
Pola yang biasa memang akan mengembalikan hasil dari rantai, tetapi fungsi-fungsi dalam rantai tersebut dengan sengaja mentransformasikan hasilnya atau meneruskannya. Biasanya, Anda tidak akan memiliki catch
handler kecuali di ujung terminal rantai, kecuali jika Anda menggunakannya untuk memperbaiki kondisi kesalahan (dengan sengaja mengubah penolakan menjadi resolusi).
Jika Anda hanya ingin mencatat apa yang telah dilewati sambil tetap mengizinkan pemanggil untuk melihatnya tetapi did ingin mengembalikan hasil dari rantai untuk alasan apa pun, Anda akan melakukan ini:
return request
.then(result => { console.log(result); return result; })
.catch(error => { console.error(error); return Promise.reject(error); });
atau menggunakan throw
:
return request
.then(result => { console.log(result); return result; })
.catch(error => { console.error(error); throw error; });