درک وعده های جاوا اسکریپت – انجمن DEV

Summarize this content to 400 words in Persian Lang
وعده های جاوا اسکریپت یک راه قدرتمند برای مدیریت عملیات ناهمزمان است. قبل از معرفی وعده ها، فراخوانی روش اصلی برای رسیدگی به وظایف ناهمزمان بود. با این حال، تماس‌های برگشتی می‌توانند به «جهنم پاسخ به تماس» منجر شوند، جایی که مدیریت و خواندن تماس‌های تودرتو دشوار می‌شود. Promises روشی تمیزتر و خواناتر برای مدیریت عملیات ناهمزمان ارائه می دهد.

وعده چیست؟

یک وعده در جاوا اسکریپت نشان دهنده تکمیل (یا شکست) نهایی یک عملیات ناهمزمان و مقدار حاصل از آن است. این یک شی است که می تواند در یکی از سه حالت باشد:

در انتظار: حالت اولیه، نه انجام شده و نه رد شده است.
انجام شد: عملیات با موفقیت انجام شد.
رد شد: عملیات شکست خورد.

ایجاد یک وعده

برای ایجاد یک وعده، از سازنده Promise استفاده کنید که تابعی را با دو پارامتر می گیرد: Resol و Reject. این توابع وضعیت وعده را کنترل می کنند.

const myPromise = new Promise((resolve, reject) => {
let success = true; // Simulate an operation
if (success) {
resolve(“Operation successful!”);
} else {
reject(“Operation failed.”);
}
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

استفاده از وعده ها

وعده‌ها روش‌هایی برای رسیدگی به نتیجه دارند.

سپس: هنگام وفای به وعده خوانده می شود.
گرفتن: به هنگام ردّ قول خوانده می شود.
در نهایت: بدون توجه به نتیجه قول تماس گرفت.

myPromise
.then((message) => {
console.log(message); // “Operation successful!”
})
.catch((error) => {
console.error(error); // “Operation failed.”
})
.finally(() => {
console.log(“Operation completed.”);
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

وعده های زنجیره ای

یکی از مزیت های اصلی وعده ها زنجیر زنی است. می‌توانید چندین و سپس فراخوانی را زنجیره‌ای کنید تا دنباله‌ای از عملیات ناهمزمان را انجام دهید.

const firstPromise = new Promise((resolve) => {
setTimeout(() => resolve(“First promise resolved”), 1000);
});

firstPromise
.then((result) => {
console.log(result); // “First promise resolved”
return new Promise((resolve) => {
setTimeout(() => resolve(“Second promise resolved”), 1000);
});
})
.then((result) => {
console.log(result); // “Second promise resolved”
})
.catch((error) => {
console.error(error);
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

رسیدگی به وعده های متعدد

جاوا اسکریپت متدهای ابزاری را برای رسیدگی به چندین وعده به صورت همزمان ارائه می دهد: Promise.all، Promise.race، Promise.allSettled، و Promise.any.

Promise.all: منتظر می ماند تا همه قول ها حل شوند یا هر یک رد شود.

const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve) => setTimeout(resolve, 100, ‘foo’));

Promise.all([promise1, promise2, promise3]).then((values) => {
console.log(values); // [3, 42, ‘foo’] });

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

Promise.race: به محض رفع یا رد یکی از وعده ها، رفع یا رد می شود.

const promise1 = new Promise((resolve) => setTimeout(resolve, 500, ‘one’));
const promise2 = new Promise((resolve) => setTimeout(resolve, 100, ‘two’));

Promise.race([promise1, promise2]).then((value) => {
console.log(value); // “two”
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

Promise.allSettled: منتظر می ماند تا همه وعده ها حل و فصل شوند (یا حل و فصل شوند یا رد شوند).

const promise1 = Promise.resolve(42);
const promise2 = Promise.reject(‘error’);
const promise3 = new Promise((resolve) => setTimeout(resolve, 100, ‘foo’));

Promise.allSettled([promise1, promise2, promise3]).then((results) => {
results.forEach((result) => console.log(result.status));
// “fulfilled”
// “rejected”
// “fulfilled”
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

Promise.any: منتظر حل شدن هر قولی است.

const promise1 = Promise.reject(‘error1’);
const promise2 = new Promise((resolve) => setTimeout(resolve, 100, ‘foo’));

Promise.any([promise1, promise2]).then((value) => {
console.log(value); // “foo”
}).catch((error) => {
console.error(error); // AggregateError: All promises were rejected
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

اشتباهات رایج با وعده ها

در حالی که وعده ها قدرتمند هستند، می توانند منبع سردرگمی و خطا نیز باشند. در اینجا برخی از اشتباهات رایج توسعه دهندگان هنگام کار با وعده ها وجود دارد:

1. عدم بازگشت یک وعده در یک Handler

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

firstPromise
.then((result) => {
console.log(result);
new Promise((resolve) => setTimeout(resolve, 1000, ‘Second promise resolved’)); // Missing return
})
.then((result) => {
console.log(result); // This will log undefined
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

2. گرفتن خطاها خیلی زود

تشخیص خطا در اوایل یک زنجیره می تواند از آگاهی پایین دست و کنترل کننده ها از خطا جلوگیری کند.

firstPromise
.then((result) => {
throw new Error(‘Something went wrong’);
})
.catch((error) => {
console.error(error); // Caught too early
})
.then(() => {
console.log(‘This will still run’);
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

برای جلوگیری از این امر، مدیریت خطا را در انتهای زنجیره یا تا حد امکان نزدیک به عملیات خاص قرار دهید.

3. ایجاد وعده های غیر ضروری

معمول است که عملیات همزمان را به صورت غیر ضروری در وعده ها بپیچید، که این امر به پیچیدگی می افزاید.

const promise = new Promise((resolve) => {
resolve(‘Hello, World!’);
});
promise.then((message) => console.log(message));

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در عوض، فقط از مقدار به طور مستقیم استفاده کنید:

Promise.resolve(‘Hello, World!’).then((message) => console.log(message));

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

4. فراموش کردن رسیدگی به رد

همیشه ردها را مدیریت کنید تا از رد وعده‌های کنترل نشده جلوگیری کنید، که می‌تواند باعث ایجاد مشکلاتی در درخواست شما شود.

const promise = new Promise((_, reject) => {
reject(‘Error occurred’);
});
promise.then((message) => console.log(message)); // No catch handler

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

همیشه یک بلوک catch اضافه کنید:

promise
.then((message) => console.log(message))
.catch((error) => console.error(error));

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

5. مخلوط کردن Promises و Async/Await

در حالی که وعده‌ها و همگام‌سازی/انتظار هر دو روشی برای مدیریت کدهای ناهمزمان هستند، مخلوط کردن آنها می‌تواند منجر به سردرگمی شود.

async function fetchData() {
const data = await fetch(‘https://api.example.com/data’);
data.then((result) => console.log(result)); // Unnecessary promise
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

به یک رویکرد پایبند باشید:

async function fetchData() {
const data = await fetch(‘https://api.example.com/data’);
console.log(await data.json());
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

نتیجه

Promises بخش اساسی جاوا اسکریپت مدرن است که راهی قوی برای مدیریت عملیات ناهمزمان ارائه می دهد. با درک نحوه ایجاد، استفاده و مدیریت وعده‌ها، می‌توانید کد تمیزتر و قابل نگهداری‌تری بنویسید. اجتناب از اشتباهات رایج به شما کمک می کند تا به طور موثر از قول ها استفاده کنید و از دام های احتمالی جلوگیری کنید. چه در حال انجام یک کار ناهمزمان یا هماهنگ کردن چندین عملیات همزمان باشید، وعده ها ابزار قدرتمندی در جعبه ابزار جاوا اسکریپت شما هستند.

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

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

rahulvijayvergiya.hashnode.dev