SlideShare uma empresa Scribd logo
1 de 60
Baixar para ler offline
Damn Fine




   CoffeeScript
Focus



Language
Some Kind of Holy
        Python

                 Ruby

JavaScrip t
Raw
var render = function (width, height, draw, filePath)
{
  var canvas = new Canvas(width, height),
       ctx = canvas.getContext('2d');
   draw.call(ctx);
  var out = fs.createWriteStream(filePath),
       stream = canvas.createPNGStream();
   stream.on('data', function(chunk) {
     out.write(chunk);
   });
   stream.on('end', function() {
     console.log("Created: " + filePath);
   });
};
Brewed

render = (width, height, draw, filePath) ->
  canvas = new Canvas(width, height)
  draw.call canvas.getContext '2d'
  out = fs.createWriteStream filePath
  stream = canvas.createPNGStream()
  stream.on 'data', (chunk) ->
    out.write chunk
  stream.on 'end', ->
    console.log "Created: #{filePath}"
Basically



● function is () ->
● local variables

● indentation

● omittable parentheses
True To JavaScript



The golden rule of CoffeeScript is: "It's just
                JavaScript"
Less Syntactic Noise


stream.on('end', function() {
  console.log("Created: " +
filePath);
});
stream.on 'end', ->
  console.log "Created: #{filePath}"
My perspective



Node

A platform: JS machine + CommonJS stdlib
Runtimes
It's just



Coffee In Coffee
Browser




Just JS (generated)
Convert & Eval...



<script src="/extras/coffee-script.js"></script>
<script type="text/coffeescript">
  # coffee time
</script>
Node




$ npm install coffee-script
REPL




$ coffee
101



# Assignment:
number   = 42
opposite = true
Conditions

if happy and knowsIt
  clapsHands()
  chaChaCha()
else
  showIt()

date = if friday then sue else jill

options or= defaults

number = -42 if opposite
Functions


square = (x) -> x * x

cube = (x) -> square(x) * x

fill = (container, liquid="coffee") ->
  "Filling the #{container} with #{liquid}..."

noop = ->
In JQuery



$('span').each ->
  it = $(this)
  if it.is('.style-1, .style-20') or
      not it.attr('class')
    it.replaceWith(it.html())
Data


# Arrays:
list = [1, 2, 3, 4, 5]

# Objects:
math =
  root:    Math.sqrt
  square: square
  cube:    (x) -> x * square x
modes = {ready: yes, balance: off}

bitlist   = [
  1, 0,   1
  0, 0,   1
  1, 1,   0
]
How True To JavaScript?
Compile


$ coffee -c some.coffee

# or just print out
$ coffee -p some.coffee
number   = 42
opposite = true

number = -42 if opposite

list = [1, 2, 3, 4, 5]

math =
  root:   Math.sqrt
  square: square
  cube:   (x) -> x * square x
var list, math, number, opposite;
number = 42;
opposite = true;
if (opposite) {
   number = -42;
}
list = [1, 2, 3, 4, 5];
math = {
   root: Math.sqrt,
   square: square,
   cube: function(x) {
     return x * square(x);
   }
};
Lexical Scopes & Safety



outer = 1
changeNumbers = ->
  inner = -1
  outer = 10
inner = changeNumbers()
var changeNumbers, inner, outer;
outer = 1;
changeNumbers = function() {
   var inner;
   inner = -1;
   return outer = 10;
};
inner = changeNumbers();
Syntactic


Thin Coat of Sugar

And Some Boilerplate
Sugar++


# Splats:
race = (winner, runners...) ->
  print winner, runners

# Existence:
alert "I knew it!" if elvis?
var race;
var __slice = Array.prototype.slice;
var race = function() {
   var runners, winner;
   winner = arguments[0], runners = 2 <= arguments.length ?
__slice.call(arguments, 1) : [];
   return print(winner, runners);
};
if (typeof elvis !== "undefined" && elvis !== null) {
   alert("I knew it!");
}
Expressions, Implicitness, Return
Unpacking



[first, second] = [1, 2, 3, 4]


_ref = [1, 2, 3], first = _ref[0], second = _ref[1];
{puts, inspect} = require 'util'


_ref2 = require('util'), puts = _ref2.puts, inspect =
_ref2.inspect;
Comprehensions!




cubes = (math.cube num for num in list)
var cubes;
cubes = (function() {
  var _i, _len, _results;
  _results = [];
  for (_i = 0, _len = list.length; _i < _len; _i++) {
    num = list[_i];
    _results.push(math.cube(num));
  }
  return _results;
})();
Comprehensive



yearsOld = max: 10, ida: 9, tim: 11

ages = for child, age of yearsOld
  child + " is " + age
Closing Over Loops



for filename in list
  do (filename) ->
    fs.readFile filename, (err, contents) ->
      compile filename, contents.toString()
Operator Names
CoffeeScript            JavaScript

is, isnt                ===, !==

and, or, not            &&, ||, !

true, yes, on           true

false, no, off          false

in, of                  in, N/A

@, this                 this

::                      prototype
Different Kinds of Else


● unless
● a?

●a ? b

● a ?= b

● a?.b
Classes
class Animal
  constructor: (@name) ->

 move: (meters) ->
   alert @name + " moved " + meters + "m."

class Snake extends Animal
  move: ->
    alert "Slithering..."
    super 5

class Horse extends Animal
  move: ->
    alert "Galloping..."
    super 45

sam = new Snake "Sammy the Python"
tom = new Horse "Tommy the Palomino"

sam.move()
tom.move()
var Animal, Horse, Snake, sam, tom;
var __hasProp = Object.prototype.hasOwnProperty, __extends =
function(child, parent) {
   for (var key in parent) { if (__hasProp.call(parent, key))
child[key] = parent[key]; }
   function ctor() { this.constructor = child; }
   ctor.prototype = parent.prototype;
   child.prototype = new ctor;
   child.__super__ = parent.prototype;
   return child;
};
Animal = (function() {
  function Animal(name) {
     this.name = name;
  }
  Animal.prototype.move = function(meters) {
     return alert(this.name + " moved " + meters + "m.");
  };
  return Animal;
})();
Snake = (function() {
  __extends(Snake, Animal);
  function Snake() {
     Snake.__super__.constructor.apply(this, arguments);
  }
  Snake.prototype.move = function() {
     alert("Slithering...");
     return Snake.__super__.move.call(this, 5);
  };
  return Snake;
})();
Binding => This


Account = (customer, cart) ->
  @customer = customer
  @cart = cart

  $('.shopping_cart').bind 'click', (event) =>
    @customer.purchase @cart
var Account;
var __bind = function(fn, me){ return function(){ return
fn.apply(me, arguments); }; };
Account = function(customer, cart) {
   this.customer = customer;
   this.cart = cart;
   return $('.shopping_cart').bind('click', __bind(function(event)
{
     return this.customer.purchase(this.cart);
   }, this));
};
And more...
● Literals: Functions, Objects and Arrays
● If, Else, Unless, and Conditional Assignment
● Splats...
● Array Slicing and Splicing

● Loops and Comprehensions

● Destructuring Assignment




●   Everything is an Expression
● Operators and Aliases
● Lexical Scoping and Variable Safety

● Classes, Inheritance, and Super

● Function Binding
● Switch and Try/Catch
● Chained Comparisons

● String Interpolation, Heredocs, and Block

   Comments
● Extended Regular Expressions

● Embedded JavaScript
Future/Now
Coding in Coffee

    sameness?

   seeing clearly..

  transparencies..

     choices...
Paths Ahead?




Harmony...
Tinkering Fun!



Node goodies: Zombie.js, Canvas, ...
Developing a
CommonJS Lib
$ npm link .

$ coffee --watch src

$ cake
Cakefile
{spawn, exec} = require 'child_process'

SRC = 'js/src'
LIB = 'js/lib'

task 'build', "compile coffee to js", -> build onErrorExit

task 'watch', "continously compile coffee to js", ->
  cmd = spawn "coffee", ["-cw", "-o", LIB, SRC]
  cmd.stdout.on "data", (data)-> process.stdout.write data
  cmd.on "error", onErrorExit

build = (cb)->
  console.log "Coffee compiling..."
  exec "rm -rf #{LIB} && coffee -c -l -b -o #{LIB} #{SRC}",
       (err, out)-> cb err

onErrorExit = (err)->
  if err
    process.stdout.write "#{err.stack}n"
    process.exit -1
Thanks!
Image Tributes (CC)


"Black as midnight on a moonless night."
Knight of the Holy Grail
Reflecting on a Sunday afternoon
In The Red Room
Fall down mountains, just don't fall on me
Midnight Black
Orrery Steam Punk Assemblage by urbandon
Steampunk Time Contraption

Mais conteúdo relacionado

Mais procurados

Clustering com numpy e cython
Clustering com numpy e cythonClustering com numpy e cython
Clustering com numpy e cython
Anderson Dantas
 
第二讲 预备-Python基礎
第二讲 预备-Python基礎第二讲 预备-Python基礎
第二讲 预备-Python基礎
anzhong70
 

Mais procurados (20)

Swift - 혼자 공부하면 분명히 안할테니까 같이 공부하기
Swift - 혼자 공부하면 분명히 안할테니까 같이 공부하기Swift - 혼자 공부하면 분명히 안할테니까 같이 공부하기
Swift - 혼자 공부하면 분명히 안할테니까 같이 공부하기
 
Functional Pe(a)rls - the Purely Functional Datastructures edition
Functional Pe(a)rls - the Purely Functional Datastructures editionFunctional Pe(a)rls - the Purely Functional Datastructures edition
Functional Pe(a)rls - the Purely Functional Datastructures edition
 
Rust ⇋ JavaScript
Rust ⇋ JavaScriptRust ⇋ JavaScript
Rust ⇋ JavaScript
 
A Few of My Favorite (Python) Things
A Few of My Favorite (Python) ThingsA Few of My Favorite (Python) Things
A Few of My Favorite (Python) Things
 
Clustering com numpy e cython
Clustering com numpy e cythonClustering com numpy e cython
Clustering com numpy e cython
 
Frege is a Haskell for the JVM
Frege is a Haskell for the JVMFrege is a Haskell for the JVM
Frege is a Haskell for the JVM
 
An Elephant of a Different Colour: Hack
An Elephant of a Different Colour: HackAn Elephant of a Different Colour: Hack
An Elephant of a Different Colour: Hack
 
Academy PRO: ES2015
Academy PRO: ES2015Academy PRO: ES2015
Academy PRO: ES2015
 
Refactor like a boss
Refactor like a bossRefactor like a boss
Refactor like a boss
 
第二讲 Python基礎
第二讲 Python基礎第二讲 Python基礎
第二讲 Python基礎
 
第二讲 预备-Python基礎
第二讲 预备-Python基礎第二讲 预备-Python基礎
第二讲 预备-Python基礎
 
PHP 7 – What changed internally? (Forum PHP 2015)
PHP 7 – What changed internally? (Forum PHP 2015)PHP 7 – What changed internally? (Forum PHP 2015)
PHP 7 – What changed internally? (Forum PHP 2015)
 
Groovy puzzlers jug-moscow-part 2
Groovy puzzlers jug-moscow-part 2Groovy puzzlers jug-moscow-part 2
Groovy puzzlers jug-moscow-part 2
 
Groovy
GroovyGroovy
Groovy
 
Elm: give it a try
Elm: give it a tryElm: give it a try
Elm: give it a try
 
Adventures in Optimization
Adventures in OptimizationAdventures in Optimization
Adventures in Optimization
 
Introduction to Groovy
Introduction to GroovyIntroduction to Groovy
Introduction to Groovy
 
PubNative Tracker
PubNative TrackerPubNative Tracker
PubNative Tracker
 
Functional programming with php7
Functional programming with php7Functional programming with php7
Functional programming with php7
 
Cycle.js: Functional and Reactive
Cycle.js: Functional and ReactiveCycle.js: Functional and Reactive
Cycle.js: Functional and Reactive
 

Semelhante a Damn Fine CoffeeScript

CoffeeScript
CoffeeScriptCoffeeScript
CoffeeScript
None
 
Introduction à CoffeeScript pour ParisRB
Introduction à CoffeeScript pour ParisRB Introduction à CoffeeScript pour ParisRB
Introduction à CoffeeScript pour ParisRB
jhchabran
 
Internal Project: Under the Hood
Internal Project: Under the HoodInternal Project: Under the Hood
Internal Project: Under the Hood
Vladik Khononov
 
Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)
Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)
Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)
MongoSF
 
Groovy vs Boilerplate and Ceremony Code
Groovy vs Boilerplate and Ceremony CodeGroovy vs Boilerplate and Ceremony Code
Groovy vs Boilerplate and Ceremony Code
stasimus
 
AST - the only true tool for building JavaScript
AST - the only true tool for building JavaScriptAST - the only true tool for building JavaScript
AST - the only true tool for building JavaScript
Ingvar Stepanyan
 
谈谈Javascript设计
谈谈Javascript设计谈谈Javascript设计
谈谈Javascript设计
Ailsa126
 

Semelhante a Damn Fine CoffeeScript (20)

CoffeeScript
CoffeeScriptCoffeeScript
CoffeeScript
 
CoffeeScript
CoffeeScriptCoffeeScript
CoffeeScript
 
Introduction à CoffeeScript pour ParisRB
Introduction à CoffeeScript pour ParisRB Introduction à CoffeeScript pour ParisRB
Introduction à CoffeeScript pour ParisRB
 
CoffeeScript - A Rubyist's Love Affair
CoffeeScript - A Rubyist's Love AffairCoffeeScript - A Rubyist's Love Affair
CoffeeScript - A Rubyist's Love Affair
 
Rails-like JavaScript Using CoffeeScript, Backbone.js and Jasmine
Rails-like JavaScript Using CoffeeScript, Backbone.js and JasmineRails-like JavaScript Using CoffeeScript, Backbone.js and Jasmine
Rails-like JavaScript Using CoffeeScript, Backbone.js and Jasmine
 
Internal Project: Under the Hood
Internal Project: Under the HoodInternal Project: Under the Hood
Internal Project: Under the Hood
 
DataMapper
DataMapperDataMapper
DataMapper
 
Functional Programming with Groovy
Functional Programming with GroovyFunctional Programming with Groovy
Functional Programming with Groovy
 
TypeScript Introduction
TypeScript IntroductionTypeScript Introduction
TypeScript Introduction
 
Coffee scriptisforclosers nonotes
Coffee scriptisforclosers nonotesCoffee scriptisforclosers nonotes
Coffee scriptisforclosers nonotes
 
ES6 Overview
ES6 OverviewES6 Overview
ES6 Overview
 
Php functions
Php functionsPhp functions
Php functions
 
ddd+scala
ddd+scaladdd+scala
ddd+scala
 
Node.js - Best practices
Node.js  - Best practicesNode.js  - Best practices
Node.js - Best practices
 
Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)
Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)
Map/reduce, geospatial indexing, and other cool features (Kristina Chodorow)
 
Groovy vs Boilerplate and Ceremony Code
Groovy vs Boilerplate and Ceremony CodeGroovy vs Boilerplate and Ceremony Code
Groovy vs Boilerplate and Ceremony Code
 
AST - the only true tool for building JavaScript
AST - the only true tool for building JavaScriptAST - the only true tool for building JavaScript
AST - the only true tool for building JavaScript
 
谈谈Javascript设计
谈谈Javascript设计谈谈Javascript设计
谈谈Javascript设计
 
谈谈Javascript设计
谈谈Javascript设计谈谈Javascript设计
谈谈Javascript设计
 
Real life-coffeescript
Real life-coffeescriptReal life-coffeescript
Real life-coffeescript
 

Mais de niklal (6)

Something Specific and Simple
Something Specific and SimpleSomething Specific and Simple
Something Specific and Simple
 
Länkad Data
Länkad DataLänkad Data
Länkad Data
 
(first '(Clojure.))
(first '(Clojure.))(first '(Clojure.))
(first '(Clojure.))
 
Webbens Arkitektur
Webbens ArkitekturWebbens Arkitektur
Webbens Arkitektur
 
Python utan-stodhjul-motorsag
Python utan-stodhjul-motorsagPython utan-stodhjul-motorsag
Python utan-stodhjul-motorsag
 
Groovy Fly Through
Groovy Fly ThroughGroovy Fly Through
Groovy Fly Through
 

Último

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Último (20)

Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot ModelMcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
JohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptxJohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptx
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
AI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by AnitarajAI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by Anitaraj
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUKSpring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering Developers
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 

Damn Fine CoffeeScript

  • 1. Damn Fine CoffeeScript
  • 3. Some Kind of Holy Python Ruby JavaScrip t
  • 4. Raw var render = function (width, height, draw, filePath) { var canvas = new Canvas(width, height), ctx = canvas.getContext('2d'); draw.call(ctx); var out = fs.createWriteStream(filePath), stream = canvas.createPNGStream(); stream.on('data', function(chunk) { out.write(chunk); }); stream.on('end', function() { console.log("Created: " + filePath); }); };
  • 5. Brewed render = (width, height, draw, filePath) -> canvas = new Canvas(width, height) draw.call canvas.getContext '2d' out = fs.createWriteStream filePath stream = canvas.createPNGStream() stream.on 'data', (chunk) -> out.write chunk stream.on 'end', -> console.log "Created: #{filePath}"
  • 6. Basically ● function is () -> ● local variables ● indentation ● omittable parentheses
  • 7. True To JavaScript The golden rule of CoffeeScript is: "It's just JavaScript"
  • 8. Less Syntactic Noise stream.on('end', function() { console.log("Created: " + filePath); });
  • 9. stream.on 'end', -> console.log "Created: #{filePath}"
  • 10. My perspective Node A platform: JS machine + CommonJS stdlib
  • 14. Convert & Eval... <script src="/extras/coffee-script.js"></script> <script type="text/coffeescript"> # coffee time </script>
  • 15. Node $ npm install coffee-script
  • 17. 101 # Assignment: number = 42 opposite = true
  • 18. Conditions if happy and knowsIt clapsHands() chaChaCha() else showIt() date = if friday then sue else jill options or= defaults number = -42 if opposite
  • 19. Functions square = (x) -> x * x cube = (x) -> square(x) * x fill = (container, liquid="coffee") -> "Filling the #{container} with #{liquid}..." noop = ->
  • 20. In JQuery $('span').each -> it = $(this) if it.is('.style-1, .style-20') or not it.attr('class') it.replaceWith(it.html())
  • 21. Data # Arrays: list = [1, 2, 3, 4, 5] # Objects: math = root: Math.sqrt square: square cube: (x) -> x * square x
  • 22. modes = {ready: yes, balance: off} bitlist = [ 1, 0, 1 0, 0, 1 1, 1, 0 ]
  • 23. How True To JavaScript?
  • 24. Compile $ coffee -c some.coffee # or just print out $ coffee -p some.coffee
  • 25. number = 42 opposite = true number = -42 if opposite list = [1, 2, 3, 4, 5] math = root: Math.sqrt square: square cube: (x) -> x * square x
  • 26. var list, math, number, opposite; number = 42; opposite = true; if (opposite) { number = -42; } list = [1, 2, 3, 4, 5]; math = { root: Math.sqrt, square: square, cube: function(x) { return x * square(x); } };
  • 27. Lexical Scopes & Safety outer = 1 changeNumbers = -> inner = -1 outer = 10 inner = changeNumbers()
  • 28. var changeNumbers, inner, outer; outer = 1; changeNumbers = function() { var inner; inner = -1; return outer = 10; }; inner = changeNumbers();
  • 29. Syntactic Thin Coat of Sugar And Some Boilerplate
  • 30. Sugar++ # Splats: race = (winner, runners...) -> print winner, runners # Existence: alert "I knew it!" if elvis?
  • 31. var race; var __slice = Array.prototype.slice; var race = function() { var runners, winner; winner = arguments[0], runners = 2 <= arguments.length ? __slice.call(arguments, 1) : []; return print(winner, runners); }; if (typeof elvis !== "undefined" && elvis !== null) { alert("I knew it!"); }
  • 33. Unpacking [first, second] = [1, 2, 3, 4] _ref = [1, 2, 3], first = _ref[0], second = _ref[1];
  • 34. {puts, inspect} = require 'util' _ref2 = require('util'), puts = _ref2.puts, inspect = _ref2.inspect;
  • 35. Comprehensions! cubes = (math.cube num for num in list)
  • 36. var cubes; cubes = (function() { var _i, _len, _results; _results = []; for (_i = 0, _len = list.length; _i < _len; _i++) { num = list[_i]; _results.push(math.cube(num)); } return _results; })();
  • 37. Comprehensive yearsOld = max: 10, ida: 9, tim: 11 ages = for child, age of yearsOld child + " is " + age
  • 38. Closing Over Loops for filename in list do (filename) -> fs.readFile filename, (err, contents) -> compile filename, contents.toString()
  • 39. Operator Names CoffeeScript JavaScript is, isnt ===, !== and, or, not &&, ||, ! true, yes, on true false, no, off false in, of in, N/A @, this this :: prototype
  • 40. Different Kinds of Else ● unless ● a? ●a ? b ● a ?= b ● a?.b
  • 41. Classes class Animal constructor: (@name) -> move: (meters) -> alert @name + " moved " + meters + "m." class Snake extends Animal move: -> alert "Slithering..." super 5 class Horse extends Animal move: -> alert "Galloping..." super 45 sam = new Snake "Sammy the Python" tom = new Horse "Tommy the Palomino" sam.move() tom.move()
  • 42. var Animal, Horse, Snake, sam, tom; var __hasProp = Object.prototype.hasOwnProperty, __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor; child.__super__ = parent.prototype; return child; };
  • 43. Animal = (function() { function Animal(name) { this.name = name; } Animal.prototype.move = function(meters) { return alert(this.name + " moved " + meters + "m."); }; return Animal; })();
  • 44. Snake = (function() { __extends(Snake, Animal); function Snake() { Snake.__super__.constructor.apply(this, arguments); } Snake.prototype.move = function() { alert("Slithering..."); return Snake.__super__.move.call(this, 5); }; return Snake; })();
  • 45. Binding => This Account = (customer, cart) -> @customer = customer @cart = cart $('.shopping_cart').bind 'click', (event) => @customer.purchase @cart
  • 46. var Account; var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; }; Account = function(customer, cart) { this.customer = customer; this.cart = cart; return $('.shopping_cart').bind('click', __bind(function(event) { return this.customer.purchase(this.cart); }, this)); };
  • 48. ● Literals: Functions, Objects and Arrays ● If, Else, Unless, and Conditional Assignment
  • 49. ● Splats... ● Array Slicing and Splicing ● Loops and Comprehensions ● Destructuring Assignment ● Everything is an Expression
  • 50. ● Operators and Aliases ● Lexical Scoping and Variable Safety ● Classes, Inheritance, and Super ● Function Binding
  • 51. ● Switch and Try/Catch ● Chained Comparisons ● String Interpolation, Heredocs, and Block Comments ● Extended Regular Expressions ● Embedded JavaScript
  • 53. Coding in Coffee sameness? seeing clearly.. transparencies.. choices...
  • 55. Tinkering Fun! Node goodies: Zombie.js, Canvas, ...
  • 57. $ npm link . $ coffee --watch src $ cake
  • 58. Cakefile {spawn, exec} = require 'child_process' SRC = 'js/src' LIB = 'js/lib' task 'build', "compile coffee to js", -> build onErrorExit task 'watch', "continously compile coffee to js", -> cmd = spawn "coffee", ["-cw", "-o", LIB, SRC] cmd.stdout.on "data", (data)-> process.stdout.write data cmd.on "error", onErrorExit build = (cb)-> console.log "Coffee compiling..." exec "rm -rf #{LIB} && coffee -c -l -b -o #{LIB} #{SRC}", (err, out)-> cb err onErrorExit = (err)-> if err process.stdout.write "#{err.stack}n" process.exit -1
  • 60. Image Tributes (CC) "Black as midnight on a moonless night." Knight of the Holy Grail Reflecting on a Sunday afternoon In The Red Room Fall down mountains, just don't fall on me Midnight Black Orrery Steam Punk Assemblage by urbandon Steampunk Time Contraption