JavaScript® (often shortened to JS) is a lightweight, interpreted, object-oriented language with first-class functions, most known as the scripting language for Web pages, but used in many non-browser environments as well such as node.js or Apache CouchDB. It is a prototype-based, multi-paradigm scripting language that is dynamic, and supports object-oriented, imperative, and functional programming styles.

javascript

Staying up to date with JavaScript’s changes saves you from being stumped by syntax.

In this course, you’ll learn about all latest language features published with ES2019 and see how they solve problems, using the example of a Nuxt.js application. 

From optional catch binding to creating an object from a list of key-value pairs, you’ll learn the benefits of these new features and understand when, why, and how to use them in your legacy projects and upcoming work. 

In this course, we'll learn how to use the new features available in the latest version of javascript, commonly referred to as ES2019. ES2019 is available in the latest version of Chrome, Firefox, Safari, and Node, and are available via compilation with Babel or Typescript.

The goal of this course is to introduce you to opportunities to use ES2019 in real situations from within an existing student grade tracking Nuxt.js application, and explore real world use cases and opportunities to use ES2019's new features.

We'll learn together as we discover how to use Object.fromEntries, Symbol.prototype.description, Array.prototype.flatMap, Array.prototype.flat, String.prototype.trimStart, String.prototype.trimEnd, Optional Catch binding, and Array Stable Sorting.

By the end of this course, you’ll know how and when to use ES2019 to accomplish more with less code, and my hope is that you'll be inspired to stay up to date with the latest changes to the core JS language as they come out.

Course Overview: JavaScript ES2019 in Practice

javascript-es2019-in-practice-resources-package

Download All

javascript-es2019-in-practice-resources-transcript

Enhanced Transcript

javascript-es2019-in-practice-resources-sketchnote

Sketch Notes

javascript-es2019-in-practice-resources-cheatsheet

Cheat sheets

ES2019 introduces the optional catch binding syntax. This allows us to catch errors without assigning the error to a variable. In this lesson, we'll investigate cases where it's appropriate to catch errors without propagating them further. Then we'll introduce an optional catch binding to make our intent clear.

Handle Exceptions with ES2019 Optional Catch Bindings in JavaScript

Before ES2019, array sorting in Javascript was not guaranteed to be stable. In this lesson, we'll learn what stable sorting is by emulating stable sorting in an older version of Node. Then, we'll learn how and when stable sorting matters. Finally, we'll use nvm to switch between an older version of Node and a newer version and compare how each version deals with sorting.

You can find installation instructions for nvm [here](https://github.com/creationix/nvm). Stable sorting was adding to v8 v7.0 (Chrome 70 and Node 11), as noted [in this blog post](https://v8.dev/blog/array-sort)

Stable Sort an Array with ES2019 JavaScript

ES2019 introduces the Array.prototype.flat method. In this lesson, we'll see how to flatten an array using Array.prototype.reduce and Array.prototype.concat, and then refactor the code to do the same thing using the .flat method.

Flatten an Array with ES2019 flat in JavaScript

ES2019 introduces the String.prototype.trimEnd and String.prototype.trimStart methods. In this lesson, we'll investigate a common use case for .trimEnd. We'll figure out how to work around the lack of .trimEnd in older versions of JS, and then refactor the code to use .trimEnd to achieve an even better result with less complexity.

Trim the End of a String in JavaScript with ES2019 trimEnd

ES2019 introduces the Array.prototype.flatMap method. In this lesson, we'll investigate a common use case for mapping and flattening a multidimensional array. We'll then see how to do this using Array.prototype.reduce, and then refactor the code to do the same thing using the ES2019 .flatMap method.

Map Elements of an Array with ES2019 flatMap 

ES2019 introduces the Array.prototype.flatMap method. In this lesson, we'll investigate a common use case for mapping and filtering an array in a single iteration. We'll then see how to do this using Array.prototype.reduce, and then refactor the code to do the same thing using the ES2019 .flatMap method.

Use JavaScript ES2019 flatMap to Map and Filter an Array

ES2019 introduces the Symbol.prototype.description property. In this lesson, we'll learn why this property is useful and unlocks Symbols as appropriate to use to represent strings constants in JS. We'll investigate a use case for string constants and see why using Symbols prior to ES2019 was not appropriate. Then we'll see how using .description fixes that. Lastly, we'll learn why using Symbols may be better than strings for constants in certain use cases by examining what it means to be "collision free".

Represent Collision-free String Constants as Symbols in JavaScript

ES2019 introduces the Object.fromEntries method. In this lesson, we'll see how to convert Maps and Sets into Objects and why you'd want to translate between those data structures. First we'll see how this was done prior to ES2019, and then we'll refactor the code to do the same thing using Object.fromEntries. Seeing as ES2019 was only introduced to Node in Node 12, we'll also learn how to do feature detection for Object.fromEntries.

JavaScript ES2019 in Practice

Mike Sherov

What you'll learn:

Prerequisites:

Course Content