JS: ECMAScript 2015 (ES6)

By Xah Lee. Date: . Last updated: .

Over 30 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.

Const

const is similar to let, except you can't change its value once set.

Arrow function

you can write function like this

((x, y) => { return x + y; });

arrow function doesn't have this-binding , and no arguments Object, no Function Name Hoisting .

Function argument default values

function parameter can specify a default value.

// function with default parameter values
function f(x = 4, y = 2) {
 return [x, y];
}
console.log(f());
// [ 4, 2 ]

Rest parameters

function can now specify to take any number of parameters, by syntax ...args

// 2 parameters plus a rest param
function ff(a, b, ...c) {
 return c;
}
console.log(ff(1, 2, 3, 4));
// [ 3, 4 ]

Assignment pattern

pattern matching for assignment

// assignment pattern
let [x, y, z] = [3, 4, 6];

Object literal expression, extensions

Computed property keys

new syntax for object literal to have computed property key by an expression.

{ [expr]: value }

// Object Literal Expression, Computed Property Keys
const expr = "cat";
const xobj = { [expr]: 4 };
console.log(xobj);
// { cat: 4 }

Method definition shorthand

new syntax shorthand for defining methods in object literal expression.

{ …, method_name (param) {function_body}, … }

// object literal expression method definition shorthand
const jj = {
 xmethod(x) {
  console.log("xmethod called with arg:", x);
 },
 gg: 4,
};
console.log(jj.xmethod(2));
// xmethod called with arg: 2

Key without value shorthand

{ var_name }

means

{ var_name: var_name }

if var_name is not defined, it's an error.

// key without value shorthand for object literal expression
const dog = 3;
const cat = 4;
const jj = { dog, cat };
console.log(jj);
// { dog: 3, cat: 4 }

Template string

allows you to embed variable or expression in a string, or have literal newline char.

console.log(`2 + 3 is:
${2 + 3}`);
// 2 + 3 is:
// 5

// before, you have to use + to eval expression, and \n for newline.
console.log( "2 + 3 is:\n" + (2 + 3) );
// 2 + 3 is:
// 5

Interface, iterable, iterator, generator

Iterable is new. It is a like a delayed array, items are generated at time it is used.

array is now an iterable.

for-of loop and spread operator works with iterables.

iterator is created to support iterable.

interface and generators are created to support iterable.

Generator Function is created to support creating iterable.

Spread operator

The spread operator is 3 dots:

...xArray

What it does is insert the array items (into a array, or as function args). The operand can be any iterable.

For-of loop

loop thru an iterable.

Set object

Set object is data structure of set. That is, a collection of unique values.

Map object

Map object is a data structure of dictionary. Similar to Data Object, but now designed to be used as a data structure, have length, keys can be any type (not just string), etc.

const xx = new Map();

// add new item
xx.set(1, "n1");
xx.set(2, "n2");

console.log(xx);
// Map { 1 => "n1", 2 => "n2" }

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 or better version of existing methods.

Class

class is a new keyword that lets you conveniently define object and its prototype.

New keywords are: class, constructor, static, extends, super.

Subclassing

Regex

Regex flag u (unicode)

New regex flag u. For unicode. Treat string as sequence of unicode characters, and more.

new property RegExp.prototype.unicode. Value is true if flag u is on.

Regex flag y (sticky)

New regex flag y. For “sticky”.

when on:

new property RegExp.prototype.sticky. Value is true if flag y is on.

New properties for RegExp.prototype

RegExp.prototype.flags. Value is a string of all the flags that is on.

methods:

These are the hidden methods that many of the regex methods actually call. These are created so that it can be customized by overriding their values.

New array properties

new array constructor properties

new array prototype properties

New string properties

static methods

string methods

New object methods

New function properties

New number properties

New math methods

Html-like comments

formally recognize html comment.

Block-level function declaration

now allow function declaration inside a block.

// 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}

Octal and binary literals

// octal notation
console.assert(0o10 === 8);

// binary
console.assert(0b10 === 2);

New.target

new.target is a special meta-property in JavaScript that tells you whether a function (or class constructor) was invoked using the new keyword.

function ff() {
 if (new.target) console.log("called with new.\n", "new.target value is: ", new.target);
 else console.log("called as function.\n", "new.target value is:", new.target);
}

new ff();
// called with new.
// new.target value is:  [Function: ff]

ff();
// called as function.
// new.target value is: undefined

Promise

__proto__

document the property key __proto__ to get/set parent. It was from Firefox.

Arraybuffer, dataview, typed array

Weakmap, weakset

Proxy

it allows you to create a new object, such that you can intercept any operation with the object.

order of own property keys

now Object.getOwnPropertyNames return properties in a specific order.

  1. Integer indices in ascending numeric order (for array keys).
  2. Other string keys in creation order.
  3. Symbol keys in creation order

reference:

before, it does not specify order

Tail call optimisation (recursion)

Function.prototype.bind (prototype of bound functions)

In ES5, a function created with Function.prototype.bind() always had Function.prototype as its parent object.

In ES6, the parent is the same as target function's parent.

function f() {}
Object.setPrototypeOf(f, Array.prototype);
const bound = Function.prototype.bind.call(f, null);
console.log(Object.getPrototypeOf(bound) === Array.prototype);
// true in ES2016

19.2.3.2: In ECMAScript 2015, the [[Prototype]] internal slot of a bound function is set to the [[GetPrototypeOf]] value of its target function. In the previous edition, [[Prototype]] was always set to %FunctionPrototype%.

Misc

Annex b

  • hoisted block-level function declaration
  • String.prototype HTML methods
  • RegExp.prototype.compile
work in progress

in js ES 2015, what does these mean Annex b hoisted block-level function declaration String.prototype HTML methods RegExp.prototype.compile

(ai answer)

Annex B in the ES2015 (ECMAScript 2015) spec is titled “Additional ECMAScript Features for Web Browsers.” These features are normative for web browsers (required for compatibility with existing web pages) but optional for other hosts. They are legacy behaviors with undesirable characteristics; the spec advises against using them in new code.

1. Hoisted block-level function declaration

In pure ES2015, a function declaration inside a block is block-scoped (hoisted only within the block).

Annex B adds web-compatibility semantics (mainly for non-strict/sloppy mode):

  • A var-like binding is also created and hoisted to the enclosing function scope (initially undefined).
  • When the block executes and the function declaration is evaluated, the function object is assigned to that outer binding.
  • A block-scoped binding still exists as well.

Result: the function can sometimes be visible outside its block (like old pre-ES6 browser behavior), but only under specific conditions defined in the annex. Strict mode generally sticks to pure block-scoping.

2. String.prototype HTML methods

Legacy methods that wrap a string in HTML tags, e.g.:

  • "text".bold() → "<b>text</b>"
  • "text".italics() → "<i>text</i>"
  • "text".link("url") → "<a href=\"url\">text</a>"
  • "text".anchor("name") → "<a name=\"name\">text</a>"
  • Also: big, blink, fixed, fontcolor, fontsize, small, strike, sub, sup

They exist only for old web compatibility and are deprecated. Prefer modern alternatives (template literals, DOM APIs, etc.).

3. RegExp.prototype.compile

Deprecated method that recompiles an existing RegExp object with a new pattern and flags:

const re = new RegExp("foo", "gi");
re.compile("newfoo", "g");  // mutates re in place

It duplicates the RegExp constructor but mutates the existing object (making source/flags mutable after creation). Exists solely for backwards compatibility; create a new RegExp instead.

Summary: All three are legacy web-browser compatibility features in Annex B. Avoid them in new code.

in JavaScript ECMAScript 2015, there are these. what does it mean. * Object static methods accept primitives * miscellaneous

(ai answer) 2026-11-03

Object static methods accept primitives

Several Object.* methods used to throw a TypeError if you passed a primitive (null, undefined, number, string, boolean, etc.).

In ES6 they coerce the argument with ToObject (or treat it specially):

console.log(Object.keys("abc"));
// ["0", "1", "2"]

console.log(Object.getOwnPropertyNames(42));
// []

console.assert((Object.freeze(true)) === true);
// no longer throws

console.assert(Object.getPrototypeOf("hi") === String.prototype);

Affected methods include Object.keys, getOwnPropertyNames, getOwnPropertyDescriptor, getPrototypeOf, isExtensible, isFrozen, isSealed, preventExtensions, seal, and freeze.

Miscellaneous

This is usually a catch-all category in compat tables covering the smaller spec changes above, plus things like:

  • Accessor methods (get/set) created in object literals are no longer constructors (they lack a .prototype and can’t be called with new)
  • Other minor internal-slot / prototype adjustments (e.g. NativeError constructors)

Reference