diff --git a/resources/public/synonym.html b/resources/public/synonym.html index 6a3214e..21d40f0 100644 --- a/resources/public/synonym.html +++ b/resources/public/synonym.html @@ -59,13 +59,21 @@

Code modularity

Define a library

-
// No native implementation
+
// No native implementation pre-ES6.
+  // In ES6, all public members must be
+  // explicitly exported. Also, the file is
+  // the library - there is no namespaces.
+  export function foo () {
+    ...
+  }
-
(ns my.library)
+
;; ClojureScript has support for
+;; libraries, and they are in namespaces.
+(ns my.library)
@@ -74,7 +82,9 @@

Define a library

Use a library

-
// No native implementation
+
// No native implementation pre-ES6.
+// In ES6, there is the following syntax:
+import other, * as namespace from "other-library.js";
@@ -145,7 +155,17 @@

Hoisting

} printName(); -// Hello, undefined +// Hello, undefined + +// Note: ES6 `let` and `const` do not hoist. + +function printName() { + console.log('Hello, ' + name); + var name = 'Bob'; +} + +printName(); +// ReferenceError: name is not defined @@ -167,8 +187,8 @@

Destructuring bind

-// No native implementation, must pull
-// aparts objects and arrays manually
+// No native implementation pre-ES6, must
+// pull aparts objects and arrays manually
 
 var o = {first: "Bob",
          middle: "J",
@@ -183,7 +203,18 @@ 

Destructuring bind

var red = color[0]; var green = color[1]; var alpha = color[3]; -...
+... + +// In ES6: +var o = {first: "Bob", + middle: "J", + last: "Smith"}; + +var {first, middle, last} = o; + +var color = [255, 255, 100, 0.5]; +var [red, green, , alpha] = color; +
@@ -527,7 +558,13 @@

Arbitrary Keys

var m = { "foo": 1, "bar": 2 -}; +}; + +// Note: in ES6, there is a mutable Map +// class that supports arbitrary keys, but +// there is no syntactic support. +let m = new Map(); +m.add([1, 2], 3); @@ -605,7 +642,7 @@

Cloning

 var a = [...];
-foo(a.slice(0));
+foo(a.slice());
 
 // if foo might mutate a, must clone,
 // however this is only a shallow copy
@@ -641,7 +678,9 @@ 

Equality

// == tests identity // must implement your own deep -// equality test for all types
+// equality test for all types +// https://npm.im/deep-equal is +// frequently used for this.
@@ -899,14 +938,18 @@

Variable arguments

-// No native implementation. Manipulate arguments
+// No native implementation pre-ES6. Manipulate arguments
 // object explicitly. Performance implications.
 
 function foo() {
   var args = arguments;
   ...
 }
-
+ +// In ES6, this is the syntax: +function foo(...args) { + ... +}
@@ -944,7 +987,12 @@

Named Parameters & Defaults

baz = o.baz || "default2"; ... } - + +// Note: in ES6, there is object destructuring +// in arguments to assist with this. +function foo({bar = "default1", baz = "default2"} = {}) { + ... +} @@ -971,7 +1019,7 @@

Uniform Iteration For All Types

-// JavaScript does not have uniform iteration
+// JavaScript pre-ES6 does not have uniform iteration
 // over native types.
 
 var colors = ['red', 'orange', 'green'];
@@ -986,7 +1034,19 @@ 

Uniform Iteration For All Types

console.log('key', key); console.log('value', data[key]); } -
+ +// In ES6, there is the following syntax +// for iterables only (arrays, etc.): +let colors = ['red', 'orange', 'green'] + +for (let color of colors) { + console.log(color); +} + +for (let key of Object.keys(data)) { + console.log('key', key); + console.log('value', data[key]); +}
@@ -1149,7 +1209,17 @@

Define

Person.prototype.greet = function() { return "Hello, " + this.name; } - + +// In ES6, there is a class syntax: +class Person { + constructor(name) { + this.name = name; + } + + greet() { + return `Hello, ${this.name}`; + } +}