JavaScript Academy · Ders

queueMicrotask ve Sıralama

Yürütme sırasını kesin olarak kontrol edin.

queueMicrotask ve Sıralama, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 4. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 4 dersten oluşur.

queueMicrotask ile Tanışın

queueMicrotask, bir vaat oluşturmadan doğrudan mikro görev zamanlamanızı sağlar. Geri çağırma işlevi, mevcut eşzamanlı koddan sonra ancak herhangi bir makro görevden önce çalışır.

Çalışmayı bir sonraki mikro görev kontrol noktasına ertelemenin en temiz yolu budur.

Temel Kullanım

queueMicrotask'a bir işlev aktarın. Bu işlev, eşzamanlı kod tamamlandıktan sonra çalışır.

console.log('start');
queueMicrotask(() => console.log('microtask'));
console.log('end');

Vaatlerle Aynı Öncelik

Bir queueMicrotask geri çağırma işlevi ile bir vaat .then'i aynı mikro görev kuyruğunu paylaşır. Zamanlanma sıralarına göre çalışırlar.

queueMicrotask(() => console.log('qmt 1'));
Promise.resolve().then(() => console.log('promise'));
queueMicrotask(() => console.log('qmt 2'));
console.log('sync');

setTimeout'u Geçer

Tüm mikro görevler gibi, bir queueMicrotask geri çağırma işlevi de daha önce zamanlanmış olsa bile herhangi bir setTimeout makro görevinden önce çalışır.

setTimeout(() => console.log('timeout (macro)'), 0);
queueMicrotask(() => console.log('microtask (micro)'));
console.log('sync');

Tüketim İçindeki Sıralama

Mikro görevler FIFO sırasıyla çalışır. Kuyruğa ilk eklenen görev, kuyruk tüketildiğinde ilk çalışır.

queueMicrotask(() => console.log('1'));
queueMicrotask(() => console.log('2'));
queueMicrotask(() => console.log('3'));
console.log('sync done');

Mikro Görevleri İç İçe Zamanlama

Bir mikro görev başka bir mikro görevi kuyruğa ekleyebilir. Yeni görev, o anda kuyruğa eklenmiş görevlerden sonra, aynı tüketim sırasında ve herhangi bir makro görevden önce çalışır.

queueMicrotask(() => {
  console.log('A');
  queueMicrotask(() => console.log('C (nested)'));
});
queueMicrotask(() => console.log('B'));
setTimeout(() => console.log('D (macro)'), 0);
console.log('sync');

Tam Sıralama Gösterimi

Eşzamanlı kodu, mikro görevleri ve bir makro görevi birleştirin. Kuralı izleyin: önce eşzamanlı işlemler, sonra sıralı mikro görevler, ardından zamanlayıcı.

console.log('1 sync');
setTimeout(() => console.log('5 macro'), 0);
queueMicrotask(() => console.log('3 micro'));
Promise.resolve().then(() => console.log('4 micro'));
console.log('2 sync');

Eşzamansız/Bekleme ile İç İçe Çalışma

Bir await devam işlemi de mikro görevdir; bu nedenle queueMicrotask ile zamanlama sırasına göre iç içe çalışır.

async function task() {
  console.log('a');
  await null;
  console.log('d (after await)');
}
queueMicrotask(() => console.log('c (queueMicrotask)'));
task();
console.log('b');

queueMicrotask Neden Kullanılır?

Mevcut çağrı yığınından sonra ancak tarayıcı görüntü oluşturmadan veya herhangi bir zamanlayıcı çalışmadan önce küçük bir işi ertelemeniz gerektiğinde kullanın. Geçici bir vaat oluşturmanın ek yükünü ve çözümleme davranışını ortadan kaldırır.

let ready = false;
queueMicrotask(() => {
  ready = true;
  console.log('ready is now', ready);
});
console.log('ready is', ready);

Sonsuz Mikro Görev Döngülerinden Kaçının

Mikro görevler makro görevlerden önce tamamen tüketildiğinden, kendisini sürekli yeniden kuyruğa ekleyen bir geri çağırma işlevi zamanlayıcıları ve görüntülemeyi sonsuza kadar engeller. Her zaman bir durma koşulu belirleyin.

let n = 0;
function step() {
  if (n++ < 3) {
    console.log('step ' + n);
    queueMicrotask(step);
  }
}
setTimeout(() => console.log('macro runs after all micros'), 0);
step();

Eksiksiz Zihinsel Model

Her olay döngüsü turunda bir makro görevi (veya başlangıç betiğini) çalıştırın, ardından her mikro görevi tüketin, sonra görüntüleyin ve tekrarlayın. queueMicrotask, bu tüketim aşamasına tam olarak bağlanmanızı sağlar.

console.log('script start');
setTimeout(() => console.log('setTimeout'), 0);
queueMicrotask(() => console.log('queueMicrotask'));
Promise.resolve().then(() => console.log('promise then'));
console.log('script end');

Kısa Kontrol

Bir queueMicrotask geri çağırma işlevi, setTimeout(fn, 0)'a göre nerede çalışır?

Özet: queueMicrotask ve Sıralama

İnce ayrıntılı zamanlamayı öğrendiniz:

queueMicrotask, vaat kullanmadan bir mikro görev zamanlar.
Vaat geri çağırmalarıyla mikro görev kuyruğunu FIFO sırasıyla paylaşır.
Tüm mikro görevler, herhangi bir makro görevden ve görüntülemeden önce tüketilir.
Döngü modeli: makro görev, mikro görevleri tüketme, görüntüleme, tekrarlama.

Sıkça Sorulan Sorular

“queueMicrotask ve Sıralama” dersi ücretsiz mi?

Evet — “queueMicrotask ve Sıralama” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 4 dersten oluşur.

“queueMicrotask ve Sıralama” dersinde ne öğreneceğim?

Yürütme sırasını kesin olarak kontrol edin. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 4. dersidir.

“queueMicrotask ve Sıralama” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← JavaScript Academy Sayfasına Dön