ES6-Shim

And you can too!

(Because IE11 and Safari 9 Can't)

ES6

ES6 Shim (Safari 6/IE11)

ES6 Shim (Safari 6/IE11)

Map + Set

// Sets
var s = new Set();
s.add("hello").add("goodbye").add("hello");
s.size === 2;
s.has("hello") === true;

// Maps
var m = new Map();
m.set("hello", 42);
m.set(s, 34); // <- use an object as a key!
m.get(s) == 34;
// Sets 
var values = [1, 1, 1, 1, 2], set = {};
values.forEach(addToSet(set));
//...
var testValue = 1;
if (values[testValue]) {
    console.log('found ' + testValue);
}

function addToSet(set) {
    return function(value) {
        set[value] = true;
    };
}
// Sets
var s = new Set([1, 1, 1, 1, 2]);
//...
var testValue = 1;
if (s.has(testValue)) {
     console.log('found ' + testValue);
}

Inheritable!

Can create custom subclasses with extra behavior. EG: SetSequence type adds .map(), .forEach() etc

Broken Promises

($.Deferred() considered harmful)

function timeout(duration = 0) {
    return new Promise((resolve, reject) => {
        setTimeout(resolve, duration);
    })
}

var p = timeout(1000).then(() => {
    return timeout(2000);
}).then(() => {
    throw new Error("hmm");
}).catch(err => {
    return Promise.all([timeout(100), timeout(200)]);
})
Promise.race(iterable)
Promise.reject(reason)
Promise.resolve(value)

Math

  • .clz32(x) Counts the leading zero bits in the 32 bit integer x.
  • .trunc()ate
  • .imul(a, b) C-like 32-bit multiplication of (a * b)
  • .sign(n) (-1,+1, -0, +0)
  • Trigonometric functions:
    •  sinh tanh acosh asinh atanh hypot 
  • Log functions:
    • log10 log1p log2 expm1
  • .cbrt(x) Cube root

Number

  • .isInteger(number)
  • .isSafeInteger(number)
  • .MIN_SAFE_INTEGER
  • .MAX_SAFE_INTEGER
Number.isNaN('???')
false
isNaN('???')
true
  • .isFinite(number)
  • .isNaN(number)
  • .parseFloat(string)
  • .parseInt(string, radix)

Array

  • Array.from(arrayLike|Iterable)
  • [x].find(callback)
    • No more .filter(fn)[0] !
  • [x].includes(instance) need es7-shim!
    • No more .indexOf(instance) !== -1 !
  • Array.of(a, b, c) -> [a, b, c] (not that interesting)

ES6 Support (Safari 6/IE11)

[        ]

Object

Object.assign(target, ...sources)
var obj = { a: 1 };
var copy = angular.extend({}, obj);
console.log(copy); // { a: 1 }

Copies enumerable and own properties from a source object to a target object. It uses [[Get]] on the source and [[Set]] on the target, so it will invoke getters and setters.

var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

//Supports multiple source objects
var a = { a: 1 }, b = { b: 1 }, c = { c: 1};
var merged = Object.assign({}, a, b, c);

Object.is(value1, value2)

Almost the same as === with the following exceptions:

  • treats the number values -0 and +0 as not equal
  • treats Number.NaN as equal to NaN.

Highlights

  • Map and Set. (and subclasses like SetSequence)
  • [].from(), [].find()
  • Promise me you will never use $.Deferred() again!
  • Object.assign() (vs $.extend or angular.extend)

ES6-Shim

By Jamie Pate

ES6-Shim

  • 1,217