في هذا الدرس 5تصفّح المواضيع
عن طريق بعض الدوال وهي:
- ()setTimeout هي دالة تسمح لك بتشغيل مجموعة أوامر برمجية مرة واحدة بعد فترة زمنية محددة (بالمللي ثانية).
- ()setInterval. هي دالة تسمح لك بتشغيل مجموعة أوامر برمجية عدة مرات بشكل متكرر بعد فترة زمنية محددة (بالمللي ثانية).
- ()clearTimeout هي دالة تقوم بإيقاف تنفيذ دالة ()setTimeout.
- ()clearInterval هي دالة تقوم بإيقاف تنفيذ دالة ()setInterval.
هذه الدوال مفيدة في إنشاء صفحات ويب ديناميكية وتفاعلية عن طريق جدولة وإلغاء أوامر برمجية المتكررة أو التي تتم لمرة واحدة بعد وقت محدد.
امثلة علي ذلك:
- اخقاء أو إظهار اجزاء من صفحة الويب بعد وقت محدد.
- عمل ساعة فعلية ويمكن ضبطها علي حسب اي توقيت محلي أو عالمي.
- معرض الصور ويقوم بتحريك مجموعة صور بشكل صورة بعد صورة بعد عدد ثوان محدد.
تُستخدم دالة أو طريقة ()setTimeout في لغة جافا سكريبت لتنفيذ دالة أو كتلة تعليمات برمجية مرة واحدة فقط بعد فترة زمنية محددة.
JavaScript setTimeout Method syntax
طريقة كتابة دالة أو طريقة setTimeout في لغة جافا سكريبت.
window.setTimeout(function, milliseconds);معطيات أو عوامل دالة ()setTimeout في لغة جافا سكريبت:
- function العامل الأول هو دالة أو كتلة التعليمات البرمجية المراد تنفيذها.
- milliseconds العامل الثاني هو الفاصل الزمني بالمللي ثانية الذي يجب بعده تنفيذ الدالة.
قيم دالة أو طريقة ()setTimeout في لغة جافا سكريبت:
- intervalID ترجع طريقة ()setTimeout عدد صحيح موجب وهو القيمة الحالية لمرات التنفيذ.
JavaScript setTimeout Method
سوف يتم تنفيذ الدالة بعد ثلاث ثوان تبدأ من بعد النقر علي زر start في المثال التالي.
function start() {
alert('CloseTag');
}
btn.addEventListener('click',()=>{
setTimeout(start, 3000)
});JavaScript setTimeout Method with intervalID
سوف يتم تنفيذ الدالة بعد ثلاث ثوان تبدأ من بعد النقر علي زر start في المثال التالي في كل مره يتم النقر علي زر start سوف يكون intervalID برقم مختلف وهو رقم مرة التكرار.
function start() {
alert('CloseTag');
}
btn.addEventListener('click',()=>{
let time = setTimeout(start, 3000)
alert(time)
});تُستخدم دالة أو طريقة ()setInterval في لغة جافا سكريبت لتنفيذ دالة أو كتلة تعليمات برمجية عدة مرات بعد فترة زمنية محددة.
JavaScript setInterval Method syntax
طريقة كتابة دالة أو طريقة setInterval في لغة جافا سكريبت.
window.setInterval(function, milliseconds);معطيات أو عوامل دالة ()setInterval في لغة جافا سكريبت:
- function العامل الأول هو دالة أو كتلة التعليمات البرمجية المراد تنفيذها.
- milliseconds العامل الثاني هو الفاصل الزمني بالمللي ثانية الذي يجب بعده تنفيذ الدالة وتكرار تنفيذها بشكل متكرر بعد مرور هذا الوقت.
قيم دالة أو طريقة ()setInterval في لغة جافا سكريبت:
- intervalID ترجع طريقة ()setTimeout عدد صحيح موجب وهو القيمة الحالية لمرات التنفيذ.
JavaScript setInterval Method
سوف يتم تنفيذ الدالة بعد ثلاث ثوان تبدأ من بعد النقر علي زر start في المثال التالي.
function start() {
alert('CloseTag');
}
btn.addEventListener('click',()=>{
setInterval(start, 3000)
});JavaScript setInterval Method with intervalID
سوف يتم تنفيذ الدالة بعد ثلاث ثوان تبدأ من بعد النقر علي زر start في المثال التالي في كل مره intervalID يكون برقم مختلف وهو رقم مرة التكرار.
function start() {
alert('CloseTag');
}
btn.addEventListener('click',()=>{
setInterval(start, 3000)
});ال clearTimeout() method تمنع تنفيذ الاوامر البرمجية التي توجد داخل الدالة التي تنفذ بعد فترة زمنية بداخل ال setTimeout()
تعمل دالة clearTimeout () في جافا سكريبت على مسح المهلة او الزمن الموقت التي تم تعيينها بواسطة وظيفة setTimeout () قبل ذلك.
Syntax
window.clearTimeout(timeoutVariable)اذا لم تنفذ ال function داخل ال setTimeout() يمكننا ايقاف تنفيذ الاوامر البرمجية قبل مرور الوقت المحدد
<button onclick="myVar = setTimeout(myFunction, 3000)">Try it</button>
<button onclick="clearTimeout(myVar)">Stop it</button>ال setInterval() method تقوم بتكرار الدالة function مع مرور الفترة الزمنية المحددة بداخل setInterval
تقوم دالة setInterval () ، المعروضة على واجهات Window and Worker ، باستدعاء دالة بشكل متكرر أو تنفيذ بعض الأكواد ، مع تأخير زمني ثابت بين كل مره.
Result
ال window.setInterval() method يمكن ان تكتب بدون ال window prefix
- ال parameter 1 هي الدالة function التي تحمل الاوامر البرمجية
- ال parameter 2 هي الوقت المستغرق بين كل مره تنفذ فيها ال function
var myVar = setInterval(myTimer, 1000);
function myTimer() {
var d = new Date();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}سجّل الدخول لحفظ تقدمك
تابع إنجاز المواضيع والمصطلحات والمهام، وكمّل من آخر خطوة على أي جهاز.