setTimeout وsetInterval وانحراف المؤقت
جدوِلوا المهام لمرة واحدة والمتكررة باستخدام setTimeout وsetInterval، وتعلّموا أسلوبًا بسيطًا لتقليل انحراف المؤقت
setTimeout وsetInterval وانحراف المؤقت درس مجاني في JavaScript Academy على CoddyKit. هذا هو الدرس 1 من أصل 3. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في JavaScript Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة JavaScript Academy 3 دروس في المجموع.
مقدمة إلى المؤقتات
الهدف: جدولة العمل بطريقة منظمة.
- setTimeout: التشغيل لاحقًا (مرة واحدة)
- setInterval: التشغيل بشكل متكرر
- الانحراف: سبب تأخر المؤقتات
- إصلاح بسيط للانحراف

setTimeout — لمرة واحدة
ينفذ setTimeout(fn, ms) مرة واحدة بعد التأخير، مع توقيت أدنى وليس توقيتًا دقيقًا.
// setTimeout schedules a one-off callback
console.log("A: start");
setTimeout(function () {
console.log("B: after ~5ms");
}, 5);
console.log("C: scheduled");

setInterval — بشكل متكرر
يكرر setInterval التنفيذ تلقائيًا؛ استخدموا clearInterval(id) لإيقافه.
// setInterval repeats; always clear it
let count = 0;
const id = setInterval(function () {
count = count + 1;
console.log("tick", count);
// Stop after 3 ticks to avoid endless logs
if (count >= 3) {
clearInterval(id);
console.log("stopped");
}
}, 5);

شاهدوا الانحراف أثناء حدوثه
تختلف الفواصل الزمنية الفعلية؛ ويتسبب العمل وحمل الجهاز وحلقة الأحداث في حدوث انحراف.
// Drift demo: expected vs actual timing
const targetMs = 5;
let last = Date.now();
let times = 0;
const driftId = setInterval(function () {
const now = Date.now();
const gap = now - last; // actual gap
last = now;
times = times + 1;
console.log("gap~", gap, "ms");
if (times >= 3) {
clearInterval(driftId);
console.log("done");
}
}, targetMs);

الجدولة المتزامنة
حاذوا التنفيذ مع وقت متوقّع يتقدم باستمرار: احسبوا التأخير التالي انطلاقًا منه لتجنب تراكم الخطأ.
// Simple drift fix: schedule from the expected time
const step = 5;
let expected = Date.now() + step;
let ticks = 0;
function tick() {
ticks = ticks + 1;
const now = Date.now();
const drift = now - expected; // positive if we are late
console.log("drift:", drift, "ms");
// Compute next expected time first
expected = expected + step;
// Next delay = time until the next expected timestamp
const nextDelay = Math.max(0, expected - Date.now());
if (ticks < 3) {
setTimeout(tick, nextDelay);
} else {
console.log("aligned stop");
}
}
setTimeout(tick, step);

نصائح وقائمة تحقق
نصائح:
- احرصوا دائمًا على استخدام clearInterval عند الانتهاء.
- فضّلوا حلقات setTimeout المتزامنة للحفاظ على وتيرة ثابتة.
- اجعلوا استدعاءات المؤقت قصيرة لتقليل الانحراف.

اختبار إصلاح الانحراف
تحقق سريع: تقليل الانحراف.

مراجعة
مراجعة: استخدموا setTimeout للتنفيذ مرة واحدة، وsetInterval للتكرار مع تذكر إيقافه، وقللوا الانحراف بمحاذاة عمليات التشغيل التالية مع الأوقات المتوقعة.

الأسئلة الشائعة
هل درس «setTimeout وsetInterval وانحراف المؤقت» مجاني؟
نعم — نص درس «setTimeout وsetInterval وانحراف المؤقت» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة JavaScript Academy، انتقل إلى CoddyKit PRO. تتضمن دورة JavaScript Academy 3 دروس في المجموع.
ماذا ستتعلم في «setTimeout وsetInterval وانحراف المؤقت»؟
جدوِلوا المهام لمرة واحدة والمتكررة باستخدام setTimeout وsetInterval، وتعلّموا أسلوبًا بسيطًا لتقليل انحراف المؤقت تتمرن على JavaScript Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ JavaScript Academy؟
لا تُشترط خبرة سابقة. JavaScript Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 3.
كم من الوقت يستغرق درس «setTimeout وsetInterval وانحراف المؤقت»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس JavaScript Academy هذا؟
نعم. كل درس في JavaScript Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- setTimeout وsetInterval وانحراف المؤقت
- Debounce مقابل Throttle — بالتنفيذ اليدوي
- توقيت التحريك — مقدمة عن الحلقات المعتمدة على الوقت