Promise در JavaScript

"I Promise a Result!"

"Producing code" (کد تولیدی) کدی است که نیاز به زمان دارد

"Consuming code" (کد مصرفی) کدی است که باید به نتیجه منتظر بماند

Promise یک شیء JavaScript است که کد تولیدی و کد مصرفی را به هم متصل می‌کند

شیء Promise JavaScript

شیء Promise JavaScript شامل کد تولیدی و فراخوانی کد مصرفی است:

نوعPromise

let myPromise = new Promise(function(myResolve, myReject) {
// "Producing Code" (ممکن است نیاز به زمان داشته باشد)
  myResolve(); // در موفقیت
  myReject();  // در خطا
});
// "Consuming Code" (باید یک تعهد به تحقق برسد)
myPromise.then(
  function(value) { /* کد موفقیت */ },
  function(error) { /* کد خطا */ }
);

وقتی کد اجرا می‌شود و نتیجه‌ای به دست می‌آید، باید یکی از دو کاربرگشت را فراخوانی کند:

نتیجه دعوت از
موفقیت myResolve(result value)
خطا myReject(error object)

ویژگی‌های شیء Promise

شیء Promise JavaScript می‌تواند باشد:

  • Pending
  • Fulfilled
  • Rejected

شیء Promise پشتیبانی از دو ویژگی دارد:state و result.

وقتی یک شیء Promise "pending" (در حال کار) است، نتیجه undefined است.

وقتی یک شیء Promise "fulfilled" است، نتیجه یک مقدار است.

وقتی یک شیء Promise "rejected" است، نتیجه یک شیء خطا است.

myPromise.state myPromise.result
"pending" undefined
"fulfilled" مقدار نتیجه
"rejected" شیء error

شما نمی‌توانید به ویژگی‌های state و result Promise دسترسی پیدا کنید.

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

چگونه از Promise استفاده کنیم

در اینجا روش‌های استفاده از Promise آورده شده است:

myPromise.then(
  function(value) { /* کد اگر موفق باشد */ },
  function(error) { /* کد اگر خطایی باشد */ }
);

Promise.then() دو پارامتر دارد، یکی برای بازگشتی که در موفقیت فراخوانی می‌شود و دیگری برای بازگشتی که در شکست فراخوانی می‌شود.

هر دو انتخابی هستند، بنابراین می‌توانید برای موفقیت یا شکست یک بازگشتی اضافه کنید.

مثال

function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
}
let myPromise = new Promise(function(myResolve, myReject) {
  let x = 0;
// کد تولید (این ممکن است مدتی طول بکشد)
  if (x == 0) {
    myResolve("OK");
  } else {
    myReject("Error");
  }
});
myPromise.then(
  function(value) {myDisplayer(value);},
  function(error) {myDisplayer(error);}
);

آزمایش کنید

مثال JavaScript Promise

برای نمایش استفاده از Promise، ما از مثال بازگشتی فصل قبلی استفاده خواهیم کرد:

  • در انتظار اتمام زمان
  • در انتظار فایل

در انتظار اتمام زمان

مثال استفاده از کاربردهای بازگشتی

setTimeout(function() { myFunction("I love You !!!"); }, 3000);
function myFunction(value) {
  document.getElementById("demo").innerHTML = value;
}

آزمایش کنید

مثال استفاده از Promise

let myPromise = new Promise(function(myResolve, myReject) {
  setTimeout(function() { myResolve("I love You !!"); }, 3000);
});
myPromise.then(function(value) {
  document.getElementById("demo").innerHTML = value;
});

آزمایش کنید

در انتظار فایل

مثال استفاده از کاربردهای بازگشتی

function getFile(myCallback) {
  let req = new XMLHttpRequest();
  req.open('GET', "mycar.html");
  req.onload = function() {
    if (req.status == 200) {}}
      myCallback(req.responseText);
    } else {
      myCallback("Error: " + req.status);
    }
  }
  req.send();
}
getFile(myDisplayer);

آزمایش کنید

مثال استفاده از Promise

let myPromise = new Promise(function(myResolve, myReject) {
  let req = new XMLHttpRequest();
  req.open('GET', "mycar.htm");
  req.onload = function() {
    if (req.status == 200) {}}
      myResolve(req.response);
    } else {
      myReject("File not Found");
    }
  };
  req.send();
});
myPromise.then(
  function(value) {myDisplayer(value);},
  function(error) {myDisplayer(error);}
);

آزمایش کنید

پشتیبانی مرورگر

ECMAScript 2015، که به ES6 نیز معروف است، Promise Object جدیدی را برای JavaScript معرفی کرده است.

در جدول زیر نسخه‌های اولیه مرورگرهایی که از Promise Object پشتیبانی می‌کنند، مشخص شده است:

Chrome IE Firefox Safari Opera
Chrome 33 Edge 12 Firefox 29 Safari 7.1 Opera 20
février 2014 جولای 2015 آوریل 2014 سپتامبر 2014 مارس 2014