مؤقت في JavaScript

هي وظائف تجعلنا قادرين على تنفيذ وظيفة في وقت محدد.

باستخدام وظائف الوقت، يمكنك تأخير تنفيذ الكود لتجنب إكمال الكود في اللحظة المحددة لتحفيز الحدث.

هناك وظيفتان للوقت في لغة JavaScript:

• setTimeout(function, milliseconds) - بعد إنتظار الميليسي ثانية المحددة تنفيذ الدالة(function)

• setInterval(function, milliseconds) - مثل setTimeout()، ولكن يتم تنفيذ الدالة بشكل متكرر (function)

هذهsetTimeout()وsetInterval()هي الطريقةمفهوم النافذة، يمكن كتابة السمة بدون كتابة السمة "window".

طريقة setTimeout()

setTimeout()يستخدم هذا الطريقة لتنفيذ الدالة أو الكود المحدد بعد فترة زمنية معينة.

النحو:}

window.setTimeout(function, milliseconds)

المعدل الأول هو الدالة التي سيتم تنفيذها.

المعدل الثاني يشير إلى عدد الميليسي ثانية قبل التنفيذ (1 ثانية = 1000 ميليسي ثانية).

في هذا المثال، سيتم عرض رسالة التحذير بعد 2 ثوانٍ من النقر على الزر 2:

<button onclick="setTimeout(myFunc, 2000)">انقر</button>
<script>
function myFunc() {
　　alert("Hello World");
}
</script>

يوقف تنفيذ الكود

clearTimeout()يوقف تنفيذ الدالة المحددة في setTimeout().

النحو:}

window.clearTimeout(var)

clearTimeout()يستخدم هذا الطريقة باستخدام المتغير الذي يعود منه setTimeout().

　　t = setTimeout();
　　clearTimeout(t);

إذا لم يتم تنفيذ الدالة بعد، يمكن تنفيذها عن طريق استدعاءclearTimeout()يستخدم هذا الطريقة لوقف التنفيذ.

مثل المثال السابق، لكن أضف زر "توقف":

<button onclick="myFunc()">انقر</button>
<button onclick="myStopFunc()">توقف التحذير</button>
<script>
var t;
function myFunc() {
　　t = setTimeout(function() { alert("Hello world"); }, 2000);
}
function myStopFunc() {
　　clearTimeout(t);
}
</script>

طريقة setInterval()

setInterval()يكرر الدالة إعادة تمديد دالة مع فترة زمنية ثابتة بين كل استدعاء.

النحو:}

window.setInterval(function, milliseconds)

المعدل الأول هو الدالة التي سيتم تنفيذها.

المعدل الثاني يشير إلى طول فترة الوقت بين كل تنفيذ.

في هذا المثال، يتم تنفيذ الدالة المسمى "startTimer" مرة واحدة في كل ثانية (مثل الساعة الرقمية):

//يتم تنفيذstartTimer()مرة واحدة في الثانية
setInterval(startTimer, 1000);
function　startTimer()　{
　　var　date　=　new　Date();
　　document.getElementById("result").innerHTML　=　date.toLocaleTimeString();
}

يوقف تنفيذ الكود

clearInterval()يوقف تنفيذ الدالة المحددة في setInterval().

النحو:}

window.clearInterval(var)

clearInterval()استخدام المتغيرات منsetInterval()في الطريقة

　　t　=　setInterval();
　　clearInterval(t);

مثل المثال السابق، لكن أضف زر "توقف":

//يتم تنفيذstartTimer()مرة واحدة في الثانية
var　t　=　setInterval(startTimer,　1000);
function　startTimer()　{
　　var　date　=　new　Date();
　　document.getElementById("result").innerHTML　=　date.toLocaleTimeString();
}
//إلغاء استخدامsetInterval()لإنشاء الأفعال التكرارية
function　stopTimer()　{
　　　clearInterval(t);
}

مزيد من الأمثلة

انقر على الزر "بدء العد" أدناه لبدء التمييز. انقر على الزر "توقف العد" لوقف التمييز:

انقر على الزر "بدء التقدم" أدناه لبدء شريط التقدم. انقر على الزر "توقف التقدم" لوقف شريط التقدم: