ES6/ES2015

 

Bringing JavaScript into this decade

What is ES6/2016?

  • ECMAScript 6 which was officially renamed ECMAScript 2015 (the next version is ES2016)
  • The newest version of ECMAScript with new toys (yay!)

Ecma International is an industry association founded in 1961, dedicated to the standardization of information and communication systems.

What the actual F is ECMAScript?

ECMAScript is the language, JavaScript (and others) are dialects.

Sorta like how English is the language, but there are eleventybillion dialects (how many different ways can you say the plural you? Y'all, Youins, You's, You's Guys, etc.)

So, what's changed?

ES5 - (Old Busted)

ES6 - (New Hotness)

var foo = "something";

Say goodbye to var, let const be your friends

const foo = "something";
let bar;
bar = "something else";

Two new keywords:

  • Use const for constants
  • Use let for variables (meet the new var, same as the old var)

 

Prefer const unless you have a good reason to use let.

ES5 - (Old Busted)

ES6 - (New Hotness)

function blah() {
    return "blah";
}

Who needs function keywords?

blah() {
    return blah;
}
blahs.forEach(function(blah) {
    return "I can't even " + blah;
});
blahs.forEach(blah => {
    return "I can't even " + blah;
});
blahs.forEach(blah => 
    "I can't even " + blah;
)

I call it the Isaac Newton of functions...

ES5 - (Old Busted)

ES6 - (New Hotness)

Arrow syntax => Take that, Cupid!

blahs.forEach(function(blah) {
    return "I can't even " + blah;
});
blahs.forEach(blah => {
    return "I can't even " + blah;
});
blahs.forEach(blah => 
    "I can't even " + blah;
)

Unlike function, arrows share this with their surrounding code (which means no more of that stupid .bind() bs.

Well, mostly...)

Copy of Copy of ES2016

By Jason Clark

Made with Slides.com

Copy of Copy of ES2016

Bringing JavaScript into the Teens

  • 668

More from Jason Clark