--- title: Promise slug: Web/JavaScript/Referencje/Obiekty/Promise tags: - JavaScript - Obietnice translation_of: Web/JavaScript/Reference/Global_Objects/Promise ---
{{JSRef}}

Obiekt Promise reprezentuje ewentualne zakończenie (lub porażkę) asynchronicznej operacji i jej wartości.

Artykuł opisuje konstruktor, metody i właściwości obiektu Promise. By nauczyć się jak działają obietnice i jak można ich używać zalecamy przeczytać najpierw Użycie obietnic . Ten konstruktor jest głównie używany do opakowania funkcji, które nie wspierają jeszcze obietnic.

{{EmbedInteractiveExample("pages/js/promise-constructor.html")}}

Składnia

new Promise( /* wykonawca */ function(resolve, reject) { ... } );

Parametry

wykonawca (executor)
Funkcja przekazywana z argumentami resolve i reject. Funkcja ta wykonywana jest natychmiast przez implementację obietnicy, przekazując funkcje resolve i reject (ta funkcja jest wywoływana, zanim konstruktor Promise zwróci utworzony obiekt). Funkcje resolve i reject , gdy są wywoływane, odpowiednio rozwiązują lub odrzucają obietnicę. Ta funkcja zwykle inicjuje pracę asynchroniczną, a następnie, po jej zakończeniu, wywołuje funkcję resolve w celu rozwiązania obietnicy lub odrzuca ją, jeśli wystąpił błąd. Jeśli błąd zostanie zgłoszony w tej funkcji, obietnica zostaje odrzucona. Wartość zwracana tej funkcji jest ignorowana.

Opis

Promise jest proxy dla wartości niekoniecznie znanej, gdy jest tworzona. Pozwala na kojarzenie uchwytu z ewentualnym sukcesem lub porażką asynchroniczne akcji. Pozwala to metodom asynchronicznym zwracać wartości takie jak metody synchroniczne, zamiast natychmiastowego zwracania wartości końcowej, metoda asynchroniczna zwraca obietnicę dostarczenia wartości w pewnym momencie w przyszłości.

Promise jest dostępny w jednym z tych stanów:

Obowiązująca objetnica może być zakończona z wartością lub odrzucona z powodem(błędem). Kiedy dzieje się jedna z tych opcji, wywoływane są zakolejkowane, powiązane za pomocą metody then procedury. (Jeśli obietnica została już spełniona lub odrzucona, gdy dołączony jest odpowiedni moduł obsługi, zostanie on wywołany, więc nie ma potrzeby wyścigu między zakończeniem operacji asynchronicznej a jej obsługą).

Tak jak w {{jsxref("Promise.then", "Promise.prototype.then()")}} oraz {{jsxref("Promise.catch", "Promise.prototype.catch()")}} gdy metoda zwróci obietnice, mogą one być łączone w łańcuchy.

Nie mylić z: Kilka innych języków ma mechanizmy leniwego oceniania i odraczania obliczeń, które nazywają również "obietnicami", np. Scheme. Obietnice w JavaScript oznaczają procesy, które już się odbywają, które mogą być powiązane z funkcjami wywołania zwrotnego. Jeśli chcesz leniwie oceniać wyrażenie, rozważ  funkcje strzałkowe bez argumentów: f = () => wyrażenie by stworzyć leniwo oszacowane wyrażenie, i f() by ocenić.

Mówi się, że obietnica zostanie uregulowana, jeśli zostanie spełniona lub odrzucona, ale nie oczekuje na rozpatrzenie. Usłyszysz także termin rozwiązany używany z obietnicami - oznacza to, że obietnica jest ustalona lub "zamknięta", aby dopasować się do stanu innej obietnicy. Stany i losy zawierają więcej szczegółów na temat obiecanej terminologii.

Właściwości

Promise.length
Właściwość Length, której wartość wynosi zawsze 1 (liczba argumentów konstruktora).
{{jsxref("Promise.prototype")}}
Reprezentuje prototyp konstruktora Promise.

Metody

{{jsxref("Promise.all", "Promise.all(iterable)")}}
Zwraca obietnice, która albo kończy się sukcesem gdy wszystkie z obietnic w iterable się zakończą powodzeniem lub kończy sie porażką tak szybko jak jedna z obietnic skończy się porażką. Jeżeli zwrócona obietnica kończy się sukcesem jest ona wypełniana tablicą wartości z obietnic zakończonych sukcesem w takim samym układzie jak były one zdefiniowane w iterable. Jeżeli zwrócona obietnica zakończyła się porażką, jest ona odrzucana z Powodem z pierwszej obietnicy w iterable, która zakończyła się porażką. Ta metoda może być pomocna do zachowywania rezultatów różnych obietnic.
{{jsxref("Promise.race", "Promise.race(iterable)")}}
Returns a promise that fulfills or rejects as soon as one of the promises in the iterable fulfills or rejects, with the value or reason from that promise.
{{jsxref("Promise.reject", "Promise.reject(reason)")}}
Returns a Promise object that is rejected with the given reason.
{{jsxref("Promise.resolve", "Promise.resolve(value)")}}
Returns a Promise object that is resolved with the given value. If the value is a thenable (i.e. has a then method), the returned promise will "follow" that thenable, adopting its eventual state; otherwise the returned promise will be fulfilled with the value. Generally, if you don't know if a value is a promise or not, {{jsxref("Promise.resolve", "Promise.resolve(value)")}} it instead and work with the return value as a promise.

Promise prototype

Właściwości

{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Properties')}}

Metody

{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Methods')}}

Tworzenie Promise

A Promise object is created using the new keyword and its constructor. This constructor takes as its argument a function, called the "executor function". This function should take two functions as parameters. The first of these functions (resolve) is called when the asynchronous task completes successfully and returns the results of the task as a value. The second (reject) is called when the task fails, and returns the reason for failure, which is typically an error object.

const myFirstPromise = new Promise((resolve, reject) => {
  // do something asynchronous which eventually calls either:
  //
  //   resolve(someValue); // fulfilled
  // or
  //   reject("failure reason"); // rejected
});

To provide a function with promise functionality, simply have it return a promise:

function myAsyncFunction(url) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open("GET", url);
    xhr.onload = () => resolve(xhr.responseText);
    xhr.onerror = () => reject(xhr.statusText);
    xhr.send();
  });
}

Przykłady

Podstawowy przykład

let myFirstPromise = new Promise((resolve, reject) => {
  // We call resolve(...) when what we were doing asynchronously was successful, and reject(...) when it failed.
  // In this example, we use setTimeout(...) to simulate async code.
  // In reality, you will probably be using something like XHR or an HTML5 API.
  setTimeout(function(){
    resolve("Success!"); // Yay! Everything went well!
  }, 250);
});

myFirstPromise.then((successMessage) => {
  // successMessage is whatever we passed in the resolve(...) function above.
  // It doesn't have to be a string, but if it is only a succeed message, it probably will be.
  console.log("Yay! " + successMessage);
});

Zaawansowany Przykład

This small example shows the mechanism of a Promise. The testPromise() method is called each time the {{HTMLElement("button")}} is clicked. It creates a promise that will be fulfilled, using {{domxref("window.setTimeout()")}}, to the promise count (number starting from 1) every 1-3 seconds, at random. The Promise() constructor is used to create the promise.

The fulfillment of the promise is simply logged, via a fulfill callback set using {{jsxref("Promise.prototype.then()","p1.then()")}}. A few logs show how the synchronous part of the method is decoupled from the asynchronous completion of the promise.

'use strict';
var promiseCount = 0;

function testPromise() {
    let thisPromiseCount = ++promiseCount;

    let log = document.getElementById('log');
    log.insertAdjacentHTML('beforeend', thisPromiseCount +
        ') Started (<small>Sync code started</small>)<br/>');

    // We make a new promise: we promise a numeric count of this promise, starting from 1 (after waiting 3s)
    let p1 = new Promise(
        // The resolver function is called with the ability to resolve or
        // reject the promise
       (resolve, reject) => {
            log.insertAdjacentHTML('beforeend', thisPromiseCount +
                ') Promise started (<small>Async code started</small>)<br/>');
            // This is only an example to create asynchronism
            window.setTimeout(
                function() {
                    // We fulfill the promise !
                    resolve(thisPromiseCount);
                }, Math.random() * 2000 + 1000);
        }
    );

    // We define what to do when the promise is resolved with the then() call,
    // and what to do when the promise is rejected with the catch() call
    p1.then(
        // Log the fulfillment value
        function(val) {
            log.insertAdjacentHTML('beforeend', val +
                ') Promise fulfilled (<small>Async code terminated</small>)<br/>');
        })
    .catch(
        // Log the rejection reason
       (reason) => {
            console.log('Handle rejected promise ('+reason+') here.');
        });

    log.insertAdjacentHTML('beforeend', thisPromiseCount +
        ') Promise made (<small>Sync code terminated</small>)<br/>');
}

This example is started by clicking the button. You need a browser that supports Promise. By clicking the button several times in a short amount of time, you'll even see the different promises being fulfilled one after another.

{{EmbedLiveSample("Advanced_Example", "500", "200")}}

Ładowanie obrazka z XHR

Another simple example using Promise and XMLHttpRequest to load an image is available at the MDN GitHub js-examples repository. You can also see it in action. Each step is commented and allows you to follow the Promise and XHR architecture closely.

Specyfikacja

Specification Status Comment
{{SpecName('ES2015', '#sec-promise-objects', 'Promise')}} {{Spec2('ES2015')}} Initial definition in an ECMA standard.
{{SpecName('ESDraft', '#sec-promise-objects', 'Promise')}} {{Spec2('ESDraft')}}

Zgodność z przeglądarkami

{{Compat("javascript.builtins.Promise")}}

Zobacz również