ECMAScript 4: a version that didn’t exist
Future students of the course “Javascript Developer. Basic” invite to visit demo day, within which you can learn in detail about the learning process and the course program, as well as ask questions to our experts…
In the meantime, we have prepared a traditional translation of an interesting article.
You’ve probably noticed that build systems use ECMAScript 3 specifications, then ECMAScript 5, and so on. ECMAScript 4 is never used. Why?
I thought it would be interesting to study the history of ECMAScript 4 and find out what we are missing.
Short story
According to Wikipedia, the first version of ECMAScript 4 appeared in February 1999. The specification was scheduled to be completed by August 2008.
ECMAScript 4 was a promising development, with many new features that were sorely lacking in ECMAScript 3. In the fourth edition, some shortcomings of ECMAScript 3 were corrected, and therefore ES4 became incompatible with previous versions.
From the very beginning, there was a lot of controversy around ES4, most of the browser developers did not support the new product, and work on ES4 had to be stopped.
In 2008, ES4 was officially dropped, and the ES3.1 standard was renamed ES5. This was a more modest, corrective update to ECMAScript.
Perhaps the most similar to ES4 at that time was ActionScript 3 for Flash applications. After the release of AS3, some of us even thought that Flash and the web would eventually become one.
The auth0 blog posted gorgeous article about the struggle for ES4 and the history of its development. I recommend reading it.
What could have been?
Classes
Classes did appear in ES6, but here’s what the code might look like if it had happened before.
class C {
var val
var number = 500;
const pi = 3.14
// A function
function f(n) { return n+val*2 }
// Getters and setters
function set foo(n) {
val = n;
}
function get foo() {
return val;
}
}
The syntax here is different from the modern one, but the classes already have properties and constants are used. Declaring fields now it is at the stage of “experiment”, so in this regard we have practically made up for lost time.
Note that there is no this keyword here. Instead of treating variables as global by default, ES4 first checks class variables and then checks the top scopes.
ES4 also had the following keywords for defining class members:
static
final
private,
protected
,public
…prototype
– to define a class element by prototype. I don’t know where it can be used, but, apparently, somewhere it can.
Interfaces
ES4 introduces interfaces. Unfortunately, at the present stage this feature is only implemented in Typescript.
interface MyInterface {
function foo();
}
Strong typing
ES4 introduced strong typing.
function add(a: int, b:int): int {
return a + b;
}
It also had the keyword type
which works similarly to type concatenation in Typescript. In Typescript, type concatenation is written like this:
let a : number | string;
And in ES4 like this:
var a: (number, string)
ES4 also had generics:
class Wrapper<T> {
inner: T
}
Like
By default, types in ES4 are exact types, not supersets. Keyword like
allows you to remove this limitation.
function getCell(coords: like { x: int, y: int }) {
}
Most likely, such a possibility was provided in ES4 because it used nominative typing, and not structural typing, as in Typescript.
New data types
ES now has boolean
, object
, array
, number
, BigInt
… ES4 was planning to add a few more data types:
byte
int
unit
double
decimal
Now from this list in ES it is planned to add only decimal
and, probably, when using this type, the code will look like this:
const allowance = 1.50m
ES4 also had an m suffix, which stood for money.
Triple quoted strings
To write a string Hello my name is "Evert"
in ES4, triple quotes can be used:
const hi = """Hello my name is "Evert"""";
Packages
Packages resemble modern modules. They can be imported, but unlike ES6 modules, namespaces are more like the global naming system.
If the class is defined like this:
package com.evertpot {
// Private
internal const foo = 5;
class MyClass {
}
}
then it can be used like this:
const myObj = com.evertpot.MyClass;
or:
import * from com.evertpot;
const myObj = MyClass;
As far as I know, the standard does not establish a relationship between namespaces and the location of downloaded files.
Generic functions
Generic functions should not be confused with parameterized functions. Functions of this kind are a bit like “Overloaded functions” in Typescript, but they are much more powerful.
Example
class Foo {
generic function addItem(x);
function addItem(x: int) {
}
function addItem(x: number) {
}
}
In this example, I am calling the function addItem
in two ways – using types int
and number
… The required method will be selected when executing the code.
E4X
Technically, E4X is an extension to ES4, but it deserves a look.
E4X stands for ECMAScript for XML. It may not sound very interesting, but take a look at the code:
const myClass="welcome";
const name="Evert";
const foo = <div class={myClass}>{"Hello " + name }</div>;
Sound familiar?
This is certainly not JSXbut it is likely that this extension may have underpinned the JSX.
Although the ES4 spec never came out, the E4X extension actually worked in Firefox up until version 10.
Additional features
Syntax
let const
to set constants at the block level. In ES5 and later, the constant scope (const
) is already a block.Generators (
yield
).Tail recursion.
Namespaces for properties, classes, and other elements (much like XML namespaces) that avoid conflicts.
How would the scripts be loaded?
Since ECMAScript 4 is incompatible with previous versions, it would be important to tell the browser to interpret the script as ES4:
<script type="text/javascript;version=4" src="https://habr.com/ru/company/otus/blog/529796/..."></script>
We do about the same with modules:
<script type="module" src="https://habr.com/ru/company/otus/blog/529796/..."></script>
Conclusion
I hope you were interested in reading about what JavaScript could be. We are slowly approaching this standard in new editions of ECMAScript: tools such as Typescript and JSX preprocessors have appeared – but we are still far from the level of ECMAScript that existed in 2007.
Probably, if ES4 saw the light of day, then many of us would not have to use such complex tools as Babel, Webpack and Typescript to build.
Learn more about the “Javascript Developer. Basic” course…
You can sign up for an open lesson here.
Read more:
JavaScript composer
Why is it an anti-pattern?
Compose everywhere: function composition in JavaScript