clojurescript vs javascript (es5 & es6)files.meetup.com/10978482/cljs vs es6.pdfall existing...

CLOJURESCRIPT VS JAVASCRIPT (ES5 & ES6)OLIVER MOONEY GETBULB LIMITED, HTTP://WWW.GETBULB.COM

Only Javascript’s Good Parts

Douglas Crockford’s elegant subset:

Object literals, first class functions & closures, prototyping & dynamic object model…

None of the bad:

poor scope rules, global variables, implicit semi-colon insertion, 6 “falsy” values, odd equality rules…

ES6Implements features found in languages that ‘transpile’ to Javascript, like Coffeescript

Codifies good practice from Javascript

Usable now in production via a transpiler:

http://babeljs.io requires no additional runtime and offers complete language coverage. Source of ES6 examples here!

Only transpiles to ES5, so ie8 only supports a subset

All existing Javascript code is valid ES6 code, even the duff stuff

ClojurescriptFull-fat clojure experience in javascript (ES3/5) execution environments

Also transpiler driven, in two stages:

Transforms clojurescript to javascript

Then optimises that javascript via the Google Closure compiler

Dead-code elimination, minification, …

COMPARISONS

Philosophical differencesClojurescript controls mutable state, and uses values as the default unit of calculation

Javascript embraces unconstrained state mutation via object-oriented conventions

Not worlds apart: both use first-class functions

Mindset using both is quite different; but clojurescript’s “mental model” when programming is much simpler to reason about

Function literals

ES5 (none):

ES6:

CLJS:

Classical OO Models

ES6: classical OO via syntactic sugar, still uses prototype model

CLJS: deftype, defrecord & friends

Object literalsES5: come with a bunch of hidden prototypes & other properties. JSON.

ES6: can set prototype, foo: foo shorthand, super calls. JSON++

CLJS: no direct analogue since Clojurescript (like Clojure) is not specifically object-oriented

But does offer good OO-interaction

Extensible Data Notation analogue to JSON for serialising types

Template stringsES5: none

ES6: multiline, interpolated strings

CLJS: All strings are multiline, string interpolation available via strint library

Destructuring: ES6

Binding using pattern-matching

Fail-soft

Allows defaults

Destructuring: CLJSDestructure anywhere binding expected

Allows defaults

Much richer: bind entire value, match value patterns like maps, vectors…

Argument handling

ES6: Rest & Spread

CLJS: Rest, pattern matching, dispatch on arity

Block scopingES5: variables hoisted to top of function; undeclared vars made global (terrorists win)

ES6: use let instead of var for proper block scoping, const for single-assignment let

CLJS: proper lexical scope

ModulesES5: No default implementation; external tools like AMD, CommonJS widely used. Competing ecosystems

ES6: Codifies ES5 behaviour

CLJS: namespace macro; ES6 and more

Also see

CLJS for, doseq & core.async vs ES6 iterators, generators & promises

ES6 Maps, Sets, WeakMaps, WeakSets, Proxies (!) & Symbols

CLJS: Maps, Sets, Vectors, Keywords

Macros: What ES6/7/… will never offer

Macros. Fundamental brake on rich library creation. See core.logic (Prolog logic programming). Compile-time code manipulation in Clojure.

Starting points for more

CLJS cheatsheet:http://cljs.info/cheatsheet/

CLJS vs Javascript (ES5) detailed comparison:https://kanaka.github.io/clojurescript/web/synonym.html

Babel’s ES6 tour (thanks for the code samples):https://babeljs.io/docs/learn-es6/

THANK YOUOLIVER MOONEY @OLIVERMOONEY OLIVER.MOONEY@GETBULB.COM