جافا سكربت متباينة

"سأنتهي لاحقًا!"

الدوال التي تعمل في وقت واحد مع دوال أخرى تُسمى متقطعة (asynchronous)

مثال جيد هو JavaScript setTimeout()

JavaScript متقطع

تم تبسيط الأمثلة المستخدمة في الفصل السابق بشكل كبير.

يهدف إلى عرض جملة الدالة المراجعة:

مثال

function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
}
function myCalculator(num1, num2, myCallback) {
  let sum = num1 + num2;
  myCallback(sum);
}
myCalculator(5, 5, myDisplayer);

تجربة بنفسك

في المثال السابق،myDisplayer هو اسم الدالة.

تُستخدم كمعامل myCalculator();.

في العالم الحقيقي، يتم استخدام الدوال المراجعة غالبًا مع الدوال المتقطعة.

مثال تقليدي هو JavaScript setTimeout();.

انتظار المهلة الزمنية

عند استخدام دوال JavaScript، setTimeout(); بإمكانك تحديد الدالة التي سيتم تنفيذها عند انتهاء مهلة زمنية:

مثال

setTimeout(myFunction, 3000);
function myFunction() {
  document.getElementById("demo").innerHTML = "I love You !!";
}

تجربة بنفسك

في المثال السابق،myFunction تُستخدم كإعادة تفعيل.

وظيفة (اسم الوظيفة) كمعامل يتم نقلها إلى setTimeout();.

3000 هو عدد الميليسي ثانية قبل انقضاء الوقت، لذا سيتم استدعاء myFunction().

عندما تمرر دالة كمعامل، تذكر عدم استخدام الأقواس.

صحيح: setTimeout(myFunction, 3000);

خطأ: setTimeout(myFunction(), 3000);

إذا لم تكن تريد تمرير اسم الدالة كمعامل إلى دالة أخرى، يمكنك دائمًا تمرير الدالة بأكملها:

مثال

setTimeout(function() { myFunction("I love You !!!"); }, 3000);
function myFunction(value) {}}
  document.getElementById("demo").innerHTML = value;
}

تجربة بنفسك

في المثال السابق،function(){ myFunction("I love You !!!"); } يستخدم كمراجعة. إنه دالة كاملة. يتم نقل الدالة الكاملة كمعامل إلى setTimeout().

3000 هو عدد الميليسي ثانية قبل انقضاء الوقت، لذا سيتم استدعاء myFunction().

انتظار الفترة الزمنية:

عند استخدام دوال JavaScript، setInterval() ، يمكنك تحديد دالة المراجعة التي يتم تنفيذها في كل فترة زمنية:

مثال

setInterval(myFunction, 1000);
function myFunction() {
  let d = new Date();
  document.getElementById("demo").innerHTML=
  d.getHours() + ":" +
  d.getMinutes() + ":" +
  d.getSeconds();
}

تجربة بنفسك

في المثال السابق،myFunction كإ回调.

وظيفة (اسم الوظيفة) كمعامل يتم نقلها إلى setInterval().

1000 هو عدد الميليسي ثانية بين الفترات، لذا myFunction() تُدعى مرة واحدة في الثانية.

انتظار فایل

إذا قمت بإنشاء دالة لتحميل موارد خارجية (مثل سكربت أو ملفات)، فإنك لن تتمكن من استخدام هذه الموارد حتى يتم تحميلها بالكامل.

هذا هو الوقت الأمثل لاستخدام الدوال المراجعة (callbacks).

في هذا المثال يتم تحميل ملف HTML (mycar.html، ويتم عرض ملف HTML هذا في صفحة الويب عند تحميله بالكامل:

انتظار فایل:

function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
}
function getFile(myCallback) {
  let req = new XMLHttpRequest();
  req.open('GET', "mycar.html");
  req.onload = function() {
    if (req.status == 200) {
      myCallback(this.responseText);
    } else {
      myCallback("خطأ: " + req.status);
    }
  }
  req.send();
}
getFile(myDisplayer);

تجربة بنفسك

في المثال السابق،myDisplayer كإ回调.

وظيفة (اسم الوظيفة) كمعامل يتم نقلها إلى getFile().

إليك mycar.html نسخة:

mycar.html

<img src="img_car.jpg" alt="سيارة جميلة" style="width:100%">
<p>السيارة هي مركبة متحركة ذاتية التزويد بمحرك تستخدم للتنقل.</p>
<p>معظم التعاريف للعبارة تشير إلى أن السيارات مصممة لتكون مركبات معدة للسير على الطرق بشكل رئيسي، وأنها تحتوي على مقاعد من شخص إلى ثمانية أشخاص، وأنها عادة ما تحتوي على أربعة عجلات.</p>
<p>(الموسوعة)</p>