promise در جاوا اسکریپت ابزاری است که با استفاده از آن می‌توانید توابعی را در آینده اجرا کرده و روی نتایج آن اقداماتی انجام دهید. پرامیس در جاوا اسکریپت از سه حالت Pending، Fulfilled و Rejected پشتیبانی می‌کند. برای استفاده از پرامیس در زبان جاوا اسکریپت می‌توان به طور مستقیم از خود کلاس Promise شیئی را ایجاد کرد یا این‌که از کتابخانه‌های جانبی مانند rsvp.js استفاده کرد. از طرف دیگر برنامه‌نویسان می‌توانند به طور مستقیم کال بک‌هایی را به پرامیس خود اضافه کرده و به این ترتیب کدها را کمی شخصی‌سازی کنند. بوت کمپ فرانت اند همه ابزارهای لازم را به شما آموزش میدهد
در بوت کمپ برنامه نویسی مربوط به زبان جاوا اسکریپت شما یاد می‌گیرید که چگونه می‌توانید یک پرامیس را ایجاد کرده و از آن در پروژه‌های خود استفاده کنید.
Promise در جاوا اسکریپت چیست و چرا حائز اهمیت است؟
در آموزش promise در جاوا اسکریپت باید توجه داشته باشید که Promise در واقع تضمین می‌کند که اتفاقی در آینده رخ خواهد داد. در جاوا اسکریپت Promise شیئی است که در آینده مقدار واحدی را تولید می‌کند. در صورتی که این مقدار موفقیت‌آمیز باشد ارزشی ایجاد خواهد شد و در صورتی که مشکلی برای آن به وجود بیاید دلیلی برای شکست ظاهر می‌شود. Promise در زبان برنامه‌نویسی جاوا اسکریپت سه حالت مختلف دارد که عبارت‌اند از:
- Pending: حالت پیش‌فرض
- Fulfilled: موفقیت‌آمیز بودن
- Rejected: رد شدن
Promise در واقع جایگزینی برای callback توابع در جاوا اسکریپت است. به عبارت دیگر می‌توان گفت که Promise وقتی در جاوا اسکریپت استفاده می‌شود که شما نیاز دارید منتظر بانید تا کار خاصی قبل از اجرای فرایند بعدی به اتمام برسد. برای درک بهتر این‌که پرامیس چیست؟ مثال زیر را در نظر بگیرید:
فرض کنید سه تابع داریم که باید به طور متوالی از یک تا سه اجرا شوند. هر تابع چند ثانیه زمان برای اجرا نیاز دارد. برای این‌که بتوانیم چنین کاری را شبیه‌سازی کنیم نیازمند استفاده از متد setTimeout خواهیم بود:
function stepOne(value){
setTimeout(() => {
console.log(value);
}, 3000);
}
function stepTwo(value){
setTimeout(() => {
console.log(value);
}, 2000);
}
function stepThree(value){
setTimeout(() => {
console.log(value);
}, 1000);
}
در اینجا با استفاده از callbackها می‌توانید پارامترهایی را روی توابع stepOne و stepTwo تعریف کرده و سپس آن توابع را به‌صورت متوالی فراخوانی کنید:
function stepOne(value, callback) {
setTimeout(() => {
console.log(value);
callback();
}, 3000);
}
function stepTwo(value, callback) {
setTimeout(() => {
console.log(value);
callback();
}, 2000);
}
function stepThree(value, callback) {
setTimeout(() => {
console.log(value);
callback();
}, 1000);
}
// Run the functions sequentially with callbacks
stepOne(1, () => {
stepTwo(2, () => {
stepThree(3, () => {
console.log(“All steps completed.”);
});
});
});
فراخوانی‌های متوالی و تودرتو در اینجا می‌توانند مشکلاتی را ایجاد کرده و باعث پیچیده‌شدن کدهای شما شوند. در این شرایط آموزش promise در جاوا اسکریپت به کمک شما می‌آید و شما می‌توانید کدهای بالا را به شکل زیر بازنویسی کنید:
function stepOne(value) {
return new Promise((resolve) => {
setTimeout(() => {
console.log(value);
resolve();
}, 3000);
});
}
function stepTwo(value) {
return new Promise((resolve) => {
setTimeout(() => {
console.log(value);
resolve();
}, 2000);
});
}
function stepThree(value) {
return new Promise((resolve) => {
setTimeout(() => {
console.log(value);
resolve();
}, 1000);
});
}
// Run the functions sequentially with Promises
stepOne(1)
.then(() => stepTwo(2))
.then(() => stepThree(3))
.then(() => {
console.log(“All steps completed.”);
});
همانطور که مشاهده می‌کنید در اینجا هر تابع یک promise را برمی‌گرداند که پس از اتمام زمان‌بندی برطرف می‌شود. در پروژه‌های واقعی که شما در بوت کمپ فرانت اند نیز با آنها درگیر خواهید بود، استفاده از promise به شما کمک می‌کند تا بتوانید خوانایی کدهای خود را افزایش داده و البته نگهداری از کدها را نیز برای شما راحت‌تر خواهد کرد. آموزش برنامه نویسی بامداد برای ارائه همه ترفندها ی لازم در کنار شماست.
کاربرد و مزایای promise در زبان جاوا اسکریپت
کاربرد و مزایای مهم پرامیس چیست؟ این کاربردها و مزایای شامل موارد زیر می‌شوند:
1- استفاده از پرامیس، به شما کمک می‌کند تا بتوانید خوانایی کدهای خود را افزایش داده و البته عملیات ناهمزمانی که در کدهای جاوا اسکریپت وجود دارند را نیز به شکل بهتری مدیریت کنید.
2- این ابزار، به شما اجازه میدهد تا بتوانید خطاهای خود را خیلی راحت مدیریت کنید.
3- با استفاده از این ابزار، می‌توانید coupling را کاهش داده و عملکرد کدهای خود را بهبود دهید.
کتابخانه‌های مخصوص promise در جاوا اسکریپت
برای یادگیری نحوه‌ی نوشتن یک promise در جاوا اسکریپت شما نیازمند این هستید که با کتابخانه‌هایی که در این زبان برنامه‌نویسی برای کارکردن با promise وجود دارند نیز آشنا شوید. یکی از بهترین کتابخانه‌های این حوزه rsvp.js است که شما می‌توانید از آن هم در سمت سرور و هم در سمت کلاینت استفاده کنید. برای این‌که بتوانید آن را برای Node.js نصب کنید کافی است که وارد پوشه پروژه خود شده و دستور زیر را تایپ کنید:
npm install –save rsvp
اگر قصد دارید آن را وارد بخش فرانت اند پروژه خود کنید نیز می‌توانید از دستور زیر استفاده کنید:
bower install -S rsvp
برای این‌که بتوانید از این کتابخانه برای ایجاد یک پرامیس استفاده کنید نیازمند استفاده از کانستراکتوری به نام revealing هستید. این نوع کانستراکتور یک پارامتر تابع را می‌گیرد و بلافاصله آن را با دو آرگومان full و reject فراخوانی می‌کند:
var promise = new RSVP.Promise(function(fulfill, reject) {
(…)
});
افرادی که قصد استفاده از این promise در جاوا اسکریپت را دارند می‌توانند کنترل‌کننده‌های خود را نیز از طریق then به آن اضافه کرده و تغییراتشان را اعمال کنند. برای درک بهتر این موضوع قطعه کد زیر را مشاهده کنید:
promise.then(onFulfilled, onRejected);
بسته به نتایج حاصل از پرامیس ممکن است کنترل کننده onFulfilled یا onRejected به‌صورت ناهمزمان فراخوانی شود. در ادامه مثالی را برای شما آورده‌ایم که نحوه انجام این کار را به بهترین شکل ممکن به شما نشان میدهد:
function dieToss() {
return Math.floor(Math.random() * 6) + 1;
}
console.log(‘1’);
var promise = new RSVP.Promise(function(fulfill, reject) {
var n = dieToss();
if (n === 6) {
fulfill(n);
} else {
reject(n);
}
console.log(‘2’);
});
promise.then(function(toss) {
console.log(‘Yay, threw a ‘ + toss + ‘.’);
}, function(toss) {
console.log(‘Oh, noes, threw a ‘ + toss + ‘.’);
});
console.log(‘3’);
وقتی که این قطعه کد را اجرا می‌کنید می‌توانید خروجی زیر را از آن دریافت کنید:
1
2
3
Oh, noes, threw a 4.
البته اگر خوش‌شانس باشیم می‌توانیم خروجی زیر را نیز بگیریم:
1
2
3
Yay, threw a 6.
روش دوم برای استفاده از پرامیس در جاوا اسکریپت
پس از آشنایی با مزایای promise در جاوا اسکریپت شما می‌توانید از طریق روش‌های دیگری نیز اقدام به استفاده از پرامیس در کدهای خود کنید که در ادامه یک روش جذاب را به شما ارائه خواهیم داد. برای این‌که بتوانید از پرامیس استفاده کنید در اولین قدم نیازمند ساخت یک شی با استفاده از تابع سازنده Promise هستید. این تابع یک پارامتر دریافت می‌کند که این پارامتر همان تابعی است که تعیین می‌کند چه زمانی باید پرامیس جدید را حل کرده و چه زمانی آن را رد کنیم:
const promise = new Promise((resolve, reject) => {
// Condition to resolve or reject the promise
});
برای مثال فرض کنید که قصد دارید پرامیسی ایجاد کنید که پس از دو ثانیه حل شود. برای این کار می‌توانید از قطعه کد زیر استفاده کنید:
const promise = new Promise((resolve, reject) => {
setTimeout(() => resolve(“Done!”), 2000);
});
دقت داشته باشید که در شی promises که ایجاد کرده‌اید، resolve تابعی است که یک پارامتر اختیاری را دریافت کرده و مقدار حل شده را در آن نشان میدهد. همچنین reject تابعی است که یک پارامتر اختیاری را دریافت کرده و نشان‌دهنده دلیل شکست پرامیس شما خواهد بود. در ادامه مثالی را برای شما آورده‌ایم که این مسئله را به بهترین شکل به شما نشان میدهد:
const promise = new Promise((resolve, reject) => {
const num = Math.random();
if (num >= 0.5) {
resolve(“Promise is fulfilled!”);
} else {
reject(“Promise failed!”);
}
});
از توابع callback استفاده کنیم یا promise ؟
با وجود این‌که استفاده از callback در جاوا اسکریپت بسیار ساده و راحت است، ولی نباید فراموش کرد که در بسیاری از مواقع، ممکن است پروژه شما را وارد یک لوپ کند که قطعا مشکلات جدی‌تری را برایتان به وجود خواهد آورد. این در حالی است که پرامیس، می‌تواند ساختارهای بهتری را در کدهای شما ایجاد کرده و باعث شود تا کدهایی تمیزتر داشته باشید. استفاده از پرامیس‌ها باعث می‌شود تا خوانایی کدهای شما نیز بهبود پیدا کرده و در نتیجه، تا جای ممکن پروژه‌ای در زبان جاوا اسکریپت داشته باشید که نیازهای کاربر را رفع کرده و البته پیچیدگی خیلی زیادی نیز ندارد.
آیا می‌توانیم یک کال‌بک را به پرامیس اضافه کنیم؟
در آموزش promise در جاوا اسکریپت شما می‌توانید خیلی راحت یک کال‌بک را به پرامیس خود اضافه کنید. برای این‌که بتوانید این کار را انجام دهید بهترین راه استفاده از then است. این متد دو تابع فراخوانی را به شما ارائه میدهد که تابع اول در صورت حل شدن پرامیس اجرا شده و تابع دوم نیز در صورتی که پرامیس شما رد شود اجرا خواهد شد. قطعه کد زیر را در این زمینه مشاهده کنید:
const promise = new Promise((resolve, reject) => {
const num = Math.random();
if (num >= 0.5) {
resolve(“Promise is fulfilled!”);
} else {
reject(“Promise failed!”);
}
});
function handleResolve(value) {
console.log(value);
}
function handleReject(reason) {
console.error(reason);
}
promise.then(handleResolve, handleReject);
// Promise is fulfilled!
// or
// Promise failed!
این در واقع راهی است که با استفاده از آن می‌توانید با نتایج احتمالی خود مقابله کنید. دقت داشته باشید که شما می‌توانید ابتدا پرامیس خود را ایجاد کرده و سپس با استفاده از متد then بلافاصله یک کال بک را نیز به آن اضافه کنید. از طرف دیگر شما می‌توانید یک پرامیس که بلافاصله رد می‌شود را نیز به همین شکل ایجاد کنید که در قطعه کد زیر این موضوع را به شما نشان داده‌ایم:
Promise.resolve(“Successful”).then((result) => console.log(result));
// Successful
Promise.reject(“Not successful”).then((result) => console.log(result));
// Error: Uncaught (in promise)
سخن پایانی
promise در جاوا اسکریپت ابزاری است که به شما کمک می‌کند تا اتفاقی که در آینده در کدهای شما رخ میدهد را خیلی راحت مدیریت کنید. شما می‌توانید برای ساخت یک پرامیس هم از کلاس استاندارد پرامیس در جاوا اسکریپت استفاده کرده و هم از کتابخانه‌های جانبی برای این کار استفاده کنید. در بوت کمپ برنامه نویسی به زبان جاوا اسکریپت شما می‌توانید با دیگر کاربردهای مهم پرامیس در این زبان آشنا شوید. از طرف دیگر برای استفاده از پرامیس تکنیک‌های خاصی نیز وجود دارند که در آموزش برنامه نویسی فرانت اند این موارد نیز به شما آموزش داده می‌شود.
در صورتی که شما هم علاقه‌مند به آشنایی بیشتر با این مفهوم هستید یا این سوال را دارید Axios چیست؟ پیشنهاد می‌کنیم حتما از دیگر بخش‌ها و خدمات سایت بامداد نیز دیدن کنید. در این مجموعه شما می‌توانید آموزش JSON در جاوا اسکریپت را نیز مطالعه کرده و نحوه استفاده از جیسون در این زبان را هم بیاموزید.
