Promise,Calback hell,async/await Â
Calback hell example
getData(function(data) {
processData(data, function(processedData) {
saveData(processedData, function() {
console.log('Data saved successfully!');
});
});
});
function getData(callback) {
setTimeout(function() {
var data = { name: 'John', age: 30 };
callback(data);
}, 1000);
}
function processData(data, callback) {
setTimeout(function() {
data.city = 'New York';
callback(data);
}, 1000);
}
function saveData(data, callback) {
setTimeout(function() {
// Code to save data
callback();
}, 1000);
}
getData funksiyasi birinchi argument sifatida callback olishi mumkin va bu funksiya o'z ichiga 1 sekundlik biron ishni bajaradi va ishni bajarib chiqadigan ma'lumotlarni (name: 'John', age: 30) callback orqali qaytaradi.
processData funksiyasi birinchi argument sifatida ma'lumot olishi mumkin va bu funksiya o'z ichiga 1 sekundlik biron ishni bajaradi va ma'lumotga "city" (shahar) qiymatini qo'shadi va shu ma'lumotni callback orqali qaytaradi.
saveData funksiyasi birinchi argument sifatida ma'lumot olishi mumkin va bu funksiya o'z ichiga 1 sekundlik biron ishni bajaradi va ma'lumotni saqlash uchun kerakli kodlarni ishga tushiradi. Saqlash amaliyoti yakunlanganda, funksiya keyingi callback funksiyasini chaqiradi.
Promise ga o'tkazilgan versiyasi
// getData funksiyasi Promisga o'zgartirilgan versiyasi
function getDataPromise() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
var data = { name: 'John', age: 30 };
resolve(data);
}, 1000);
});
}
// processData funksiyasi Promisga o'zgartirilgan versiyasi
function processDataPromise(data) {
return new Promise(function(resolve, reject) {
setTimeout(function() {
data.city = 'New York';
resolve(data);
}, 1000);
});
}
// saveData funksiyasi Promisga o'zgartirilgan versiyasi
function saveDataPromise(data) {
return new Promise(function(resolve, reject) {
setTimeout(function() {
// Code to save data
resolve();
}, 1000);
});
}
// Promislar orqali natija
getDataPromise()
.then(processDataPromise)
.then(saveDataPromise)
.then(function() {
console.log('Data saved successfully!');
})
.catch(function(error) {
console.error(error);
});
barchasi bir natijaga e'tibor berilganligi uchun Promise.all bn qilingan holati
Promise.all([getDataPromise(), processDataPromise(), saveDataPromise()])
.then(function(results) {
console.log('Data saved successfully!', results);
})
.catch(function(error) {
console.error(error);
});
async/await holati (try catch)
async function processDataAsync() {
try {
const data = await getDataPromise();
const processedData = await processDataPromise(data);
await saveDataPromise(processedData);
console.log('Data saved successfully!');
} catch (error) {
console.error(error);
}
}
Bu kodda, processDataAsync() nomli funksiya yaratilgan, unda await operatorti foydalanilb Promislar ishlatilgan. try...catch bloklari xatolikni aniqlash uchun ishlatilgan.
await operatori Promisni yakunlashini kutimoqda va natijani data, processedData va saveDataPromise() o'zgaruvchilariga saqlaydi. Keyingi qadamlar faqat oldingi Promis yakunlanishi bilan boshlanadi. saveDataPromise() natijasi konsolga "Data saved successfully!" xabarini chiqaradi. Xatolik yuzaga kelsa, catch bloki ishga tushadi va xatolikni chiqaradi.