SlideShare a Scribd company logo
NSFW!

Prezentace obsahuje
   sprostá slova
•   Syntaktický cukr
•   Čitelný kód
•   Strukturování kódu odsazením




                       FUJ!
Pochybuji, ţe se CoffeeScript ujme. Vlastně
nepochybuji, jsem si zcela jist, neujme se, protoţe
ekosystém. Široká audience nikdy CoffeeScript
nepřijme, protoţe nejsou příklady, nejsou
editory, nejsou code syntax highlightery, nejsou
debuggery, nejsou přátelé na IM, prostě CoffeeScript
je v ekosystému RIA aplikací vetřelec. Syntax pro
rychlejší a přehlednější psaní js není to podstatné, ač
jsem si sám dlouho myslel opak, co rozhoduje. Je
smutné, kdyţ někdo investuje svůj čas do
reimplementace ko­la…


DANIEL STEIGERWALD, 5.12.2010
Coffeescript je především krásný. Nejde jen o to
ušetřit si pár znaků při psaní kódu, ale hlavně ulevit
očím při jeho čtení. Coffeescript je chytrý. Je tu
elegantní a strohá definice třídy, skrze klíčové
slovo class. Ţe všechno je v Coffeescriptu výraz.
A ţe uţ nikdy nemusím přemýšlet, zdali iterovat
pomocí for in, nebo $.each. A nikdy uţ volat bind jen
proto, ţe chci uţít closure a zachovat this.
Pouţitelné nástroje existují, a kaţdý den se rodí
nové. (…)




DANIEL STEIGERWALD, 19.8.2011
SYNTAX
FUNKCE ->

dvojmoc = (x) -> x * x

soucet = (xs) ->
   r = 0
   (r = r + x) for x in xs
   r

console.log dvojmoc 5
console.log soucet [1, 3, 3, 7]
PROMĚNNÉ BEZ VAR

vnejsi = 1
funkce = ->
  vnitrni = 2
  vnejsi = 3
vnitrni = funkce()
ŘETĚZCE

"Třikrát pět je #{3 * 5}" //vyčíslí
'Třikrát pět je #{3 * 5}' //nevyčíslí

html = '''
  <strong>
  CoffeeScript!
  </strong>
  '''
POLE A OBJEKTY

znalosti =
  php:
    uroven: "pokrocily"
    praxe: 8
  html:
    uroven: "zacatecnik"
    praxe: 3
PODMÍNKY – IF, UNLESS

if zima then zatop()
if zima
   zatop()

zatop() if zima

zatop() unless teplo
kotel = if teplo then "off" else "on"

optimum = 18 < teplota < 23
PODMÍNĚNÉ PŘIŘAZENÍ

options or= defaults
//JS: options || (options = defaults);

unless odpoved? then odpoved = 42
//JS:
if (typeof odpoved === "undefined" ||
odpoved === null) {
  odpoved = 42;
}
CYKLY

while not file.EOF
   read file
read file until file.EOF

radky = readln file until file.EOF
VŠE JE VÝRAZ!

radky = readln file until file.EOF
kotel = if teplo then "off" else "on"
dvojmoc = (x) -> x*x
dvojmoci = (dvojmoc(x) for x in [1..5])
SMYČKA FOR

dvojmoci = (dvojmoc(x) for x in [1..5])

for jmeno in jmena
   alert jmeno

alert property for property of window
alert (property for property of window)

for key, value of database
for all key, value of database
ROZSAHY [..]

[1..5]  [1, 2, 3, 4, 5]
[1...5]  [1, 2, 3, 4]
[5..1]  [5, 4, 3, 2, 1]

[1..100]  iterační funkce
VÝPUSTKA (SPLAT) …

fn = (a, b...) -> čňčňčňčň
fn 10, 20, 30, 40 // a=10, b=[20, 30, 40]

fn = (a, b..., c) -> čňčňčňčň
fn 10, 20, 30, 40 // a=10, b=[20, 30], c=40

par = [10,20,30,40]
fn par // a=[10,20,30,40]
fn par... // a=10, b=[20, 30], c=40
DESTRUKTUROVANÉ PŘIŘAZENÍ

miry = ->
  [90, 60, 90]
[prsa, pas, boky] = miry()

[a, b] = [b, a]

pole = [3,1,4,1,5]
[prvni, telo..., posledni] = pole
TŘÍDY
TŘÍDA

class Prednasejici
  honorar: 0
  _wtf: true

ja = new Prednasejici
alert ja.honorar
KONSTRUKTOR

class Prednasejici
  constructor: (jmeno) -> this.jmeno=jmeno
  honorar: 0

ja = new Prednasejici("Martin")
alert ja.jmeno
@PROPERTY

class Prednasejici
  constructor: (jmeno) -> @jmeno=jmeno
  honorar: 0

ja = new Prednasejici("Martin")
alert ja.jmeno
@PROPERTY, VOL. 2

class Prednasejici
  constructor: (@jmeno) ->
  honorar: 0

ja = new Prednasejici("Martin")
alert ja.jmeno
DĚDIČNOST

class DrzyPrednasejici extends Prednasejici
  honorar: "Jidlo"

ja = new DrzyPrednasejici("Martin")
alert ja.honorar
PŘÍSTUP K PROTOTYPU ::

Array::map = -> čňčňčň
PRO A PROTI
PROBLÉMY

Významotvorná mezera

prefix = "prvek_"
id1 = prefix + 12 /// == prvek_12
id2 = prefix +12 /// TypeError
        id2 = prefix(+12)
PROBLÉMY

Asociativita operátorů

console.log (fn 3, fn 4)
   console.log (fn (3, fn 4))

console.log fn (3), fn (4)
PROBLÉMY

Porovnání je vždy typové

var a =   0,   b = '', c = '0';
a == b;   //   true
a == c;   //   true
b == c;   //   false

CoffeeScript překládá == na ===
„A TO JE VŠECHNO?“ VOL. 1

Interaktivní konzole na coffeescript.org
Dialekty – Iced CoffeeScript (await, defer)
CoffeeScript Redux – „source maps“
Pluginy pro editory
Knihovny
transpilery
„A TO JE VŠECHNO?“ VOL. 2

Čistý kód
Správné JS konstrukce
Robustní JS kód (vč. JSLint)
Čitelný kód
„A TO JE VŠECHNO?“ BONUS

„Literate CoffeeScript“ (od verze 1.5)

Zápis kódu do dokumentu v Markdown – kód je
součást svojí dokumentace
MATERIÁL KE STUDIU:
      UTFG!
Develconf coffeescript

More Related Content

More from Martin Maly

Prezentace o IoT pro iCollege
Prezentace o IoT pro iCollegePrezentace o IoT pro iCollege
Prezentace o IoT pro iCollege
Martin Maly
 
Prezentace pro Czech Internet Forum 2016
Prezentace pro Czech Internet Forum 2016Prezentace pro Czech Internet Forum 2016
Prezentace pro Czech Internet Forum 2016
Martin Maly
 
Prezentace pro Učitel In 2016
Prezentace pro Učitel In 2016Prezentace pro Učitel In 2016
Prezentace pro Učitel In 2016
Martin Maly
 
Od osmibitů k internetu věcí
Od osmibitů k internetu věcíOd osmibitů k internetu věcí
Od osmibitů k internetu věcí
Martin Maly
 
Jak vytrollit hejtra na fejsu
Jak vytrollit hejtra na fejsuJak vytrollit hejtra na fejsu
Jak vytrollit hejtra na fejsu
Martin Maly
 
Trocha matematiky v mezilidských vztazích
Trocha matematiky v mezilidských vztazíchTrocha matematiky v mezilidských vztazích
Trocha matematiky v mezilidských vztazích
Martin Maly
 
Vývojářské Nástroje a Techniky
Vývojářské Nástroje a TechnikyVývojářské Nástroje a Techniky
Vývojářské Nástroje a Techniky
Martin Maly
 

More from Martin Maly (7)

Prezentace o IoT pro iCollege
Prezentace o IoT pro iCollegePrezentace o IoT pro iCollege
Prezentace o IoT pro iCollege
 
Prezentace pro Czech Internet Forum 2016
Prezentace pro Czech Internet Forum 2016Prezentace pro Czech Internet Forum 2016
Prezentace pro Czech Internet Forum 2016
 
Prezentace pro Učitel In 2016
Prezentace pro Učitel In 2016Prezentace pro Učitel In 2016
Prezentace pro Učitel In 2016
 
Od osmibitů k internetu věcí
Od osmibitů k internetu věcíOd osmibitů k internetu věcí
Od osmibitů k internetu věcí
 
Jak vytrollit hejtra na fejsu
Jak vytrollit hejtra na fejsuJak vytrollit hejtra na fejsu
Jak vytrollit hejtra na fejsu
 
Trocha matematiky v mezilidských vztazích
Trocha matematiky v mezilidských vztazíchTrocha matematiky v mezilidských vztazích
Trocha matematiky v mezilidských vztazích
 
Vývojářské Nástroje a Techniky
Vývojářské Nástroje a TechnikyVývojářské Nástroje a Techniky
Vývojářské Nástroje a Techniky
 

Develconf coffeescript

  • 1.
  • 2. NSFW! Prezentace obsahuje sprostá slova
  • 3. Syntaktický cukr • Čitelný kód • Strukturování kódu odsazením FUJ!
  • 4. Pochybuji, ţe se CoffeeScript ujme. Vlastně nepochybuji, jsem si zcela jist, neujme se, protoţe ekosystém. Široká audience nikdy CoffeeScript nepřijme, protoţe nejsou příklady, nejsou editory, nejsou code syntax highlightery, nejsou debuggery, nejsou přátelé na IM, prostě CoffeeScript je v ekosystému RIA aplikací vetřelec. Syntax pro rychlejší a přehlednější psaní js není to podstatné, ač jsem si sám dlouho myslel opak, co rozhoduje. Je smutné, kdyţ někdo investuje svůj čas do reimplementace ko­la… DANIEL STEIGERWALD, 5.12.2010
  • 5. Coffeescript je především krásný. Nejde jen o to ušetřit si pár znaků při psaní kódu, ale hlavně ulevit očím při jeho čtení. Coffeescript je chytrý. Je tu elegantní a strohá definice třídy, skrze klíčové slovo class. Ţe všechno je v Coffeescriptu výraz. A ţe uţ nikdy nemusím přemýšlet, zdali iterovat pomocí for in, nebo $.each. A nikdy uţ volat bind jen proto, ţe chci uţít closure a zachovat this. Pouţitelné nástroje existují, a kaţdý den se rodí nové. (…) DANIEL STEIGERWALD, 19.8.2011
  • 6.
  • 8. FUNKCE -> dvojmoc = (x) -> x * x soucet = (xs) -> r = 0 (r = r + x) for x in xs r console.log dvojmoc 5 console.log soucet [1, 3, 3, 7]
  • 9. PROMĚNNÉ BEZ VAR vnejsi = 1 funkce = -> vnitrni = 2 vnejsi = 3 vnitrni = funkce()
  • 10. ŘETĚZCE "Třikrát pět je #{3 * 5}" //vyčíslí 'Třikrát pět je #{3 * 5}' //nevyčíslí html = ''' <strong> CoffeeScript! </strong> '''
  • 11. POLE A OBJEKTY znalosti = php: uroven: "pokrocily" praxe: 8 html: uroven: "zacatecnik" praxe: 3
  • 12. PODMÍNKY – IF, UNLESS if zima then zatop() if zima zatop() zatop() if zima zatop() unless teplo kotel = if teplo then "off" else "on" optimum = 18 < teplota < 23
  • 13. PODMÍNĚNÉ PŘIŘAZENÍ options or= defaults //JS: options || (options = defaults); unless odpoved? then odpoved = 42 //JS: if (typeof odpoved === "undefined" || odpoved === null) { odpoved = 42; }
  • 14. CYKLY while not file.EOF read file read file until file.EOF radky = readln file until file.EOF
  • 15. VŠE JE VÝRAZ! radky = readln file until file.EOF kotel = if teplo then "off" else "on" dvojmoc = (x) -> x*x dvojmoci = (dvojmoc(x) for x in [1..5])
  • 16. SMYČKA FOR dvojmoci = (dvojmoc(x) for x in [1..5]) for jmeno in jmena alert jmeno alert property for property of window alert (property for property of window) for key, value of database for all key, value of database
  • 17. ROZSAHY [..] [1..5]  [1, 2, 3, 4, 5] [1...5]  [1, 2, 3, 4] [5..1]  [5, 4, 3, 2, 1] [1..100]  iterační funkce
  • 18. VÝPUSTKA (SPLAT) … fn = (a, b...) -> čňčňčňčň fn 10, 20, 30, 40 // a=10, b=[20, 30, 40] fn = (a, b..., c) -> čňčňčňčň fn 10, 20, 30, 40 // a=10, b=[20, 30], c=40 par = [10,20,30,40] fn par // a=[10,20,30,40] fn par... // a=10, b=[20, 30], c=40
  • 19. DESTRUKTUROVANÉ PŘIŘAZENÍ miry = -> [90, 60, 90] [prsa, pas, boky] = miry() [a, b] = [b, a] pole = [3,1,4,1,5] [prvni, telo..., posledni] = pole
  • 21. TŘÍDA class Prednasejici honorar: 0 _wtf: true ja = new Prednasejici alert ja.honorar
  • 22. KONSTRUKTOR class Prednasejici constructor: (jmeno) -> this.jmeno=jmeno honorar: 0 ja = new Prednasejici("Martin") alert ja.jmeno
  • 23. @PROPERTY class Prednasejici constructor: (jmeno) -> @jmeno=jmeno honorar: 0 ja = new Prednasejici("Martin") alert ja.jmeno
  • 24. @PROPERTY, VOL. 2 class Prednasejici constructor: (@jmeno) -> honorar: 0 ja = new Prednasejici("Martin") alert ja.jmeno
  • 25. DĚDIČNOST class DrzyPrednasejici extends Prednasejici honorar: "Jidlo" ja = new DrzyPrednasejici("Martin") alert ja.honorar
  • 26. PŘÍSTUP K PROTOTYPU :: Array::map = -> čňčňčň
  • 28. PROBLÉMY Významotvorná mezera prefix = "prvek_" id1 = prefix + 12 /// == prvek_12 id2 = prefix +12 /// TypeError id2 = prefix(+12)
  • 29. PROBLÉMY Asociativita operátorů console.log (fn 3, fn 4) console.log (fn (3, fn 4)) console.log fn (3), fn (4)
  • 30. PROBLÉMY Porovnání je vždy typové var a = 0, b = '', c = '0'; a == b; // true a == c; // true b == c; // false CoffeeScript překládá == na ===
  • 31. „A TO JE VŠECHNO?“ VOL. 1 Interaktivní konzole na coffeescript.org Dialekty – Iced CoffeeScript (await, defer) CoffeeScript Redux – „source maps“ Pluginy pro editory Knihovny transpilery
  • 32. „A TO JE VŠECHNO?“ VOL. 2 Čistý kód Správné JS konstrukce Robustní JS kód (vč. JSLint) Čitelný kód
  • 33. „A TO JE VŠECHNO?“ BONUS „Literate CoffeeScript“ (od verze 1.5) Zápis kódu do dokumentu v Markdown – kód je součást svojí dokumentace