API 2

JavaScript

Beispiel

Wassertanks

http://jsbin.com/wobuwo/edit?js,output

Callbacks

(Rückruffunktion)

Wir werden aufgerufen, sobald das Resultat bereit ist.

Eine Rückruffunktion (englisch callback function) bezeichnet in der Informatik eine Funktion, die einer anderen Funktion als Parameter übergeben und von dieser unter gewissen Bedingungen aufgerufen wird.

https://de.wikipedia.org/wiki/R%C3%BCckruffunktion​

Callbacks in Action

http://jsbin.com/yaceve/edit?js,console

Error Handling with Callbacks

http://jsbin.com/yupupo/edit?js,console​

Nested Callback Hell

http://jsbin.com/zajoru/edit?js,console​

PROMISES

Das Versprechen

Eine "Promise" stellt ein Versprechen für ein mögliches Resultat einer Operation in der Zukunft dar.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

Promise Syntax

Die Erstellung einer Promise

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

new Promise(function(resolve, reject) {
  if (ok) {
    resolve();
  } else {
    reject();
  }
});

Promise Syntax

Die Verwertung einer Promise

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

promise
  .then(function(result) {
    // Alles okay mit resultat
  })
  .catch(function(error) {
    // Etwas ging schief mit Fehler!
  });

Promise Example

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

http://jsbin.com/junafo/edit?js,console

Übung Promise

The Busy Calculator

http://jsbin.com/qejopo/edit?js,console​

Lösung: http://jsbin.com/wuhora/edit?js,console​

FETCH API

Fakten

• Nachfolger API von XMLHttpRequest
• Browser support in Chrome und Firefox
• Über Polyfill in anderen Browsern gut einsetzbar https://github.com/github/fetch
• Funktioniert mit Promises
• Sollte XMLHttpRequest immer vorgezogen werden

Beispiel

Weitere JSBins

http://jsbin.com/bireso/1/edit?html,js,output

http://jsbin.com/kilequ/1/edit?html,js,output