٪۴۰ تخفیف تابستانه شروع شد! بزرگترین حراج سال ما

به ما بپیوندید

اموزش جاوا اسکریپت ناهمزمان

“بعدا تموم می کنم!” عملکردهایی که به موازات توابع دیگر اجرا می شوند ، ناهمزمان نامیده می شوند یک مثال خوب JavaScript setTimeout () جاوا اسکریپت ناهمزمان مثالهای استفاده شده در فصل قبل بسیار ساده بود. هدف این مثالها نشان…

محمد یوسفی

27 جولای 2021

“بعدا تموم می کنم!”

عملکردهایی که به موازات توابع دیگر اجرا می شوند ، ناهمزمان نامیده می شوند

یک مثال خوب JavaScript setTimeout ()

جاوا اسکریپت ناهمزمان

مثالهای استفاده شده در فصل قبل بسیار ساده بود.

هدف این مثالها نشان دادن نحو توابع برگشت تماس بود:

مثال

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().


منتظر Timeout

هنگام استفاده از تابع JavaScript setTimeout()، می توانید یک تابع فراخوانی را تعیین کنید که در زمان منقضی اجرا شود:

مثال

setTimeout(myFunction, 3000);

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

در مثال بالا ، myFunctionبه عنوان پاسخگویی استفاده می شود.

تابع (نام تابع) به setTimeout()عنوان آرگومان منتقل می شود.

3000 تعداد میلی ثانیه قبل از مهلت زمانی است ، بنابراین myFunction()پس از 3 ثانیه فراخوانی می شود.

وقتی تابعی را به عنوان آرگومان می گیرید ، به یاد داشته باشید که از پرانتز استفاده نکنید.

راست: 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()پس از 3 ثانیه فراخوانی می شود.


در انتظار فاصله ها:

هنگام استفاده از تابع 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()هر ثانیه فراخوانی می شود.


در انتظار فایلها

اگر برای بارگذاری یک منبع خارجی (مانند یک اسکریپت یا یک فایل) تابعی ایجاد کنید ، نمی توانید از محتوا قبل از بارگیری کامل استفاده کنید.

این زمان مناسب برای استفاده از پاسخگویی است.

این مثال mycar.htmlپس از بارگیری کامل پرونده ، یک فایل 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("Error: " + req.status);
    }
  }
  req.send();
}

getFile(myDisplayer);

در مثال بالا ، myDisplayerبه عنوان پاسخگویی استفاده می شود.

تابع (نام تابع) به getFile()عنوان آرگومان منتقل می شود.

در زیر یک نسخه از این موارد آورده شده است mycar.html:

mycar.html

<img src="img_car.jpg" alt="Nice car" style="width:100%">

<p>A car is a wheeled, self-powered motor vehicle used for transportation.
Most definitions of the term specify that cars are designed to run primarily on roads, to have seating for one to eight people, to typically have four wheels.</p>

<p>(Wikipedia)</p>

منبع

مطالب مرتبط

0 0 رای ها
امتیازدهی به مقاله
اشتراک در
اطلاع از
guest
0 نظرات
بازخورد (Feedback) های اینلاین
مشاهده همه دیدگاه ها