"Coffee Script" in Brief
0 likes714 views
CoffeeScript is a programming language that compiles to JavaScript. It aims to enhance JavaScript with Python-like syntax, including features like classes, lexical scoping, default arguments, string interpolation, and concise conditional assignment. The document provides examples of CoffeeScript code and how it compiles to equivalent JavaScript, highlighting some of CoffeeScript's key features like class definitions, lexical scoping without global variables, default arguments, string interpolation, conditional suffixes, operator aliases, destructuring assignment, the existential operator, splats, and list comprehensions.
![[dollars, cents] = input.match /(d+)/g](https://image.slidesharecdn.com/muchadoaboutcoffeescript-lsrcv-110813140603-phpapp02-110914021639-phpapp01/85/Coffee-Script-in-Brief-39-320.jpg)
![[dollars, cents] = (input.match /(d+)/g) ? [0, 0]](https://image.slidesharecdn.com/muchadoaboutcoffeescript-lsrcv-110813140603-phpapp02-110914021639-phpapp01/85/Coffee-Script-in-Brief-42-320.jpg)
![gold, silver, bronze, rest = ""
awardMedals = (first, second, third, others...) ->
gold = first
silver = second
bronze = third
rest = others
pieEatingCompetitors = [
"Wynn Netherland",
"Steve Klabnik",
"Adam Keys",
"Richard Schneeman",
"Rob Mack",
"Tim Tyrrell",
"Steve Stedman",
"Mando Escamilla",
"Keith Gaddis"
]
awardMedals pieEatingCompetitors...](https://image.slidesharecdn.com/muchadoaboutcoffeescript-lsrcv-110813140603-phpapp02-110914021639-phpapp01/85/Coffee-Script-in-Brief-44-320.jpg)
![eat food for food in ['toast', 'cheese', 'wine']](https://image.slidesharecdn.com/muchadoaboutcoffeescript-lsrcv-110813140603-phpapp02-110914021639-phpapp01/85/Coffee-Script-in-Brief-46-320.jpg)
![eat food for food in ['toast', 'cheese', 'wine'] ↩
when food is "toast"](https://image.slidesharecdn.com/muchadoaboutcoffeescript-lsrcv-110813140603-phpapp02-110914021639-phpapp01/85/Coffee-Script-in-Brief-47-320.jpg)
"Coffee Script" in Brief
- 1. Much Ado About CoffeeScript Mattt Thompson (@mattt) Lone Star Ruby Conf V
- 3. Sass → CSS $blue: #3bbfce .content-navigation { $margin: 16px border-color: #3bbfce; color: #2ca2af; } .content-navigation border-color: $blue .border { color: darken($blue, 9%) padding: 8px; margin: 8px; .border border-color: #3bbfce; } padding: $margin / 2 margin: $margin / 2 border-color: $blue
- 4. CoffeeScript → JavaScript var Account; Account = (customer, cart) -> var __bind = function(fn, me) @customer = customer { return function(){ return @cart = cart fn.apply(me, arguments); }; }; Account = function(customer, cart) { $('.shopping_cart').bind ↩ this.customer = customer; 'click', (event) => this.cart = cart; return $ @customer.purchase @cart ('.shopping_cart').bind('click', __bind(function(event) { return this.customer.purchase(this.cart); }, this)); };
- 5. CoffeeScript
- 7. • Less Syntactic Cruft • JavaScript Design Patterns are Features of CoffeeScript
- 10. Syntax
- 11. jQuery(function() { $("#title").show(); });
- 12. jQuery function() $("#title").show()
- 13. jQuery -> $("#title").show()
- 14. Store.prototype.add = function(item) { this.items.push(item); }
- 15. Store.prototype.add = function(item) this.items.push(item)
- 16. Store.prototype.add = function(item) @items.push(item)
- 17. add: function(item) @items.push(item)
- 18. add: -> (item) @items.push(item)
- 19. add: (item) -> @items.push(item)
- 20. • Redundant Punctuation Omitted • function becomes -> • this. becomes @ • {} becomes ⇥
- 21. Features
- 24. 1 Class Pattern
- 25. class Animal constructor: (name) -> @name = name
- 26. var Animal; Animal = (function() { function Animal(name) { this.name = name; } return Animal; })();
- 27. 2 Lexical Scoping (No Global Variables)
- 28. window.Animal = class Animal constructor: (name) -> @name = name
- 30. window.Animal = class Animal constructor: (name = "Unknown") -> @name = name
- 32. class Bear extends Animal constructor: (name) -> @name = "#{name}, the Bear"
- 34. @price = amount if amount > 0.00
- 36. @lovesTacos = false unless @name is "Mattt"
- 37. CoffeeScript JavaScript is === isnt !== not ! and && or || true, yes, on true @, this this of in in N/A
- 39. [dollars, cents] = input.match /(d+)/g
- 41. ?
- 42. [dollars, cents] = (input.match /(d+)/g) ? [0, 0]
- 43. 9 Splats
- 44. gold, silver, bronze, rest = "" awardMedals = (first, second, third, others...) -> gold = first silver = second bronze = third rest = others pieEatingCompetitors = [ "Wynn Netherland", "Steve Klabnik", "Adam Keys", "Richard Schneeman", "Rob Mack", "Tim Tyrrell", "Steve Stedman", "Mando Escamilla", "Keith Gaddis" ] awardMedals pieEatingCompetitors...
- 46. eat food for food in ['toast', 'cheese', 'wine']
- 47. eat food for food in ['toast', 'cheese', 'wine'] ↩ when food is "toast"
- 48. languages = { "Javascript": 3, "CoffeeScript": 9, "Ruby": 9, "Python": 6, "Objective-C": 7, "Potion": 10 } favorites = language for language, awesomeness of ↩ languages when awesomeness >= 7