غیرهمزمان (Asynchronous)
«غیرهمزمان (Asynchronous)» یعنی کاری الان شروع شود، اما نتیجه اش بعداً بیاید. مثل سفارش غذا؛ سفارش می دهی، اما هم زمان مشق هم می نویسی.
شروع با کالبک (Callback)
کالبک یعنی نام یک تابع را به تابع دیگر بدهی تا بعداً صدا زده شود.
function myDisplayer(something) {
document.getElementById("demo").innerHTML = something;
}
function myCalculator(num1, num2, myCallback) {
let sum = num1 + num2;
myCallback(sum);
}
myCalculator(5, 5, myDisplayer);
نکته: هنگام پاس دادن تابع، پرانتز نگذار. درست: myDisplayer ؛ نادرست: myDisplayer().
تاخیر با setTimeout
تابع setTimeout بعد از زمان تعیین شده، کالبک را اجرا می کند.
setTimeout(myFunction, 3000);
function myFunction() {
document.getElementById("demo").innerHTML = "I love You !!";
}
نکته: عدد 3000 یعنی سه ثانیه صبر، بعد تابع اجرا می شود.
تابع درجا (Inline Function) به عنوان کالبک
می توانی به جای نام تابع، خود تابع را هم پاس بدهی.
setTimeout(function () {
myFunction("I love You !!!");
}, 3000);
function myFunction(value) {
document.getElementById("demo").innerHTML = value;
}
تکرار با setInterval
تابع setInterval کالبک را هر فاصله زمانی تکرار می کند.
setInterval(myFunction, 1000);
function myFunction() {
let d = new Date();
document.getElementById("demo").innerHTML = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
}
گام های عملی
- یک کالبک ساده بساز؛ فقط خروجی بدهد.
- با setTimeout یا setInterval آن را زمان بندی کن.
- در پایان، نتیجه را در صفحه نشان بده.
چرا به جای کالبک؟
کد غیرهمزمان با کالبک ها سخت می شود. برای همین معمولاً از «پرامیس (Promise)» استفاده می کنیم. ادامه در صفحه پرامیس.
جمع بندی سریع
- غیرهمزمان یعنی نتیجه دیرتر برسد.
- کالبک را بدون پرانتز پاس بده.
- setTimeout یک بار اجرا می کند.
- setInterval چندبار پشت سرهم اجرا می کند.
- برای نظم بیشتر، به سراغ پرامیس برو.
برای پایه ها به کالبک ها برگرد. همچنین مسیر کلی را در کنترل جریان ببین.