کنترل جریان (Control Flow)
«کنترل جریان جاوااسکریپت» یعنی ترتیب اجرای دستورها. پیش فرض از بالا به پایین است؛ اما با شرط ها، حلقه ها و پرش ها، مسیر را عوض می کنی.
جریان پیش فرض (Default Flow)
کد به صورت دنباله ای اجرا می شود؛ خط به خط و چپ به راست.
let x = 5;
let y = 6;
let z = x + y;
شرط ها (Conditional Flow)
با «شرط (Condition)» تصمیم می گیری. اگر درست باشد، یک مسیر؛ وگرنه مسیر دیگر.
let text = "Unknown";
if (age >= 18) {
text = "Adult";
} else {
text = "Minor";
}
حلقه ها (Loops)
«حلقه (Loop)» تکرارِ یک بلاک کد است تا وقتی شرط برقرار است.
for (let i = 0; i < 5; i++) {
text += "The number is " + i + "<br>";
}
دستورات پرش (Jump)
break حلقه را تمام می کند؛ continue فقط تکرار جاری را رد می کند.
for (let i = 0; i < 10; i++) {
if (i === 3) {
break;
}
text += "The number is " + i + "<br>";
}
جریان داخل تابع (Function Flow)
«تابع (Function)» یک بلوک قابل فراخوانی و قابل استفاده مجدد است.
function myFunction(p1, p2) {
return p1 * p2;
}
تک ریسمانی بودن (Single-Threaded)
جاوااسکریپت تک ریسمانی است؛ هم زمان یک کار انجام می دهد. کارهای سنگین، اجرای بقیه را کند می کنند.
جریان ناهمگام (Asynchronous Flow)
«ناهمگام (Async)» یعنی منتظرِ کارهای زمان بر نمی ماند. کارها پس زمینه انجام می شوند و نتیجه بعداً می آید.
رویدادها (Events)
«رویداد (Event)» مثل کلیک کاربر است. با وقوعش، تابع اجرا می شود.
function displayDate() {
// این تابع با رویداد کلیک دکمه صدا زده می شود
// نمونه HTML در منبع: onclick="displayDate()"
}
کالبک ها (Callbacks)
«کالبک (Callback)» تابعی است که به تابع دیگر پاس می دهی تا بعداً اجرا شود.
function myDisplayer(some) {
document.getElementById("demo").innerHTML = some;
}
function myCalculator(num1, num2, myCallback) {
let sum = num1 + num2;
myCallback(sum);
}
myCalculator(5, 5, myDisplayer);
پرومیس ها (Promises)
«پرومیس (Promise)» قولِ یک نتیجه در آینده است؛ موفق یا خطا.
fetch("https://api.example.com")
.then(function (response) {
return response.json();
})
.then(function (data) {
console.log(data);
})
.catch(function (error) {
console.error(error);
});
Async/Await
async/await کد ناهمگام را شبیه همگام نمایش می دهد و خوانایی را بالا می برد.
async function getData() {
try {
const res = await fetch("https://api.example.com");
const data = await res.json();
console.log(data);
} catch (err) {
console.error(err);
}
}
جمع بندی سریع
- کنترل جریان جاوااسکریپت مسیر اجرای کد را تعیین می کند.
- شرط ها شاخه می سازند؛ حلقه ها تکرار می کنند.
breakپرش می دهد؛continueاز این دور می گذرد.- ناهمگام: رویداد، کالبک، پرومیس، و
async/await.
نکته: برای تمرین تکرارها، به کنترل جریان در حلقه ها سر بزن. برای توالی داده، تکرارگرها و مولدها مفیدند.