Async/Await Eğitim Yazısı
1. Async/Await Nedir?
async ve await anahtar kelimeleri, JavaScript'te asenkron kod yazmayı daha okunabilir ve yönetilebilir hale getiren modern araçlardır.
async işaretli bir fonksiyon, her zaman bir Promise döner ve await anahtar kelimesi ise bir Promise'in sonucunu beklemek için kullanılır.
2. Async/Await Nasıl Çalışır?
Bir fonksiyon async olarak işaretlendiğinde, bu fonksiyon içinde await anahtar kelimesi kullanılabilir. await, bir Promise'in tamamlanmasını bekler ve tamamlandığında sonucu döndürür.
3. Kullanım Alanları
- Asenkron veri çekme işlemleri
- API çağrıları
- Veritabanı işlemleri
- Dosya okuma/yazma işlemleri
4. Örnekler
async function fetchData() {
let response = await fetch('https://jsonplaceholder.typicode.com/posts');
let data = await response.json();
console.log(data);
}
fetchData();
Açıklama: Bu örnek, fetch fonksiyonunu kullanarak bir API'den veri çekiyor ve sonucu konsola yazdırıyor.
async function delayedMessage() {
console.log('Mesaj gönderildi');
await new Promise(resolve => setTimeout(resolve, 2000)); // 2 saniye bekle
console.log('Mesaj alındı');
}
delayedMessage();
Açıklama: Bu örnek, 2 saniye süren bir gecikme sonrası mesaj yazdırır.
async function fetchMultipleData() {
let user = await fetch('https://jsonplaceholder.typicode.com/users/1').then(res => res.json());
let posts = await fetch('https://jsonplaceholder.typicode.com/posts?userId=1').then(res => res.json());
console.log(user);
console.log(posts);
}
fetchMultipleData();
Açıklama: Bu örnek, bir kullanıcı ve onun yazdığı gönderileri çeker ve her iki sonucu da konsola yazdırır.
async function handleError() {
try {
let response = await fetch('https://jsonplaceholder.typicode.com/invalid-endpoint');
if (!response.ok) throw new Error('Network response was not ok');
let data = await response.json();
console.log(data);
} catch (error) {
console.error('Hata:', error);
}
}
handleError();
Açıklama: Bu örnek, bir hata yönetimi ile bir API çağrısının nasıl ele alınacağını gösterir.
async function asyncReturn() {
return 'Merhaba Dünya';
}
asyncReturn().then(message => console.log(message));
Açıklama: Bu örnek, async fonksiyonunun nasıl bir Promise döndürdüğünü ve sonucunun nasıl elde edildiğini gösterir.
async function waitForCondition() {
let conditionMet = false;
// Şart sağlanana kadar bekle
while (!conditionMet) {
await new Promise(resolve => setTimeout(resolve, 1000));
conditionMet = checkCondition(); // Bu fonksiyon bir şartı kontrol eder
}
console.log('Şart sağlandı!');
}
function checkCondition() {
return Math.random() > 0.8; // Örnek şart
}
waitForCondition();
Açıklama: Bu örnek, bir şart sağlanana kadar her saniye kontrol eden bir asenkron fonksiyon gösterir.
async function fetchDataWithTimeout(url, timeout) {
let controller = new AbortController();
let id = setTimeout(() => controller.abort(), timeout);
try {
let response = await fetch(url, { signal: controller.signal });
let data = await response.json();
return data;
} catch (error) {
if (error.name === 'AbortError') {
console.error('İstek zaman aşımına uğradı');
} else {
console.error('Hata:', error);
}
} finally {
clearTimeout(id);
}
}
fetchDataWithTimeout('https://jsonplaceholder.typicode.com/posts', 5000);
Açıklama: Bu örnek, bir API çağrısının zaman aşımı yönetimini gösterir.
async function exampleNestedAwait() {
let result1 = await new Promise(resolve => setTimeout(() => resolve('Sonuç 1'), 1000));
console.log(result1);
let result2 = await new Promise(resolve => setTimeout(() => resolve('Sonuç 2'), 1000));
console.log(result2);
}
exampleNestedAwait();
Açıklama: Bu örnek, ardışık await kullanımı ile iki asenkron işlemi sırasıyla gösterir.
async function multipleAwait() {
let [data1, data2] = await Promise.all([
new Promise(resolve => setTimeout(() => resolve('Veri 1'), 2000)),
new Promise(resolve => setTimeout(() => resolve('Veri 2'), 1000))
]);
console.log(data1);
console.log(data2);
}
multipleAwait();
Açıklama: Bu örnek, birden fazla Promise'in paralel olarak await edilmesini gösterir.
async function exampleReturnValue() {
let value = await new Promise(resolve => setTimeout(() => resolve(42), 500));
return value;
}
exampleReturnValue().then(result => console.log(result));
Açıklama: Bu örnek, bir asenkron fonksiyonun nasıl bir değer döndürebileceğini gösterir.
async function exampleWithErrorHandling() {
try {
let data = await fetch('https://jsonplaceholder.typicode.com/posts/1').then(res => res.json());
console.log(data);
} catch (error) {
console.error('Hata:', error);
}
}
exampleWithErrorHandling();
Açıklama: Bu örnek, bir API çağrısının hata yönetimini gösterir.
async function sequentialRequests() {
let response1 = await fetch('https://jsonplaceholder.typicode.com/posts/1');
let data1 = await response1.json();
console.log('Post 1:', data1);
let response2 = await fetch('https://jsonplaceholder.typicode.com/posts/2');
let data2 = await response2.json();
console.log('Post 2:', data2);
}
sequentialRequests();
Açıklama: Bu örnek, ardışık iki API çağrısını gösterir.
async function fetchDataWithRetry(retries = 3) {
for (let i = 0; i < retries; i++) {
try {
let response = await fetch('https://jsonplaceholder.typicode.com/posts');
if (!response.ok) throw new Error('Network response was not ok');
let data = await response.json();
return data;
} catch (error) {
console.error('Hata:', error);
if (i === retries - 1) throw error;
}
}
}
fetchDataWithRetry().then(data => console.log(data));
Açıklama: Bu örnek, belirli sayıda deneme ile veri çekme işlemini gösterir.
async function parallelRequests() {
let [userResponse, postsResponse] = await Promise.all([
fetch('https://jsonplaceholder.typicode.com/users/1'),
fetch('https://jsonplaceholder.typicode.com/posts?userId=1')
]);
let user = await userResponse.json();
let posts = await postsResponse.json();
console.log(user);
console.log(posts);
}
parallelRequests();
Açıklama: Bu örnek, birden fazla API çağrısını paralel olarak gerçekleştirir.
async function fetchWithTimeout(url, timeout) {
let controller = new AbortController();
let timeoutId = setTimeout(() => controller.abort(), timeout);
try {
let response = await fetch(url, { signal: controller.signal });
let data = await response.json();
return data;
} catch (error) {
console.error('Hata:', error);
} finally {
clearTimeout(timeoutId);
}
}
fetchWithTimeout('https://jsonplaceholder.typicode.com/posts', 1000);
Açıklama: Bu örnek, belirli bir zaman aşımı süresi ile veri çekme işlemini gösterir.
async function retryFetch(url, retries) {
for (let attempt = 0; attempt < retries; attempt++) {
try {
let response = await fetch(url);
if (!response.ok) throw new Error('Network response was not ok');
let data = await response.json();
return data;
} catch (error) {
if (attempt === retries - 1) throw error;
}
}
}
retryFetch('https://jsonplaceholder.typicode.com/posts', 3)
.then(data => console.log(data))
.catch(error => console.error('Hata:', error));
Açıklama: Bu örnek, belirli bir sayıda denemeyle veri çekme işlemini gösterir.
async function fetchUserData() {
let response = await fetch('https://jsonplaceholder.typicode.com/users/1');
let user = await response.json();
console.log(user);
}
async function fetchPostData() {
let response = await fetch('https://jsonplaceholder.typicode.com/posts/1');
let post = await response.json();
console.log(post);
}
async function fetchAllData() {
await Promise.all([fetchUserData(), fetchPostData()]);
}
fetchAllData();
Açıklama: Bu örnek, iki asenkron işlevin paralel olarak nasıl çalıştırıldığını gösterir.
async function fetchPostsWithDelay() {
let response = await fetch('https://jsonplaceholder.typicode.com/posts');
let posts = await response.json();
console.log(posts);
}
setTimeout(fetchPostsWithDelay, 2000);
Açıklama: Bu örnek, bir asenkron işlevin belirli bir gecikme ile nasıl çağrıldığını gösterir.
async function fetchDataWithDelay() {
let response = await fetch('https://jsonplaceholder.typicode.com/posts');
await new Promise(resolve => setTimeout(resolve, 2000)); // 2 saniye bekle
let data = await response.json();
console.log(data);
}
fetchDataWithDelay();
Açıklama: Bu örnek, veri çekme ve sonra gecikme ekleme işlemini gösterir.
async function processSequentialRequests() {
let result1 = await fetch('https://jsonplaceholder.typicode.com/posts/1').then(res => res.json());
console.log(result1);
let result2 = await fetch('https://jsonplaceholder.typicode.com/posts/2').then(res => res.json());
console.log(result2);
}
processSequentialRequests();
Açıklama: Bu örnek, iki ardışık API çağrısını ve sonuçlarını gösterir.
async function fetchDataInLoop() {
for (let i = 0; i < 3; i++) {
let response = await fetch('https://jsonplaceholder.typicode.com/posts/1');
let data = await response.json();
console.log(`Veri ${i + 1}:`, data);
}
}
fetchDataInLoop();
Açıklama: Bu örnek, bir döngü içinde asenkron veri çekme işlemini gösterir.
async function fetchPostWithRetry() {
let attempts = 3;
while (attempts > 0) {
try {
let response = await fetch('https://jsonplaceholder.typicode.com/posts/1');
let data = await response.json();
console.log(data);
break;
} catch (error) {
console.error('Hata:', error);
attempts--;
if (attempts === 0) throw error;
}
}
}
fetchPostWithRetry();
Açıklama: Bu örnek, bir API çağrısının belirli bir sayıda deneme ile nasıl yapılacağını gösterir.
async function fetchDataWithProgress() {
let progress = 0;
async function updateProgress() {
progress += 10;
console.log(`İlerleme: ${progress}%`);
if (progress < 100) {
await new Promise(resolve => setTimeout(resolve, 500)); // 0.5 saniye bekle
await updateProgress();
}
}
await updateProgress();
}
fetchDataWithProgress();
Açıklama: Bu örnek, bir işin ilerleme durumunu asenkron olarak günceller.
async function fetchDataWithDelayAndRetry() {
let maxRetries = 3;
for (let attempt = 0; attempt < maxRetries; attempt++) {
try {
let response = await fetch('https://jsonplaceholder.typicode.com/posts');
let data = await response.json();
console.log(data);
return data;
} catch (error) {
console.error('Hata:', error);
if (attempt === maxRetries - 1) throw error;
await new Promise(resolve => setTimeout(resolve, 1000)); // 1 saniye bekle
}
}
}
fetchDataWithDelayAndRetry();
Açıklama: Bu örnek, hem gecikme hem de yeniden deneme stratejisi ile veri çekmeyi gösterir.
async function fetchAndProcessData() {
let data = await fetch('https://jsonplaceholder.typicode.com/posts/1').then(res => res.json());
console.log('Veri alındı:', data);
let processedData = await processData(data);
console.log('İşlenmiş veri:', processedData);
}
async function processData(data) {
await new Promise(resolve => setTimeout(resolve, 1000)); // İşlem simülasyonu
return data;
}
fetchAndProcessData();
Açıklama: Bu örnek, veriyi çekip işlemek için asenkron fonksiyonların nasıl kullanılacağını gösterir.