ES6 Features used in the source

Steve Heffernan edited this page Apr 14, 2015 · 6 revisions

In the source code for Video.js we use ES6 -- new syntax features of the JavaScript language. When building the final video.js file these features get converted (transpiled) to JavaScript that is compatible with older browsers. If you're contributing to video.js, here's a guide of the features we use.

Modules

Language-level support for modules for component definition. Codifies patterns from popular JavaScript module loaders (AMD, CommonJS). Runtime behaviour defined by a host-defined default loader. Implicitly async model – no code executes until requested modules are available and processed. (via babeljs.io)

let and const

Block-scoped binding constructs. let is the new var. const is single-assignment. Static restrictions prevent use before assignment (babeljs.io)

Destructuring

Destructuring allows binding using pattern matching, with support for matching arrays and objects. Destructuring is fail-soft, similar to standard object lookup foo["bar"], producing undefined values when not found. (via babeljs.io)

// Before
var foo = foobar['foo'];
var bar = foobar['bar'];
var baz = foobar['baz'];

// After
var { foo, bar, baz } = foobar;

ES6 Classes

We're now using ES6 Classes to structure the codebase instead of a custom class implementation.