Original subtitles

Now that you're familiar with the fundamentals

of the JavaScript language.

We need to talk about JavaScript or releases

or versions before moving on.

And we briefly talked about this in the intro video,

but now let's go into more depth

because it's really important

to know about how JavaScript releases work

and how we can use them.

It's important for your work as a web developer,

and also because you will see these topics coming up

in the developer community all the time.

And so you wanna be able to understand what's going on.

And the best way to start understanding JavaScript versions

is by looking at the history of JavaScript.

So let's do that.

And let's start at the beginning of the internet itself.

So quickly after the internet was invented,

and two first web browsers were developed.

Developers wanted to start making websites more interactive.

In other words,

they needed a programming language for the browser.

So in 1995, the Netscape Navigator,

which by the time was the dominant browser

hired a guy named Brendan Eich

to create the very first version of JavaScript

in just 10 days, it was called "Mocha".

So not JavaScript yet,

but it already had many of the fundamental features

that modern JavaScript has today.

So that's very impressive that he basically created

this first version in really just 10 days.

Then in 1996, Mocha was renamed tool Livescript,

which was then again,

renamed to JavaScript for one simple reason,

to attract developers from the hottest language at the time,

which was Java.

So the Java in JavaScript

was really just for marketing reasons

because the language itself

has basically nothing to do with Java.

Now, some beginners think that is the case,

but actually no, JavaScript and Java

are two completely different languages.

Also in 1996, Microsoft launched the internet Explorer,

which basically copied JavaScript from Netscape,

but they call the JScript for legal reasons because, well,

you actually cannot just go around

and copy other people's programming languages.

Now, what this means, is that we now had two very similar

but competing languages,

which of course is never a good idea in the long run.

And so with the internet growing like crazy

around this time,

people realized they needed to standardize JavaScript.

So the language was submitted

to an independent standard organization called ECMA,

which in 1997 released ECMAScript one or ES1.

This was the very first official standards

for the JavaScript language.

And with this, every browser could now implement

the same standard "JavaScript."

And the real world we usually use the term ECMAScript

to refer to the standard, while JavaScript is used

when we talk about the language in practice,

as it's implemented in browsers.

Now fast forward to 2009,

after a lot of complications and disagreements

about where the language should be headed,

ES5 was released with a lot of great new features.

And then finally, another six years later,

the much awaited new version ES6 was launched in June, 2015.

And this was the single biggest update to the language ever.

So it contained a ton of new exciting features,

which we will explore throughout this entire course.

This was, and still is a really big deal

for JavaScript and for the whole web developer community.

Now you will also see ES6 being called ES2015,

which has actually the official name,

but most people just call it ES6.

And so that's what I'm gonna do here as well.

And actually the reason for ES6

being called ES2015 officially is that in 2015,

ECMAScript changed to an annual release cycle.

So right now there's gonna be a new release

every single year.

The reason for that is that they prefer to just

add a small number of new features per year,

instead of shipping a huge new version

every couple of years, like it happened with ES6.

And so this way, it's gonna be much easier

for everyone to keep up to date.

And so according to this new annual release cycle,

in 2016 ES2016or ES7 was released ES2017 and 2017.

And like this, it will continue until the end of time

or something like that.

Now there is one particularity about JavaScript releases,

which is pretty unique for any programming language

and that's backwards compatibility all the way to ES1.

So what does that actually mean?

Well, basically it means that if you were to take

some JavaScript code written back in 1997

and put it in a modern browser

with a modern JavaScript engine today,

it would still work just the same.

So again, the JavaScript engine that's in our browser today

is able to understand old code written 25 years ago,

without having to rely on version numbers

or anything like that. It just works.

And it works this way because of the fundamental principle

that's baked into the JavaScript language

and its development, which is to not break the web.

This means that there is almost never anything removed

from the language, but only added in new versions.

And actually we cannot really call them new versions even,

because they do not contain breaking changes

like when other languages moved to a new version.

Instead new versions are always just incremental updates,

which add new stuff.

And so I like to call them releases and not versions.

The ECMAScript committee who works on updating the language,

does all this.

So that old websites basically keep working forever.

Just imagine they removed some important feature

that made a website from 2008, work just fine.

If you then want it to visit that page, it will be broken.

And that's why we fortunately

have to don't break the web principle.

Now, of course,

this comes with problems because there are tons of old bugs

and weird things and the language.

Remember that Brendan Eich made the very first version

in just 10 days and no one back then could even imagine

what JavaScript would be used for one day.

The initial goal of JavaScript was just to add

some simple dynamics to pages,

not to write whole web applications

in a browser like we do today.

But anyway, these bugs and weird quirks in the language

have been giving the language a bad reputation

among many programmers who can really take JavaScript

serious because of this.

But here's the thing, we can actually go around

many of this weird stuff by simply learning

the modern JavaScript that matters today

and just ignore most of the old weird stuff.

And so that's exactly what we're gonna do in this course.

So next time your friends start hating on JavaScript

and believe me, this actually happens.

Then just tell them about the amazing things

that you can build with it. Okay.

But now, there is one more thing

that we need to talk about here,

and that is forwards compatibility.

So what do you think would happen

if we took this totally made up code

from the year 2089 and try to run it in today's browsers?

Well, you're probably right.

It would not work at all.

There would be errors left and right.

And nothing would work.

That's why we say that JavaScript

is not forwards compatible,

basically because current browsers

do not understand code from the future.

And this actually brings us to our next topic,

which is how can we use modern JavaScript today?

Because browsers that users are using might be old

and there's no forwards compatibility. Right?

So to answer the question,

how we can use modern JavaScript today,

we need to consider two distinct scenarios,

development and production.

So the development phase is simply when you're building

the site or application on your computer.

To ensure you can use the latest JavaScript features

in this face. All you have to do

is to use the most Up ToDate version

of the Google Chrome browser.

This will then ensure

that all the features I show you in his course

will work for you as well.

The second scenario is production,

which is when your web application is finished.

You deploy it on the internet

and it's then running in your users' browsers.

And this is where problems might appear,

because this is the part that we actually can't control.

We cannot control which browser the user uses.

And we also can't assume that all our users

always use the latest browsers, right.

Now, the solution to this problem

is to basically convert these modern JavaScript versions

back to ES5 using a process called transpiling

and also polyfilling.

We will use a tool called Babel later in the course

to transpile or code.

But for now, during the course, we won't need that.

Again, because you're using the most Up ToDate browser

during development, transpiling back to ES5

is only necessary after your app is developed

and you want to ship it to your users.

All right. So now let's take a look

at how different JavaScript releases can be used today.

So first off ES5 is of course fully supported

in all browsers today, all the way down

to internet Explorer nine from 2011.

So we can assume that ES5 is safe to be used at this point,

which is the reason why

we use it as a target for transpiling.

Now about the newer releases,

ES6, ES7 and all the way to ES2020, as of mid-2020,

they are actually quite well supported already

in all modern browsers.

And we usually call all the current versions together,

ES6 plus. So right now that's from ES6 to ES2020,

and basically all together, they are the modern JavaScript.

Now it's in this modern JavaScript.

So in this ES6 plus where transpiling comes in,

as I mentioned earlier.

Again, because it's not safe to assume

that all our users are using these modern browsers

and we don't want to break or app for them, right?

And by the way,

if you want to stay up to date with what features

are currently supported in which browser

you can check out the ES6 compatibility table.

It's really interesting.

The link is actually on my resources page on jonas.io.

Next, there are also the future releases

of the language like ES2021, ES2022 and so on.

And these future releases together

are many times called ESNext.

Now, why is this even relevant?

Well, because most browsers actually start implementing

new features even before they enter

the official ECMAScript specification.

That's possible because as new features are proposed,

they have to go through four stages,

starting with stage one,

where they are first admitted all the way to stage four,

at which point they enter the language officially.

But when a feature is at stage three,

browsers can be pretty sure

it will eventually pass to stage four.

And so they're gonna start implementing that feature

while still in stage three.

And there is a lot more to be said about this.

And actually I find this really fascinating,

but I'm gonna stop here.

You can find tons of information about us online.

If you want to learn more.

And a great place to start is actually once more,

this compatibility table, that's up here on the slide.

But anyway, as these new features start coming out,

I will simply add new videos about them to the course

in order to keep it updated with the annual release cycle.

This is now way easier to do,

because there will be no drastic changes

to the language like ES6 was.

Okay. And now to finish,

let's quickly talk about how versions or releases

are taught in this course.

So, as I said earlier,

I will teach you a modern JavaScript,

right from the beginning of the course.

Now I used to teach this course starting with ES5

and then moving to ES6 in the middle of the course.

But now after a couple of years,

it was time to fully move to modern JavaScript.

However, it's also super important

to learn how some things used to be done

before we had this fancy modern JavaScript.

For example, in this section,

I already showed you the modern const and let

for variable declarations,

but also how we used to use Vue before.

And there will be many more examples like this,

but why butter with ES5 at all? You might ask?

Well, here is why,

first, you will better understand how some features

in JavaScript actually work behind the scenes.

For example, ES6 classes,

which had all the implementation details

of object oriented programming in JavaScript.

Also many tutorials and example code

that you will find online are still written in ES5 today.

Plus, as a developer, in many jobs,

you will actually have to work on older code bases.

And it's totally possible that that code base

might still contain a lot of ES5 code.

Okay. So hope that made sense.

And that's it for this lecture and for the section.

So see you in the next one.