درک Promise ها

promis_thumb

خب هفته ی گذشته در بین سوال هایی که بیشتر در انجمن ها و گروه های مختلف مطرح می شد بیشتر به این پی بردم که اکثرا مشکل کار با axios رو دارن دوستان و این نشون میده که مفهوم promise به درستی جا نیوفتاده براشون.

تصمیم گرفتم در این مطلب به توضیح و درک مفهوم promise ها بپردازم پس بدون مقدمه با من همراه باشید 🙂

مفهوم Promise

این کلمه در لغت برای اکثر ما ایرانیا آشناست :دی

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

خب همونطور که می دونید ما 2 جور فعالیت داریم :

فعالیت های همزمان

فعالیت های غیر زمان

فعالیت های همزمان

به کد زیر توجه کنید :

اینجا فعالیت همزمان اتفاق افتاده اما از کجا فهمیدم؟

از اینکه تمامی کد ها خط به خط انجام می شن ! یعنی در واقع ما نه setTimeout داریم که باعث تاخیر بشه و نه اطلاعاتی از سرور میگیریم که یک رفت و برگشت داشته باشیم.

خب ما می دونیم در تمام زبان های برنامه نویسی کد ها خط به خط اجرا میشن این یعنی اگه فرضا تاخیری در کد بالا به صورت زیر بوجود بیاریم :

اگر این کد رو اجرا کنیم در وهله اول دوبار خطای undefined رو میبینیم که علتش چیه؟

فعالیت های غیر همزمان

علتش فعالیت های غیر همزمانه دوستان.

کد میاد خط به خط اجرا میشه و خب ما مشخص کردیم 2 ثانیه بعد تابع مربوط به دیتایی که فرستادیم عملیاتش انجام بشه پس در این 2 ثانیه این تابع انجام نمیشه و خروجی به ما undefined میده انگار هیچی توی تابع نداریم !

تا قبل از اکما اسکریپت 6 در سال 2015 این مشکل رو با callback ها حل می کردن و هنگامی که میخواستن یک تابع رو فراخوانی کنن همزمان با ارسال مقدار به تابع یک تابع به عنوان callback function ارسال می کردن و در بدنه ی تابع اصلی این callback رو پس از فعالیت Async فراخوانی می کردن.

و اما ظهور Promise…

اکما اسکریپت یک انقلاب بزرگ در جاوااسکریپت بود و تونست اون رو همچنان حفظ کنه و همچنان بهترین و تنها ترین انتخاب در قسمت Front End نگه داشت با اینکه گوگل یه زمان برنامه ای برای شکست دادن جاوا اسکریپت داشت اما پس از مدتی کاملا تسلیم شد. یکی از دلایل عمده ظهور اکما اسکریپت و ویژگی هایی بود که اضافه شده بود.

یکی از این ویژگی ها Promise بود

باید بدونید که Promise ها و axios ها ( که بعدا براشون یک مطلب کامل دارم ) در حقیقت برای مدیریت فعالیت های Async طراحی شدن.

به کد زیر نگاه کنید :

خب ما یک متغیر به نام promise از نوع کلاس Promise تعریف کردیم.

و دو تا تابع داریم به نام های response و reject

در واقع همون if زمانی که true باشه و else زمانی که false باشه معانی متناظر این دو تابع هستند.

به عبارت دیگه زمانی then فراخوانی میشه و انجام میشه که ما یک جواب مثبت و یا یک response دریافت کرده باشیم که مقدارش به then فرستاده میشه و عملیات اصلی اونجا انجام میشه !

در صورتی که هر خطایی موجود باشه به هیچ عنوان then کال نمیشه و مستقیم به سراغ catch میریم

پس تا حدودی باید متوجه شده باشید که وجود یا عدم وجود reject کاملا اختیاری هست.

ساختار دقیقا به سادگی همین شکلی بود که توضیح دادیم دوستان.

نکته پلاس

فقط توجه داشته باشید که Promise ها تنها به اولین reject یا response خود پاسخ می دهند یعنی اگر شما داخل یک Promise حتی ده بار هم response با مقادیر مختلف به then پاس بدهید تنها اولین مورد آن مورد قبول بوده و باقی موارد نادیده گرفته خواهند شد.

از Promise ها به جای Callback ها استفاده کنید و لذت شیرینی فرار از جهنم Callback ها رو بچشید.

این مطلب قطعا در یادگیری های آینده و یا نظرات شما به روز رسانی خواهد شد.

برای ارسال سوالاتتون و حل اون ها به همراه تشریح در یک پست از منوی بالای سایت استفاده کنید.

و اما می رسیم به عکس مفهومی در انتهای مطلب که می تونید با کلیک کردن روی اون در سایز اصلی مشاهده کنید :

promise

Share:

ارسال یک پاسخ

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

97 − = 94