Zum Hauptinhalt springen

2 Posts getaggt mit "ES2018"

Alle Tags anzeigen

`Promise.prototype.finally`

· 2 Minuten Lesezeit
Mathias Bynens ([@mathias](https://twitter.com/mathias))

Promise.prototype.finally ermöglicht das Registrieren eines Rückrufs, der ausgeführt wird, wenn ein Versprechen abgeschlossen ist (d.h. entweder erfüllt oder abgelehnt).

Stellen Sie sich vor, Sie möchten einige Daten abrufen, um sie auf der Seite anzuzeigen. Oh, und Sie möchten einen Ladekreisel anzeigen, wenn die Anfrage startet, und ihn ausblenden, wenn die Anfrage abgeschlossen ist. Wenn etwas schiefgeht, zeigen Sie stattdessen eine Fehlermeldung an.

const fetchAndDisplay = ({ url, element }) => {
  showLoadingSpinner();
  fetch(url)
    .then((response) => response.text())
    .then((text) => {
      element.textContent = text;
      hideLoadingSpinner();
    })
    .catch((error) => {
      element.textContent = error.message;
      hideLoadingSpinner();
    });
};

Objekt Rest- und Spread-Eigenschaften

· 2 Minuten Lesezeit
Mathias Bynens ([@mathias](https://twitter.com/mathias))

Bevor wir über Objekt-Rest- und Spread-Eigenschaften sprechen, machen wir eine Reise in die Vergangenheit und erinnern uns an ein sehr ähnliches Merkmal.

ES2015 Array-Rest- und Spread-Elemente​

Das gute alte ECMAScript 2015 führte Rest-Elemente für die Array-Destrukturierung und Spread-Elemente für Array-Literale ein.

// Rest-Elemente für Array-Destrukturierungszuweisung:
const primes = [2, 3, 5, 7, 11];
const [first, second, ...rest] = primes;
console.log(first); // 2
console.log(second); // 3
console.log(rest); // [5, 7, 11]

// Spread-Elemente für Array-Literale:
const primesCopy = [first, second, ...rest];
console.log(primesCopy); // [2, 3, 5, 7, 11]

ES2018: Objekt-Rest- und Spread-Eigenschaften 🆕​

Was gibt es also Neues? Nun, ein Vorschlag erlaubt auch Rest- und Spread-Eigenschaften für Objektliterale.

// Rest-Eigenschaften für Objekt-Destrukturierungszuweisung:
const person = {
    firstName: 'Sebastian',
    lastName: 'Markbåge',
    country: 'USA',
    state: 'CA',
};
const { firstName, lastName, ...rest } = person;
console.log(firstName); // Sebastian
console.log(lastName); // Markbåge
console.log(rest); // { country: 'USA', state: 'CA' }