JavaScript: 2015 Features
ECMAScript 2015 (aka ES6) is a massive revision of the JavaScript language.
Over 10 major features are added to the language, effectively making JavaScript a new language.
Here is a quick overview of new features.
let
let
is like var
, but with a clean block-level scope.
[see let Declaration]
// using let inside curly brackets { var x = 3; { let x = 4; console.log(x); // 4 } console.log(x); // 3 }
const
const
is for declaring constants.
It's similar to let
, except you can't change its value once set.
[see const Declaration]
Arrow Function
(x => { return x + 1; })
is similar to
function (x) { return x + 1; }
but no this
binding, and no argument
object.
[see Arrow Function]
Function Argument Default Values
// function with default arg values function f(x = 4, y = 2) { return x + y; } console.log( f(), ); // 6
[see Function Argument Default Value]
Rest Parameters
// function with any number of parameters // rest parameter. function ff(a, b, ...c) { return c; // c is a array } console.log( ff(1, 2, 3, 4), ); // [3, 4]
[see Function Rest Parameters]
Destructuring Assignment
// destructuring assignment var [x, y, z] = [3, 4, 6]; var { c, b } = { a: 1, b: 2, c: 3 };
[see Destructuring Assignment]
Object Literal Expression, Computed Property Keys
new syntax for object literal to have computed property key by an expression.
obj = {[expression]:value}
// es2015 computed property syntax. use [] around the property key var jj = { ["a" + "b"]: 4 }; console.log(jj.ab === 4);
[see ES2015 Object Literal Expression Extensions]
Object Literal Expression, Method Definition Shorthand
new syntax shorthand for defining methods in object literal expression.
obj = {
method_name() {body},
etc
};
[see ES2015 Object Literal Expression Extensions]
__proto__
Allow the use of property key __proto__
to get/set parent.
[see JavaScript: Object.prototype.__proto__]
Template String
var x = 2; var myText = `number is ${x} and 2+3 is ${2 + 3}.`; console.log( myText, ); // "number is 2 and 2+3 is 5."
before ES2015, you have to do string join. "value is" + x
[see Template String]
[see Tagged Template String]
Spread Operator
The spread operator is 3 dots followed by a array, like this: ...arrayX
. What it does is effectively remove the bracket of the array.
// example of using the spread operator var aa = [3, 4]; var bb = [1, 2, ...aa, 5, 6]; // insert aa in middle, without nesting console.log( bb, ); // [ 1, 2, 3, 4, 5, 6 ]
[see Spread Operator]
for-of Loop
for-of loop lets you properly loop thru an array, or new datatypes such as set and map, or any iterable object. Iterable object is a new concept, created just for for-of loops.
// for-of loop on array for (let x of [3, 4, 5]) { console.log(x); } // prints 3 4 5
[see for-of Loop]
Interface, Iterable, Iterator, Generator
- Interface
- Iterable
- Iterator
- Iterator Prototype
- for-of Loop
- Spread Operator
- Generator
- Generator Function
Set Object
Set object lets you have a data structure of set. That is, a collection of unique values.
// create a set, add value to it var s = new Set(); s.add("6"); s.add("5"); s.add("6"); console.log(s); // Set { '5', '6' }
[see the Set Object Tutorial]
Map Object
Map object lets you have a data structure of key value pairs. Map object is similar to Python's dictionary or Ruby's hash. Similar to JavaScript Object, but now designed to be used as a data structure.
const m = new Map(); // add new item m.set(1, "n1"); m.set(2, "n2"); console.log(m); // Map { 1 => 'n1', 2 => 'n2' }
[see the Map Object Tutorial]
Reflect
The Reflect
object is used as namespace to host a group
of static functions. Reflect methods typically duplicate operator behavior
in function form, or provides a more strict/improved version of existing
methods.
[see Reflect]
Class
class
is a new keyword that lets you conveniently define object and its prototype.
New keywords are:
class
,
constructor
,
static
,
extends
,
super
.
[see Class]
regex
New regex flag "u"
. For unicode. Treat string as sequence of unicode characters.
New regex flag "y"
. For “sticky”. This means next regex match call will start with lastIndex
.
[see RegExp Flags]
New value properties.
RegExp.prototype.flags
RegExp.prototype.sticky
RegExp.prototype.unicode
New function properties.
RegExp.prototype [ Symbol.match ](str)
RegExp.prototype [ Symbol.replace ](str, replace)
RegExp.prototype [ Symbol.search ](str)
RegExp.prototype [ Symbol.split ](str, limit)
[see RegExp.prototype]
New Array Properties
new array constructor properties
new array prototype properties
- Array.prototype.copyWithin
- Array.prototype.fill
- Array.prototype.find
- Array.prototype.findIndex
- Array.prototype.entries
- Array.prototype.keys
- Array.prototype.values
Array.prototype[Symbol.iterator]
(same as Array.prototype.values)Array.prototype [ Symbol.unscopables ]
[see Array.prototype]
New String Properties
static methods
string methods
String.prototype.localeCompare
String.prototype.normalize
String.prototype[Symbol.iterator]
[see String.prototype]
New Object Methods
New Function Properties
function property "name"
New Number Properties
- Number.isFinite
- Number.isInteger
- Number.isNaN
- Number.isSafeInteger
- Number.parseFloat
- Number.parseInt
Number.EPSILON
Number.MIN_SAFE_INTEGER
Number.MAX_SAFE_INTEGER
[see Number Object]
new Math methods
Math [ Symbol.toStringTag ]
Math.sign
Math.fround
Math.trunc
Math.cbrt
Math.expm1
Math.log1p
Math.log10
Math.log2
Math.hypot
Math.sinh
Math.cosh
Math.tanh
Math.asinh
Math.acosh
Math.atanh
Math.clz32
Math.imul
[see Math]
html-like comments
block-level function declaration
// es2015 block-level function declaration function f() { function g(x) { return x + 1; } return g(1); } console.log(f()); // 2
Module, Keyword “import”, “export”
Unicode Escape Syntax
Now you can escape unicode by
\u{4_to_6_hex_digits}
[see Unicode Escape Sequence]
THE FOLLOWING IS WORK IN PROGRESS.
Syntax
- octal and binary literals
- new.target
Promise
- String static methods
- String.prototype methods
- RegExp.prototype properties
Subclassing
- Array is subclassable
- RegExp is subclassable
- Function is subclassable
- Promise is subclassable
- miscellaneous subclassables
Misc
- prototype of bound functions
- Object static methods accept primitives
- own property order
- miscellaneous
Annex b
- Object.prototype.__proto__
- hoisted block-level function declaration
- String.prototype HTML methods
- RegExp.prototype.compile
ArrayBuffer
ECMAScript 2015 §Structured Data#sec-arraybuffer-objects
dataview object
ECMAScript 2015 §Structured Data#sec-dataview-objects
tail call optimisation (recursion)
ECMAScript 2015 §ECMAScript Language: Functions and Classes#sec-tail-position-calls
WeakSet
ECMAScript 2015 §Keyed Collection#sec-weakset-objects
WeakMap
ECMAScript 2015 §Keyed Collection#sec-weakmap-constructor