آموزش رایگان جاوا اسکریپت (JavaScript)

الگوهای رایج برنامه‌نویسی ناهمگام در جاوا اسکریپت: Promise.race، Promise.all، و Promise.any کامل و مثال‌ها

1م آبان 1403 محراب حسن زاده
الگوهای رایج برنامه‌نویسی ناهمگام در جاوا اسکریپت: Promise.race، Promise.all، و Promise.any کامل و مثال‌ها

برنامه‌نویسی ناهمگام یکی از اصول مهم در توسعه نرم‌افزار است، به‌ویژه در جاوااسکریپت که به‌صورت ذاتی تک‌نخی (single-threaded) اجرا می‌شود. با استفاده از الگوهای مختلف برنامه‌نویسی ناهمگام می‌توان به مدیریت بهینه و کارآمد چندین عملیات همزمان پرداخت. در این مقاله به بررسی سه الگوی رایج: Promise.race، Promise.all، و Promise.any می‌پردازیم و کاربرد هر کدام را در کدنویسی توضیح خواهیم داد.

 

Promise چیست؟

قبل از اینکه به این الگوها بپردازیم، لازم است بدانیم که یک Promise در جاوااسکریپت، شیئی است که نمایانگر یک عملیات ناهمگام بوده و می‌تواند یکی از سه حالت زیر را داشته باشد:

  • Fulfilled: عملیات با موفقیت به پایان رسیده است.

  • Rejected: عملیات با شکست مواجه شده است.

  • Pending: عملیات هنوز در حال انجام است و نتیجه‌ای مشخص نشده است.

 

Promise.all: اجرای همزمان و انتظار برای همه

Promise.all یک الگوی رایج برای اجرای چندین عملیات ناهمگام است که منتظر می‌ماند تا تمامی Promises پاسخی بازگردانند. اگر یکی از Promises با شکست مواجه شود، بقیه هم شکست می‌خورند.

مثال:



const promise1 = new Promise((resolve) => setTimeout(() => resolve('Result 1'), 2000));
const promise2 = new Promise((resolve) => setTimeout(() => resolve('Result 2'), 3000));
const promise3 = new Promise((resolve, reject) => setTimeout(() => reject('Error in promise 3'), 2500));

Promise.all([promise1, promise2, promise3])
  .then((results) => {
    console.log(results);  // This won't execute
  })
  .catch((error) => {
    console.error(error);  // Output: Error in promise 3
  });

 

مزایا:

  • تمامیت نتایج: تمام Promises باید موفق باشند تا خروجی نهایی بازگردانده شود.

  • کاربردی برای عملیات وابسته به چند نتیجه: مناسب برای زمانی که نیاز دارید چند عملیات مختلف قبل از ادامه کار انجام شوند.

 

معایب:

  • شکنندگی بالا: اگر یک Promise شکست بخورد، کل عملیات شکست می‌خورد و نتایج دیگر Promises برگردانده نمی‌شود.

 

Promise.race: انتظار برای اولین Promise

در Promise.race، خروجی بر اساس اولین Promises که به حالت "fulfilled" یا "rejected" برسد، برگردانده می‌شود. این الگو برای مواقعی مناسب است که تنها نتیجه سریع‌ترین عملیات اهمیت دارد.

مثال:



const promise1 = new Promise((resolve) => setTimeout(() => resolve('Result 1'), 2000));
const promise2 = new Promise((resolve) => setTimeout(() => resolve('Result 2'), 1000));

Promise.race([promise1, promise2])
  .then((result) => {
    console.log(result);  // Output: Result 2
  })
  .catch((error) => {
    console.error(error);
  });

 

مزایا:

  • سرعت بالا: اولین Promise که نتیجه بدهد، مورد قبول است. برای مثال در مسابقات زمانی (Race Condition) مفید است.

  • کاربردی در زمان‌سنجی (Timeout): برای محدود کردن مدت زمان اجرای یک Promise می‌توان از آن استفاده کرد.

 

معایب:

  • عدم تضمین تمامیت نتایج: ممکن است تنها اولین Promise نتیجه دهد و بقیه Promises نادیده گرفته شوند، حتی اگر آن‌ها شکست بخورند.

 

Promise.any: انتظار برای اولین Promise موفق

Promise.any یک روش جدیدتر در جاوااسکریپت (معرفی شده در ES2021) است که منتظر اولین Promise موفق می‌ماند. در این الگو، برخلاف Promise.race، تنها Promises موفق مهم هستند و در صورت شکست همه Promises، خطا برگردانده می‌شود.

مثال:



const promise1 = new Promise((resolve, reject) => setTimeout(() => reject('Error in promise 1'), 1000));
const promise2 = new Promise((resolve) => setTimeout(() => resolve('Result 2'), 2000));
const promise3 = new Promise((resolve) => setTimeout(() => resolve('Result 3'), 3000));

Promise.any([promise1, promise2, promise3])
  .then((result) => {
    console.log(result);  // Output: Result 2
  })
  .catch((error) => {
    console.error(error);  // This won't execute
  });

 

مزایا:

  • موفقیت مهم است: اولین Promise موفق مهم است و شکست دیگر Promises تأثیری ندارد.

  • کاربردی در عملیات ناهمزمان وابسته به اولین موفقیت: زمانی که چند عملیات مختلف در جریان است و موفقیت حداقل یکی از آن‌ها کافی است.

 

معایب:

  • نیاز به ES2021 یا بالاتر: برای استفاده از این الگو باید از نسخه‌های جدیدتر جاوااسکریپت استفاده کنید.

 

مقایسه کلی Promise.all، Promise.race و Promise.any

ویژگی

Promise.any

Promise.race

Promise.all

نتیجه نهایی

بازگرداندن اولین Promise موفق

بازگرداندن اولین Promise که نتیجه دهد

بازگرداندن تمامی نتایج موفق

خطاها

تنها در صورت شکست تمامی Promises خطا برگردانده می‌شود

تنها خطای اولین Promise برگردانده می‌شود

اگر یکی شکست بخورد، کل Promises شکست می‌خورد

کاربرد

زمانی که موفقیت یکی از Promises کافی است

زمانی که نتیجه سریع‌ترین عملیات مهم است

زمانی که به تمامی نتایج نیاز است

 

نتیجه‌گیری

هر یک از این الگوهای Promises کاربردهای خاص خود را در برنامه‌نویسی ناهمگام دارند. برای عملیات‌های موازی که نیاز به تمامی نتایج موفق دارید، از Promise.all استفاده کنید. اگر سرعت مهم‌ترین عامل است، Promise.race گزینه مناسبی است. و اگر تنها موفقیت یکی از عملیات‌های موازی برایتان کافی است، Promise.any می‌تواند بهترین انتخاب باشد.

پرسش و پاسخ

نظری یافت نشد

مطالب مشابه

تفاوت Data و Computed Properties در Vue.js | آموزش کاربردی و مثال‌محور
21م آذر 1404

تفاوت Data و Computed Properties در Vue.js | آموزش کاربردی و مثال‌محور

مطالعه بیشتر
آموزش مفاهیم اولیه CSS Grid Layout: طراحی شبکه‌های پیچیده و واکنش‌گرا راهنمای کامل
6م شهریور 1402

آموزش مفاهیم اولیه CSS Grid Layout: طراحی شبکه‌های پیچیده و واکنش‌گرا راهنمای کامل

مطالعه بیشتر
آموزش ساخت ماشین حساب با جاوا اسکریپت: راهنمای کامل با مثال‌های کاربردی
4م آبان 1403

آموزش ساخت ماشین حساب با جاوا اسکریپت: راهنمای کامل با مثال‌های کاربردی

مطالعه بیشتر
آموزش استفاده از box-shadow و text-shadow در CSS: ایجاد سایه‌های زیبا و جذاب
11م آبان 1403

آموزش استفاده از box-shadow و text-shadow در CSS: ایجاد سایه‌های زیبا و جذاب

مطالعه بیشتر
بررسی کتابخانه‌های محبوب جاوا اسکریپت: آشنایی با Lodash و Moment.js - مزایا و کاربردها
4م آبان 1403

بررسی کتابخانه‌های محبوب جاوا اسکریپت: آشنایی با Lodash و Moment.js - مزایا و کاربردها

مطالعه بیشتر
مقدمه‌ای به template و دیتابایندینگ در Vue.js: نحوه مدیریت داده‌ها و رندرینگ پویا
28م شهریور 1402

مقدمه‌ای به template و دیتابایندینگ در Vue.js: نحوه مدیریت داده‌ها و رندرینگ پویا

مطالعه بیشتر
آموزش Responsive Design با استفاده از Media Queries: طراحی واکنش‌گرا برای تمامی دستگاه‌ها
10م شهریور 1402

آموزش Responsive Design با استفاده از Media Queries: طراحی واکنش‌گرا برای تمامی دستگاه‌ها

مطالعه بیشتر
آشنایی با انواع انتخاب‌گرها و تغییر پس‌زمینه با CSS: راهنمای جامع
4م شهریور 1402

آشنایی با انواع انتخاب‌گرها و تغییر پس‌زمینه با CSS: راهنمای جامع

مطالعه بیشتر
مفاهیم پیشرفته در کلاس‌ها و وراثت (Super, Extends) در جاوا اسکریپت: راهنمای کامل و مثال‌ها
29م مهر 1403

مفاهیم پیشرفته در کلاس‌ها و وراثت (Super, Extends) در جاوا اسکریپت: راهنمای کامل و مثال‌ها

مطالعه بیشتر
آموزش Pseudo-classes در CSS: تغییر استایل عناصر با hover، focus و nth-child
10م شهریور 1402

آموزش Pseudo-classes در CSS: تغییر استایل عناصر با hover، focus و nth-child

مطالعه بیشتر
آموزش استفاده از تگ‌های خاص HTML: تگ‌های کاربردی برای طراحی وب‌سایت
22م مرداد 1402

آموزش استفاده از تگ‌های خاص HTML: تگ‌های کاربردی برای طراحی وب‌سایت

مطالعه بیشتر
مقدمه‌ای بر CSS و نحوه اضافه کردن آن به HTML: راهنمای ساده و کامل برای مبتدیان
4م شهریور 1402

مقدمه‌ای بر CSS و نحوه اضافه کردن آن به HTML: راهنمای ساده و کامل برای مبتدیان

مطالعه بیشتر

تمامی حقوق معتلق به ناشر سایت است و کپی از آن پیگرد قانونی دارد