JavaScript Promise

"I Promise a Result!"

"Producing code(Üretim kodu)" bazı zaman alacak kod demektir

"Consuming code(Tüketim kodu)" sonuç bekleyen kod demektir

Promise, üretim kodunu ve tüketim kodunu birleştiren bir JavaScript nesnesidir

JavaScript Promise nesnesi

JavaScript Promise nesnesi, üretim kodunu ve tüketim kodunu çağırır:

Promise dilbilgisi

let myPromise = new Promise(function(myResolve, myReject) {
// "Producing Code"(Biraz zaman alabilir)
  myResolve(); // Başarılı olduğunda
  myReject();  // Hata olduğunda
});
// "Consuming Code" (Sonuç bekleyen bir taahhüt beklemek zorundasınız)
myPromise.then(
  function(value) { /* Başarılı olduğunda kod */ },
  function(error) { /* Hata olduğunda kod */ }
);

Kod çalıştırılırken sonuç elde edildiğinde, iki geri çağrıdan birini çağırmalısınız:

Sonuç Çağrı
Başarılı myResolve(sonuç değeri)
Hata myReject(hata nesnesi)

Promise nesnesi özellikleri

JavaScript Promise nesnesi şu şekilde olabilir:

  • Pending
  • Fulfilled
  • Rejected

Promise nesnesi iki özellik destekler:state ve result.

Bir Promise nesnesi "pending" (çalışırken) olduğunda, sonuç tanımsızdır.

Bir Promise nesnesi "fulfilled" olduğunda, sonuç bir değerdir.

Bir Promise nesnesi "rejected" olduğunda, sonuç bir hata nesnesidir.

myPromise.state myPromise.result
"pending" tanımsız
"fulfilled" Sonuç değeri
"rejected" error nesnesi

Promise özellikleri state ve result'e erişemezsiniz.

Promise yöntemini kullanarak Promise'leri işlemek zorundasınız.

Promise nasıl kullanılır

Aşağıda Promise kullanımı yöntemleri verilmiştir:

myPromise.then(
  function(value) { /* başarılı durumda bazı kodlar */ },
  function(error) { /* bir hata durumunda bazı kodlar */ }
);

Promise.then() iki parametre içerir, biri başarılı durum için geri çağrı, diğeri ise başarısız durum için geri çağrıdır.

Her ikisi de seçimli olduğundan, başarılı veya başarısız olma durumunda geri çağrı ekleyebilirsiniz.

Örnek

function myDisplayer(some) {
  document.getElementById("demo").innerHTML = some;
}
let myPromise = new Promise(function(myResolve, myReject) {
  let x = 0;
// Kod oluşturma (bu biraz zaman alabilir)
  if (x == 0) {
    myResolve("Tamam");
  } else {
    myReject("Hata");
  }
});
myPromise.then(
  function(value) {myDisplayer(value);},
  function(error) {myDisplayer(error);}
);

Try It Yourself

JavaScript Promise Örneği

Promise kullanımını göstermek için, bir önceki bölümdeki geri çağrı örneğini kullanacağız:

  • Bekleme zaman aşımı
  • Dosyayı bekleyin

Bekleme zaman aşımı

Geri çağrı kullanımı örneği

setTimeout(function() { myFunction("Beni seviyorum !!!"); }, 3000);
function myFunction(value) {
  document.getElementById("demo").innerHTML = value;
}

Try It Yourself

Promise kullanımı örneği

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

Try It Yourself

Dosyayı bekleyin

Geri çağrı kullanımı örneği

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

Try It Yourself

Promise kullanımı örneği

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);}
);

Try It Yourself

Browser Support

ECMAScript 2015, also known as ES6, introduced the JavaScript Promise object.

The following table lists the first browser version to fully support Promise objects:

Chrome IE Firefox Safari Opera
Chrome 33 Edge 12 Firefox 29 Safari 7.1 Opera 20
February 2014 July 2015 April 2014 September 2014 March 2014