JavaScript, ES6, ES7, ES10 waar staan we?

ES6 en ES7 – reminder

Ik ga je niet beledigen en de zoveelste ES6 introductie schrijven…Maar eigenlijk ga ik dat wel doen. In een notendop, ES6 (of ES2015) is de groep functies die Stage 4 gehaald hebben volgens de 2015 mijlpaal. Met andere woorden, als je een goed begrip hebt van ES6 en enige kennis van ES7, heb je ongeveer 4 jaar in te halen…Geen druk.

Laten we eens kijken naar wat officieel deel uitmaakt van ES6. Trouwens, al deze functies worden officieel ondersteund door alle browsers. Met andere woorden, je hebt Babel niet nodig om ze te gebruiken (tenzij je IE 11 ondersteunt, dat er een paar mist).

In ES6 hebben we:

De mogelijkheid om klassen te maken en te erven.

class MyComponent extends React.Components {}

ES6-modules met import en export.

import * from 'React';export default MyComponent;

Generators

let fibonacci = { 
*() { 
let pre = 0, cur = 1 
for (;;) { 
 = 
yield cur
}
}
}

Heb je het gemerkt? Decorators, Object destructuring (zoals React props: {…props}) enzovoort maken geen deel uit van ES6!

Over ES7 (ES2016) hier is wat we hebben. Het is nogal een kleine update:

• De exponentiation operator base ** exponent
• Array omvat array.includes(myItem) // true or false

Bron: http://ecma-international.org/ecma-262/7.0/

Zoals je waarschijnlijk al hebt gemerkt, nee, Async/Await is geen onderdeel van ES7, maar van ES8!

ES8, ES9, ES10

Iedereen die de afgelopen 2 jaar een JavaScript-gerelateerd interview heeft gehad, is minstens 1671 keer gevraagd wat ES6 is, en welke functie het brengt. Maar is het iemand opgevallen dat JS natuurlijk niet plotseling is gestopt bij ES6 of ES7, maar dat niemand je er iets over vraagt? Hier is je kans om dingen recht te zetten!

In ES8 (ES2017), hier zijn de beschikbare functies:

En natuurlijk, Async / Await functies:

Als je het artikel hebt gevolgd, zou je het nu moeten snappen: Met slechts kleine uitzonderingen, die functies zijn Stage 4, bent u in staat om ze te gebruiken in de browser zonder Babel (dat gezegd, ES8 wordt ES2017, het is nog steeds vrij recent en sommige implementaties zoals Edge en Opera’s native engine zijn achter een beetje).

Op naar ES9. Net als ES8 en ES6 is ES9 (of ES2018) een vrij grote update:

Uiteindelijk op naar ES10 (of ES2019)!

const array = ;array.sort(...)/*

*/

• Maak van JavaScript een superset van JSON (zie details hier)

Hoe zit het met ES5?

Als ES6 ES2015 is, en ES7 ES2016, kun je dan raden wat het jaartal van ES5 is?

…Je hebt verloren! (Tenzij je het echt weet, maar aangezien ik je niet kan horen, ga ik ervan uit dat je verloren hebt). ES5 is ES2009!

Het houdt hier niet op, voor ES5 was de laatste ES update in 1999!

Zoals je ziet waren er van 97 tot 99 vrij regelmatig updates, daarna zou ES5 de enige update in 16 jaar worden!

Hoe verklaren we dat? Welnu, naar mijn mening zijn er twee factoren. De eerste is technisch: JavaScript is waardeloos. Eerlijk waar, dat is zo. Destijds hadden we een paar alternatieven voor JS: Java-applets, ActiveX en zelfs Flash.

Tot ongeveer 2011 (toen Chrome een bullet begon te worden) waren deze technologieën niet alleen een orde van grootte sneller dan JS, maar ze hadden ook al de meeste functies die we nu nog steeds met moeite in JS proberen te krijgen. (Java heeft alle taalfuncties zoals class en decorators, ondersteuning van multi-threading, OpenGL, Sockets, etc…). Toen Chrome en Google hun intrede deden en in 2013 aankondigden dat Java uit was (en daarna volgde Flash), was de kruistocht om JS zijn concurrenten te laten inhalen begonnen. Twee jaar later stond ES6 voor de deur.

De tweede factor is economisch: 2000 is het jaar van het uiteenspatten van de Dot-com bubble. Voor de jongsten onder u, stelt u zich eens voor wat bitcoin een paar jaar geleden is geweest, Internet startups waren eind jaren ’90 hetzelfde. Startups voegden .com toe aan het einde van hun naam om enorme durfkapitaalinvesteringen te krijgen (net zoals we nu een belofte hebben van mySuperStartup.ai) tot de waarde plots daalde in de jaren ’20. Dit is een zeer rudimentaire uitleg, en ik nodig u uit om een kijkje te nemen op de wikipedia artikel voor een betere.

Het punt is dat Internet gestopt met het verkrijgen van de tractie die het nodig had om JS en web-gerelateerde technologieën een focus te maken. Later, met de opkomst van Amazon, Facebook en Google, had het web een nieuwe reden om te zijn, en een nieuwe reden om te bloeien. Het was logisch dat we JS weer oppakten! Google werd openbaar in 2004, Chrome kwam uit in 2008, en werd de populairste browser in 2014: een jaar voordat ES6 arriveerde.

What’s Missing? (Afgewezen voorstellen)

Object.observe

Deze is waarschijnlijk de grootste afwijzing van allemaal. Het stond JS aanvankelijk toe om alle waarden in de code te observeren :

var obj = {
foo: 0,
bar: 1
};
Object.observe(obj, function(changes) {
console.log(changes);
});obj.baz = 2;
// 

Dit was een geweldige functie, en natuurlijk kun je het vanuit je code doen (of met een polyfill), maar het implementeren ervan in de browser was de belofte van een snellere reactieve code (ex: Angular gebruikt veel observeren). Het werd teruggetrokken omdat ze niet tot een implementatie konden komen met constante performance. Meer details hier.

Cancelable Promises

Zelfverklarend, een feature die, daar ben ik zeker van, niet de enige is die ontbreekt. Het idee is om ontwikkelaars in staat te stellen de uitvoering van een belofte te annuleren op elk gewenst moment.

De use cases variëren, bijvoorbeeld om client-side time-out op async operatie, of bijvoorbeeld, als je een tab-gedreven navigatiesysteem, en de gebruiker klikt op een tab voordat je had tijd om de inhoud van de huidige tab te laden.

blöcks

Ik noem deze alleen omdat ik de naam leuk vind, maar ook omdat het een leuke functie is, vergelijkbaar met Go Routines of C# Tasks.

const blöck = await {|
// This code is Async, but most importantly, executed in another thread
|};

Oders

Er zijn nog een paar interessante voorstellen gedaan, zoals aanroepbare constructors. De meeste daarvan zijn ofwel teruggetrokken omdat de oorspronkelijke auteur dat heeft gedaan, of afgewezen omdat ze conflicteren of overlappen met bestaande/geplande features.