7.1 Callback-lərin istifadəsi
Xətaların emalı — etibarlı və dayanıqlı kod yazmağın vacib bir aspektidir. Asinxron JavaScript kodunda, xətalar həm sinxron, həm də asinxron əməliyyatlarda ortaya çıxa bilər. Xətaların düzgün idarə olunması gözlənilməz səhvlərin qarşısını almağa və istifadəçilərə faydalı səhv mesajları təqdim etməyə kömək edir. Asinxron kodda xətaların idarə olunması üçün bir neçə metod nəzərdən keçirək, bunlara callback-lər, promise-lər və async/await daxildir.
Promise-lər və async/await yarandıqdan əvvəl, asinxron kod çox vaxt callback-lərin istifadəsi ilə həyata keçirilirdi. Bu yanaşmada xətalar callback-ə ilk arqument kimi ötürülür.
Nümunə:
function fetchData(callback) {
setTimeout(() => {
const error = Math.random() > 0.5 ? new Error('Məlumatları yükləmək alınmadı') : null;
const data = error ? null : { id: 1, name: 'John Doe' };
callback(error, data);
}, 1000);
}
fetchData((error, data) => {
if (error) {
console.error('Xəta:', error);
} else {
console.log('Məlumatlar:', data);
}
});
7.2 Promise-lərin istifadəsi
Promise-lərlə xətaların işlənməsi
Promise-lər asinxron kodla işləmək üçün daha strukturlaşdırılmış bir yol təklif edir. Xətalar catch metodu ilə işlənir.
Nümunə:
function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
const error = Math.random() > 0.5 ? new Error('Məlumatları əldə etmək alınmadı') : null;
if (error) {
reject(error);
} else {
resolve({ id: 1, name: 'John Doe' });
}
}, 1000);
});
}
fetchData()
.then(data => console.log('Məlumat:', data))
.catch(error => console.error('Xəta:', error));
Async/await ilə xətaların işlənməsi
async/await asinxron kodla işləmək üçün sintaksis baxımından daha rahat bir yol təqdim edir, onu daha oxunaqlı və sinxron kod kimi görünən edir. Asinxron funksiyalarda xətalar try...catch strukturu ilə işlənə bilər.
Nümunə:
async function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
const error = Math.random() > 0.5 ? new Error('Məlumatları əldə etmək alınmadı') : null;
if (error) {
reject(error);
} else {
resolve({ id: 1, name: 'John Doe' });
}
}, 1000);
});
}
async function loadData() {
try {
const data = await fetchData();
console.log('Məlumat:', data);
} catch (error) {
console.error('Xəta:', error);
}
}
loadData();
7.3 Qlobal xətaların emalı
Asinxron kodda qlobal xətaların emalı üçün window.onError və window.onUnhandledRejection istifadə edə bilərsən.
window.onError üçün nümunə:
window.onerror = function (message, source, lineno, colno, error) {
console.error('Qlobal xəta emalçısı:', error);
};
setTimeout(() => {
throw new Error('Test xəta');
}, 1000);
window.onunhandledrejection üçün nümunə:
window.onunhandledrejection = function (event) {
console.error('Emal olunmamış rejection:', event.reason);
};
Promise.reject(new Error('Test emal olunmamış rejection'));
7.4 İstifadə nümunələri
1. Fetch ilə asinxron HTTP sorğuları və hataların emalı:
async function fetchData() {
try {
const response = await fetch('https://jsonplaceholder.typicode.com/posts/1');
if (!response.ok) {
throw new Error('Şəbəkə cavabı yaxşı olmadı');
}
const data = await response.json();
console.log('Məlumat:', data);
} catch (error) {
console.error('Fetch hatası:', error);
}
}
fetchData();
2. Promise.all ilə sorğuların paralel icrası və hataların emalı:
async function fetchMultipleData() {
try {
const [response1, response2] = await Promise.all([
fetch('https://jsonplaceholder.typicode.com/posts/1'),
fetch('https://jsonplaceholder.typicode.com/posts/2')
]);
if (!response1.ok || !response2.ok) {
throw new Error('Cavablardan biri yaxşı olmadı');
}
const data1 = await response1.json();
const data2 = await response2.json();
console.log('Məlumat 1:', data1);
console.log('Məlumat 2:', data2);
} catch (error) {
console.error('Birdən çox məlumatın alınması hatası:', error);
}
}
fetchMultipleData();
GO TO FULL VERSION