ES8: Was ist neu in der JavaScript-Sprache im Jahr 2017?

ES8 ist live! ES8 (auch ES2017 genannt) wurde Anfang des Sommers veröffentlicht und bietet neue Möglichkeiten zum Codieren mit JavaScript. Lassen Sie uns sie erkunden.

Wenn Sie die neueste Version von Chrome haben, öffnen Sie die Konsole und lassen Sie uns gemeinsam Code erstellen.

Object.values ​​()

Greifen Sie ohne Komplikationen auf alle Werte unseres Objekts zu. Hier ist ein Beispiel:

const countries = { BR: 'Brazil', DE: 'Germany', RO: 'Romania', US: 'United States of America'};
Object.values(countries); // ['Brazil', 'Germany', 'Romania', 'United States of America']

Object.entries

Verwandeln Sie Ihr Objektattribut in ein Array von Attributen:

const countries = { BR: 'Brazil', DE: 'Germany', RO: 'Romania', US: 'United States of America'};
Object.entries(countries); 
// [['BR', 'Brazil'], ['DE', 'Germany'], ['RO', 'Romania'], ['US','United States of America']]

String-Polsterung (padStart und padEnd)

Dies gibt die übergebene Zeichenfolge zurück, die das Pad und den Anfang oder das Ende hinzufügt. Die Funktionsdefinition lautet:

'string'.padStart(targetLength, padString)
'string'.padEnd(targetLength, padString)

Wir können machen:

'0.10'.padStart(10); // it return a string of length 10, padding empty spaces in the beginning
'hi'.padStart(1); // 'hi''hi'.padStart(5); // ' hi''hi'.padStart(5, 'abcd'); // 'abchi''hi'.padStart(10, 'abcd'); // 'abcdabcdhi'
'loading'.padEnd(10, '.'); // 'loading...'
// useful example making things easier to read'0.10'.padStart(12); // ' 0.10''23.10'.padStart(12); // ' 23.10''12,330.10'.padStart(12); // ' 12,330.10'

Object.getOwnPropertyDescriptors ()

Es gibt alle eigenen (nicht vererbten) Eigenschaftsbeschreibungen eines Objekts zurück. Die Attribute des Rückgabeobjekts können sein: value, writable, get, set, configurableund enumerable.

const obj = { name: 'Pablo', get foo() { return 42; }};
Object.getOwnPropertyDescriptors(obj);//// {// "name": {// "value": "Pablo",// "writable":true,// "enumerable":true,// "configurable":true// },// "foo":{// "enumerable":true,// "configurable":true,// "get": function foo()// "set": undefined// }// }

Ein praktisches Beispiel ist: JavaScript verfügt über eine Methode zum Kopieren von Eigenschaften Object.assign(). Es kopiert die Eigenschaft, deren Schlüssel ist key. So was:

const value = source[key]; // gettarget[key] = value; // set

In einigen Fällen schlägt dies fehl, weil die Eigenschaften mit nicht standardmäßigen Attributen wie Getter, Setter und nicht beschreibbaren Eigenschaften nicht ordnungsgemäß kopiert werden.

Zum Beispiel:

const objTarget = {};const objSource = { set greet(name) { console.log('hey, ' + name); }};Object.assign(objTarget, objSource);
objTarget.greet = 'love'; // trying to set fails, sets greet = 'love'

Lösen:

const objTarget = {};const objSource = { set greet(name) { console.log('hey, ' + name); }};Object.defineProperties(objTarget, Object.getOwnPropertyDescriptors(objSource));
objTarget.greet = 'love'; // prints 'hey, love'

Nachgestellte Kommas in Funktionsparameterlisten und Aufrufen

Dies ist eine Syntaxänderung. Es erlaubt uns, am Ende eine gültige Funktionsdeklaration mit Komma zu schreiben.

getDescription(name, age,) { ... }

Asynchrone Funktionen (asynchron und warten)

Dies erleichtert die Arbeit mit asynchronen Funktionen erheblich:

function loadExternalContent() { return new Promise((resolve, reject) => { setTimeout(() => { resolve('hello'); }, 3000); });}
async function getContent() { const text = await loadExternalContent(); console.log(text);}
console.log('it will call function');getContent();console.log('it called function');
// it prints:
'it will call function' // synchronous'it called function' // synchronous'hello' // asynchronous (after 3 seconds)

Shared Memory und Atomics

Gemäß der Spezifikation:

"Der gemeinsam genutzte Speicher wird in Form eines neuen SharedArrayBuffer-Typs verfügbar gemacht. Das neue globale Atomics-Objekt bietet atomare Operationen an gemeinsam genutzten Speicherorten, einschließlich Operationen, mit denen blockierende Synchronisationsprimitive erstellt werden können."

Das heisst:

Shared Memory: Mit dem neuen SharedArrayBufferKonstruktor können mehrere Threads dieselben Daten lesen und schreiben .

Atomics: Wir können das AtomicsObjekt verwenden, um sicherzustellen, dass nichts, was geschrieben oder gelesen wird, während des Prozesses unterbrochen wird. Die Operationen sind also beendet, bevor die nächste beginnt.

Wenn Ihnen dieser Artikel gefallen hat, stellen Sie sicher, dass er Ihnen gefällt. Geben Sie mir viele Klatschen - bedeutet er dem Autor die Welt? Und folgen Sie mir, wenn Sie weitere Artikel über Kultur, Technologie und Startups lesen möchten.

Flávio H. de Freitas is an Entrepreneur, Engineer, Tech lover, Dreamer and Traveler. Has worked as CTO in Brazil, Silicon Valley and Europe.