Ultimate Language Shootout IV: CoffeeScript

1,819 views
1,608 views

Published on

A presentation on CoffeeScript given at ChiPy's 2013 Ultimate Language Shootout on June 13, 2013.

Video:
http://pyvideo.org/video/1864/ultimate-language-shootout-iv-coffeescript

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,819
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Ultimate Language Shootout IV: CoffeeScript

  1. 1. Ultimate LanguageShootout IV: CoffeeScriptChiPyJune 13, 2013
  2. 2. What is CoffeeScript?It’s basically syntax sugar for JavaScript.Perhaps some analogies are in order...
  3. 3. If JavaScript is gluten-freehaggis pizza
  4. 4. Then CoffeeScript is anenchanted thincrusthandcrafted by Gandalf
  5. 5. If JavaScript is a corrupt,lecherous cop
  6. 6. Then CoffeeScript isSynchronized SwimmingDetective
  7. 7. If JavaScript is Smaug, theevil dragon
  8. 8. Then CoffeeScript is anadorable frog-shaped lighter
  9. 9. If JavaScript is a terrifyinghell clown
  10. 10. Then CoffeeScript is PrincessAmidala
  11. 11. If JavaScript is a smellydonkey with bad knees
  12. 12. Then CoffeeScript is a robotunicorn
  13. 13. If JavaScript is a grumpyblobfish
  14. 14. Then CoffeeScript is a muppetfish quartet
  15. 15. If JavaScript is a poisonmushroom
  16. 16. Then CoffeeScript is thehammer suit
  17. 17. If JavaScript is A Night atthe Roxbury
  18. 18. Then CoffeeScript isAnchorman
  19. 19. If JavaScript is a poo-flavored Tootsie Roll
  20. 20. Then CoffeeScript is a baconchocolate bar
  21. 21. If JavaScript is a lonecommando with a crappy gun
  22. 22. Then CoffeeScript is a giantrobot made of other robots
  23. 23. I guess I’m trying to say thatCoffeeScript might not be aterrible idea.
  24. 24. CoffeeScript does borrowfrom some of the bestlanguages.The Python and Rubyinfluences are glaringly obvious.
  25. 25. Let’s walk through a simpleCoffeeScript application.https://github.com/feihong/coffeescript-talk
  26. 26. Multiline comments###Implement a shuffle() function that randomlyrearranges the elements in a given array.Also demo its usage and effect.###
  27. 27. Multiline commentnotes• Multiline comments appear as-is in thecompiled .js file, using the /* */ commentsyntax.
  28. 28. Main functionmain = ->array = (c.toUpperCase() for c in abcdefg)display array$(document.body).append <hr>for i in [1..6]shuffle arraydisplay array
  29. 29. Main function notes• Whitespace delimits blocks• Define function using -> operator• Array expression uses parentheses• Parentheses not required for functioninvocation• Ranges specified using [a..b]• No colon at end of looping statement
  30. 30. Shuffle functionshuffle = (array) ->i = array.lengthj = nullif i == 0returnwhile i -= 1j = Math.floor(Math.random() * (i+1))[array[i], array[j]] = [array[j], array[i]]
  31. 31. Shuffle function notes• Parentheses somewhat advised whencomplex expressions are passed into afunction• No colon at end of conditional statement• Destructuring assignment requires squarebrackets
  32. 32. Display functiondisplay = (array) ->para = $(<p></p>)$(document.body).append parafor char in arrayval = 60 # simplifiedstyle = """background: rgb(#{val}, #{val}, #{val});border: 1px solid black;padding: 5px; margin: 5px;"""h = "<span style="#{style}">#{el}</span>"para.append h
  33. 33. Display function notes• Multiline string takes indentation intoaccount (resulting string doesn’t containextra spaces).• String interpolation requires double-quotedstrings
  34. 34. CoffeeScript’s bigweaknessDebugging sucks! Errors in the console referto the generated .js file, not theoriginal .coffee file.
  35. 35. Chrome to the rescue!• Open Developer Tools• Click gear icon in lower-right corner• Check “Enable source maps”• Compile your .coffee files using the -moption
  36. 36. Compiling CoffeeScriptRunning “coffee -c -m main.coffee”produces main.js and main.map.
  37. 37. So, in conclusion...
  38. 38. CoffeeScript might notbe terrible.
  39. 39. The end

×