Skip to content

Instantly share code, notes, and snippets.

@antris
Created May 2, 2013 14:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save antris/5502548 to your computer and use it in GitHub Desktop.
Save antris/5502548 to your computer and use it in GitHub Desktop.
# No more templates: the power of abstraction in CoffeeScript and Underscore
## Terse syntax for creating DOM elements
$('div') # Find div elements in DOM
$('<div>') # Create a div element, detached from DOM
## Creating DOM trees
$('<article>').append(
$('<h1>').text('My blog post'),
$('<p>').text("
Lumia pirisi 6.00 , time to wake up, Tiger!! Nyt tiedän mitä Ruissalon
harjoituksissa treenataan PRO Ari Mäen johdolla!! Ennen puoltayötä Taksi vei
Hirvensaloon-nuoremmat veljet jatkoivat Mikon johdolla!! Teksti-TV:n nopea
tsekkaus sen kertoo- kiekkokauden huipennus lähestyy!! Palautusharjoitus +
videot 15.30 ja visiitti oppi-isäni Juuso Wahlstenin sairasvuoteella- Juuso
toipuu hienosti lonkkaleikkauksesta!! who knows!!!??? Mondeo kiitää
Ellivuoresta Turkuun reilussa tunnissa!!Nyt time to hit the sack- huomenna
ISO PÄIVÄ; veljet iskuun ja kohti KOUVOLAA- game 4 odottaa!!\" Det blir
intressant\" sanoisi Foppa ja Sundin; hyvää yötä sanon minä!! Br , JT, Lion
# 79
")
)
# => object
## Transforming a list with _.map
square = (x) -> x * x
_([1, 2, 3]).map(square) # => [1, 4, 9]
## Bunch of data
people = [
{ name: "Mike", age: 5 },
{ name: "Jack", age: 24 },
{ name: "Miranda", age: 37 }
]
## Transforming a list of data into a list of detached DOM elements
toElement = (person) -> $('<li>').text("#{person.name} (#{person.age})")
_(people).map(toElement) # => [object, object, object]
## Reduce
add = (x, y) -> x + y
_([1, 2, 3]).reduce(add, 0) # => 6
## Transforming a list of data into a single <ul> element that contains all the people
append = (parent, child) -> parent.append(child)
toElement = (person) -> $('<li>').text("#{person.name} (#{person.age})")
_(people).chain()
.map(toElement)
.reduce(append, $('<ul>'))
.value()
# => object
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment