ClojureScriptJavaScript
Kevin LynaghKeming Labs
1.
Clojure
SimplerJavaScript
than
is
2.JavaScript
MOARFun!
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Safe!
2.JavaScript
MOAR
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Extendable!
2.JavaScript
MOAR
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
3..jsThe trip from
.cljsAdventure!
to
is an
(you might get hurt)
0.story
Imperial
Metric::
JavaScript
Clojure::
JavaScript
Clojure::
JavaScript
Clojure::
JSLetstalkabout
JS has a lot of
BrendanEich (creator of
JavaScript)
—
News at 11.stupid in it
x = 12;var
Attack Globalsof thekiller
x = 12;
Attack Globalsof thekiller
ClojureSolution
ClojureSolution
Things
ClojureSolution
Thingsdon’t
ClojureSolution
Thingsdon’t
change
JavaScriptNamespaces
(function(){ })();
JavaScriptNamespaces
(function( $ ){
var methods = { init: function( options ) {}, show: function( ) {}, hide: function( ) {}, update: function( content ) {} };
$.fn.tooltip = function( method ) { if ( methods[method] ) { return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 )); } else if ( typeof method === 'object' || ! method ) { return methods.init.apply( this, arguments ); } else { $.error( 'Method ' + method + ' does not exist!' ); } };
})( jQuery );
This is
Crazy
( )
CoffeeScriptwill not
save you( )
ClojureSolution
ClojureSolution
Use
ClojureSolution
UseName-
ClojureSolution
UseName-spaces
;;src/clj/my_stuff.clj(ns my-stuff)
(defn thing [x] )(defn another [x y] )
ClojureNamespaces
;;src/clj/elsewhere.clj(ns elsewhere)
ClojureNamespaces
(ns elsewhere (:use [my-stuff :only [thing]]))
;;src/clj/elsewhere.clj
ClojureNamespaces
(ns elsewhere (:use [my-stuff :only [thing] :rename {thing other-thing}]))
;;src/clj/elsewhere.clj
ClojureNamespaces
1.
Clojure
SimplerJavaScript
than
isReca
p
Only
Geniusesuse
functional languages
Only
Geniusesuse
functional languages
Myth
2.JavaScriptUsing
from
ClojureScript
(. js/console log "hello")
InteropReview
(. js/console log "hello")js/
InteropReview
(. js/console log "hello")
(.log js/console "hello")
InteropReview
(.aMethod js/anObject)
ADifference
(.aMethod js/anObject)
(. js/anObject (aMethod))
ADifference
Types
TypesScalars
TypesNativeScalars
TypesNativeScalars
Collections
TypesNativeScalars
CollectionsForeign ( lazy in Clojure)
(array 1 2 3) ;;=> [1,2,3];(apply array [1 2 3]) ;;=> [1,2,3];
(cljs.core.Vector/fromArray js/x) ;;=> [1 2 3]
JS array <=> Cljs vector
(let [o (js-obj)] (aset o "x" 1) (set! (.y o) 2) o) ;;=> {"x":1,"y":2};
JS Objects
#js[1 2 3]
#js{"key1" "val1", "key2" "val2"}
Reader Literals
?
Extendable!
2.JavaScript
MOAR
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
jQuery.select("#main") .append("<span>") .text("hello");
jQuery.select("#main") .append("<span>") .text("hello");
(-> js/jQuery (.select "#main")
(.text "hello")) (.append "<span>")
jQuery.select("#main") .append("<span>") .text("hello");
(-> js/jQuery (.select "#main")
(.text "hello")) (my-append "<span>")
CompareJavaScript
var $main = jQuery.select("#main");my_appender($main, "<span>");$main.text("hello");
CompareJavaScript
var $main = jQuery.select("#main");my_appender($main, "<span>");$main.text("hello");
jQuery.fn.my_appender = function(x){};
CompareJavaScript
Build façades
(defn append [sel node-type] (.append sel node-type))
(defn select [sel selector] (.select sel selector))
(-> js/jQuery (select "#main") (append "svg"))
Build façades
façades
decoupleintent implementation
2.JavaScriptUsing
from
ClojureScript
than using JavaScript from JavaScript.
is
Reca
p
2.JavaScript
MOARFun!
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Reca
p
Safe!
2.JavaScript
MOAR
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Reca
p
Extendable!
2.JavaScript
MOAR
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Reca
p
3..jsThe trip from
.cljsAdventure!
to
is an
(you might get hurt)
3.ClojureScript
until
we thought we knew
showed us
otherwise
What
Lets talk about
this
var f = function(){ return this; };
this this this this
var f = function(){ return this; };f(); //=> DOMWindow
this this this this
var dog = {};dog.name = "Rex";dog.bark = function(){ return "My name is " + this.name;};
var f = function(){ return this; };f(); //=> DOMWindow
this this this this
var dog = {};dog.name = "Rex";dog.bark = function(){ return "My name is " + this.name;};
var f = function(){ return this; };
dog.bark(); // => "My name is Rex"
f(); //=> DOMWindow
this this this this
Bewareapply
(apply (. js/dog bark) 1 2 3)
Bewareapply
(apply (. js/dog bark) 1 2 3)
cljs.core.apply.call( null, dog.bark, cljs.core.Vector.fromArray([1,2,3]));
Bewareapply
YOU WANT IT TO BE ONE WAY. BUT IT’S THE OTHER WAY.
EFERENTIAL TRANSPARENCR Y
1.
Clojure
SimplerJavaScript
than
isReca
p
2.JavaScript
MOARFun!
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Reca
p
Safe!
2.JavaScript
MOAR
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Reca
p
Extendable!
2.JavaScript
MOAR
Using
from
ClojureScript
than using JavaScript from JavaScript.
is
Reca
p
3..jsThe trip from
.cljsAdventure!
to
is an
(you might get hurt)
Recap
4.A free pieceunsolicited
Advice:of
Tools don’t
makeartistth
e
Kevin LynaghKeming Labs keminglabs.com/talks
slides, notes, &c.