Een blik op ECMAScript, Javascript interpreters, en transpilers.
De Javascript wereld kan een verwarrende wereld zijn. Mensen praten over ECMAScript, Javascript, ES5, en ES2015 (wat overigens hetzelfde is als ES6).
In dit artikel zal ik het Javascript landschap uitleggen.
ECMAScript is een taalspecificatie, en Javascript implementeert deze specificatie.
Elke paar jaar brengt ECMAScript een nieuwe versie uit. In principe bevat de nieuwe versie een lijst van nieuwe functies die moeten worden toegevoegd.
In de nieuwe ECMAScript-versie zou er bijvoorbeeld een nieuwe functie kunnen zijn: add() die twee getallen optelt.
Op deze manier kun je eindelijk 2 getallen optellen met een functie – Ik weet dat dit geen nuttige functie is, maar bear with me for the sake of the example 🙌
const result = add(12, 4);
console.log(result);
Wanneer dit is besloten, is het aan alle Javascript tolken om deze nieuwe functie te implementeren.
Javascript-interpreters
Een Javascript-interpreter is een programma dat Javascript-code leest en uitvoert. Alle browsers die Javascript ondersteunen zijn Javascript-interpreters.
Naast browsers zijn er ook nog andere Javascript-interpreters. NodeJS is een primair voorbeeld van een interpreter die ons JavaScript laat uitvoeren buiten een browser. Het is een interpreter omdat het ook Javascript leest en uitvoert (en ook API’s levert aan het OS).
Niet iedereen werkt zijn browser bij, en niet alle browsers ondersteunen dezelfde Javascript functies. En dit is waar dingen rommelig worden.
De nieuwste ECMAScript versie is ES10. Maar niet alle browsers ondersteunen deze nieuwe ES-versie, omdat ze de nieuwe functies nog moeten implementeren.
Daar komt bij dat er veel mensen zijn met verouderde versies van hun browser, dus het kan even duren voordat alle gebruikers die nieuwe fancy ES10-functies kunnen uitvoeren.
ES Versies
Laten we een kleine omweg maken en het over ES-versies hebben.
Zoals ik in de vorige paragraaf heb vermeld, is de nieuwste versie van ECMAScript ES10. Nu is er niet echt een naamgeving conventie als het gaat om ECMAScript versies. Dus ES10 wordt ook wel ECMAScript2019 en ES2019 genoemd.
Daarnaast was de laatste echt grote verandering aan de taal met ES6 die in 2015 uitkwam, dus het wordt soms ook aangeduid als ES2015 – Ja het is verwarrend, ik weet het 😌
Omdat er slechts kleine veranderingen aan de taal zijn na ES6 worden alle versies na ES6 soms ook aangeduid als ESNext.
Javascript Transpilers
Herken je het probleem dat niet alle browsers de nieuwste ES10-functies ondersteunen? Er is een oplossing. Transpilers!
Babel is een voorbeeld van een Javascript-transpiler. Babel zal een nieuwere Javascript versie omzetten naar een oudere. Op deze manier kun je de nieuwe fancy ES10 functies gebruiken, en het door Babel laten transpileren naar de breed ondersteunde ES5 versie.
Verschil tussen NodeJS en Browsers
NodeJS en Browsers zijn beide Javascript interpreters. Afhankelijk van welke browserversie en welke Node-versie je hebt, kunnen ze dezelfde versie van ECMAScript ondersteunen.
Node wordt echter direct op een computer uitgevoerd. Dit betekent dat er een aantal bibliotheken gebundeld zijn met Node die niet zullen werken in de browser.
In NodeJS kun je bijvoorbeeld nieuwe bestanden maken. In een browser zou dit een groot veiligheidsrisico zijn, dus dit is niet mogelijk.
Daarom zullen NodeJS-programma’s die in dezelfde ECMAScript-versie zijn geschreven, nog steeds niet draaien in de browser die dezelfde versie ondersteunt.