ECMAScript 2017

Die JavaScript-Namenkonvention beginnt mit ES1, ES2, ES3, ES5 und ES6.

Allerdings werden ECMAScript 2016 und 2017 nicht ES7 und ES8 genannt.

Seit 2016 werden neue Versionen nach Jahren benannt (ECMAScript 2016/2017/2018).

Neue Funktionen in ECMAScript 2017

Dieses Kapitel stellt die neuen Funktionen von ECMAScript 2017 vor:

  • JavaScript String-Füllung
  • JavaScript Object.entries
  • JavaScript Object.values
  • JavaScript asynchrone Funktionen
  • JavaScript Shared Memory

JavaScript String-Füllung

ECMAScript 2017 hat zwei neue String-Methode hinzugefügt:padStart und padEndum das Füllen am Anfang und am Ende von Strings zu unterstützen.

Beispiel

let str = "5";
str = str.padStart(4,0);
// Ergebnis: 0005

Probieren Sie es selbst aus

Beispiel

let str = "5";
str = str.padEnd(4,0);
// Das Ergebnis ist: 5000

Probieren Sie es selbst aus

Internet Explorer unterstützt keine String-Filling.

Firefox und Safari waren die ersten Browser, die das JavaScript-String-Filling unterstützten:

Chrome IE Firefox Safari Opera
Chrome 57 Edge 15 Firefox 48 Safari 10 Opera 44
März 2017 April 2017 August 2016 September 2016 März 2017

JavaScript-Objekteinträge

ECMAScript 2017 hat neue Funktionen für Objekte hinzugefügt Object.entries Methode.

Object.entries() gibt ein Array von Schlüssel/Wert-Paaren aus dem Objekt zurück:

Beispiel

const person = {
  firstName : "Bill",
  lastName : "Gates",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.entries(person);

Probieren Sie es selbst aus

Object.entries() vereinfacht das Verwenden von Objekten im Loop:

Beispiel

const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "
";
}

Probieren Sie es selbst aus

Object.entries() macht es einfach, Objekte in Mengen zu konvertieren:

Beispiel

const fruits = {Bananas:300, Oranges:200, Apples:500};
const myMap = new Map(Object.entries(fruits));

Probieren Sie es selbst aus

Chrome und Firefox waren die ersten, die dies unterstützten Object.entries Browser:

Chrome IE Firefox Safari Opera
Chrome 47 Edge 14 Firefox 47 Safari 10.1 Opera 41
Juni 2016 August 2016 Juni 2016 März 2017 Oktober 2016

JavaScript-Objektwerten

Object.values ähnlich Object.entriesaber gibt eine Einzelelement-Array der Objektwerte zurück:

Beispiel

const person = {
  firstName : "Bill",
  lastName : "Gates",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.values(person);

Probieren Sie es selbst aus

Firefox und Chrome waren die ersten, die dies unterstützten Object.values Browser:

Chrome IE Firefox Safari Opera
Chrome 54 Edge 14 Firefox 47 Safari 10.1 Opera 41
Oktober 2016 August 2016 Juni 2016 März 2017 Oktober 2016

JavaScript asynchrone Funktionen

Warten auf Zeitüberschreitung

async function myDisplay() {
  let myPromise = new Promise(function(myResolve, myReject) {
    setTimeout(function() { myResolve("Ich liebe dich !!"); }, 3000);
  });
  document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();

Probieren Sie es selbst aus

Firefox und Chrome sind die ersten Browser, die asynchrone JavaScript-Funktionen unterstützen:

Chrome IE Firefox Safari Opera
Chrome 55 Edge 15 Firefox 52 Safari 11 Opera 42
Dezember 2016 April 2017 März 2017 September 2017 Dezember 2016