async/await در جاوااسکریپت را ساده و کامل یاد بگیر

یکی از مفاهیمی که مبتدی‌ها را گیج می‌کند، کار ناهمگام (asynchronous) در جاوااسکریپت است. با async/await این کار خیلی ساده‌تر و خواناتر می‌شود. بیایید قدم‌به‌قدم یاد بگیریم.

چرا کار ناهمگام؟

بعضی کارها زمان می‌برند: گرفتن داده از سرور، خواندن فایل، یا یک تایمر. جاوااسکریپت نمی‌خواهد منتظر بماند و صفحه را قفل کند؛ پس این کارها را «ناهمگام» انجام می‌دهد و وقتی نتیجه آماده شد، ادامه می‌دهد.

Promise چیست؟

یک Promise نماینده‌ٔ یک مقدار است که «در آینده» آماده می‌شود. سه حالت دارد: در حال انتظار، موفق، ناموفق.

fetch("/api/courses")
    .then(response => response.json())
    .then(data => console.log(data))
    .catch(err => console.error(err));

این روش .then کار می‌کند، اما وقتی چند مرحله داشته باشی، تودرتو و سخت‌خوان می‌شود.

async/await: روش مدرن و خوانا

async/await روی همان Promiseها ساخته شده اما کد را مثل کدِ همگام (خط‌به‌خط) می‌نویسی:

async function loadCourses() {
    const response = await fetch("/api/courses");
    const data = await response.json();
    console.log(data);
}

loadCourses();

دو قانون ساده:

• await یعنی «صبر کن تا این Promise تمام شود و نتیجه را بده».
• هر تابعی که داخلش await دارد، باید async باشد.

مدیریت خطا با try/catch

زیبایی async/await این است که خطاها را مثل کد معمولی مدیریت می‌کنی:

async function loadData() {
    try {
        const res = await fetch("/api/data");
        if (!res.ok) throw new Error("خطای سرور: " + res.status);
        const data = await res.json();
        return data;
    } catch (err) {
        console.error("مشکلی پیش آمد:", err);
    }
}

اجرای موازی با Promise.all

اگر چند کار مستقل داری، به‌جای صبرکردن پشت‌سرهم، همه را با هم اجرا کن:

const [courses, posts] = await Promise.all([
    fetch("/api/courses").then(r => r.json()),
    fetch("/api/posts").then(r => r.json()),
]);

این خیلی سریع‌تر از await کردن یکی‌یکی است.

اشتباهات رایج

• فراموش‌کردن await: بدون آن، یک Promise می‌گیری نه نتیجه را.
• فراموش‌کردن async: استفاده از await در تابع غیر-async خطا می‌دهد.
• نادیده‌گرفتن خطا: همیشه try/catch یا .catch بگذار.

جمع‌بندی

async/await کار ناهمگام را خوانا و قابل‌مدیریت می‌کند. وقتی مفهوم Promise را بفهمی، نوشتن کدِ ناهمگام لذت‌بخش می‌شود.

برای یادگیری کامل جاوااسکریپت از پایه، مسیر JavaScript آرنا را دنبال کن.