JSFiddle - React, Tailwind, and code Playground

by Deepak Anand

Babel + JSX

// ES6 Maps

// Basic example
!function(){
 let map = new Map()
 map.set("title", "Understanding ES6")
 map.set("year", 2016)
 console.log(map.get("title"))
 console.log(map.get("year"))
}();

// Use objects as keys
(function(){
 let map = new Map()
 let  key1 = {}
 let  key2 = {}
 map.set(key1, "foo")
 map.set(key2, "bar")
 console.log(map.get(key1))
 console.log(map.get(key2))
}());

// has, delete, clear methods
(function(){
 let map = new Map()
 let key1 = {}
 let key2 = {}
 map.set(key1, "foo")
 map.set(key2, "bar")

 console.log(map.size)
 console.log(map.has(key1))
 console.log(map.get(key2))

 map.delete(key1)
 console.log(map.size)
 console.log(maps.has(key1))

 map.clear()
}());

// Map initialization
(function(){
 let map = new Map([["name", "Deepak"], ["occupation", "engineer"]])
 
 console.log(map.get("name"))
 console.log(map.get("occupation"))
}());

// WeakMap
(function(){
 let map = new WeakMap()
 let element = document.querySelector('.tf')
 console.log(element)
 
 map.set(element, "orig")

 element.parentNode.removeChild(element)
 element = null
 console.log(map.size)
}());