ES6 Data Structures

This is the part of a series of blogs on the new features on the upcoming ECMAScript 6 (ES6) specification which JavaScript implements.

In this blog we focus on the new data structures introduced in ES6, specifically keyed collections.

 Keyed Collections

Keyed collections are object data structures that represent collections of data which use keys. Keyed collections contain elements which can be iterated in the order of insertion. ES6 includes these new data structures to handle your complex javascript applications without having to develop the building blocks yourself to save time, standardize, as well as provide a more optimized garbage collection strategy.

 Set

var mySet = new Set();
mySet.add("cat");
mySet.add(24);
mySet.add("bunny");
for (let item of mySet) console.log(item); 
// "cat" 
// 24
// "bunny"

 Map

 Differences between Object and Map

var myMap = new Map();
myMap.set("cat", "bengal");
myMap.set(24, 12);
myMap.set(NaN, "not a number");
myMap.get(NaN); // "not a number"
for (var [key, value] of myMap) console.log(key + " - " + value);
// "cat - bengal"
// "24 - 12"
// "NaN - not a number"

 WeakSet

 Differences between Set and WeakSet

var myWeakSet = new WeakSet();
var foo = {};
var bar = {};

myWeakSet.add(foo);
myWeakSet.has(bar); // false
myWeakSet.has(foo); // true
myWeakSet.delete(foo);
myWeakSet.add({ kobe: 24 }); // But because the added object has no other references, it will not be held in the set

 WeakMap

var myWeakMap = new WeakMap();
var obj1 = {};
var obj2 = function(){};
myWeakMap.set(obj1, "cat");
myWeakMap.set(obj2, 24);
myWeakMap.has(obj1); // true
myWeakMap.get(obj2); // 24
myWeakMap.delete(obj1);
 
267
Kudos
 
267
Kudos

Now read this

Using Angular $compile to Escape Watcher Hell

This is a blog on how to handle repeating directive elements without using the ng-repeat directive when using AngularJS. We’ll keep this blog high level and assume the reader knows Angular development. Sample: <div ng-repeat='spell in... Continue →