2. diel - Vetvenia a cykly v CoffeeScriptu

Vitajte u druhého dielu o CoffeeScriptu. V minulom dieli sme si urobili úvod do tohto jazyka a spomenuli základné syntax. Dnes si ukážeme vetvenia a cykly.

Vetvenia

Ako možno očakávate, pre základné vetvenie použijeme tradičnú slovka if / else a ako sme si už zvykli, vynecháme zátvorky:

x = 5

if x == 5
  alert 'ano'
else if x is 4 or x is 6
  alert 'těsně vedle'
else
  alert 'ne'

JavaScript:

var x;

x = 5;

if (x === 5) {
  alert('ano');
} else if (x === 4 || x === 6) {
  alert('těsně vedle');
} else {
  alert('ne');
}

Na kódu môžeme vypozorovať, že CoffeeScript prevádza == na ===. Núti vás teda explicitne prevádzať hodnoty, ak napr. Chcete, aby sa string '40' rovnal číslu 40. Tiež pridáva aliasy rôznym operátorom (or je ||, is ich === atď.), Aby kód skutočne pripomínal skôr jazyk než súbor matematických zápisov. Môžete však používať operátormi ako ich poznáte z JS. Tabuľku s rôznymi operátormi nájdete na konci článku.

Z Ruby si CoffeeScript vypožičal kľúčové slovo unless, ktoré je vlastne len if not a môžeme použiť aj slovo then, aby sa to pekne vošlo na jediný riadok:

unless false then console.log 2     # Vždy vypíše do konzole číslo 2.

Niekedy môžete chcieť vložiť do premennej hodnotu len vtedy, keď je splnená podmienka. K tomu môžete použiť postfixový tvar:

kafe = 'Instant' if maloCasu

JavaScript:

var kafe;
if (maloCasu) {
  kafe = 'Instant';
}

Keď priradíme vetvenia k premennej, CoffeeScript ho prevedie na ternárne operátor:

nalada = if den is 'vsedni' and not prazdniny then 'spatna' else 'dobra'

JavaScript:

var nalada;
nalada = den === 'vsedni' && !prazdniny ? 'spatna' : 'dobra';

Znalci Pythone spoznajú zreťazené porovnávanie premenných, ktoré CoffeeScript tiež podporuje:

if x > y < z >= a <= b is c isnt d
 console.log 'eh...ok...'

JavaScript:

if ((((((x > y && y < z) && z >= a) && a <= b) && b === c) && c !== d)) {
  console.log('eh...ok...');
}

Existenčné operátor

Ak chceme zistiť, či je premenná / objekt definovaný (a) a nie je null, môžeme použiť tzv. Existenčnú operátor - ? (nepliesť s ternárním operátorom z iných jazykov), ktorý vracia true v prípade, že premenná nie je null alebo undefined.

alert 'To je katastrofa!' unless kavovar?

JavaScript:

if (typeof kavovar === "undefined" || kavovar === null) {
  alert('To je katastrofa!');
}

Možno použiť aj priradenie hodnoty do premennej v prípade, že premenná nie je null (musí byť však deklarovaná):

x = undefined
x ?= 5

JavaScript:

var x;
x = void 0;
if (x == null) {
  x = 5;
}

Pozor! Na rozdiel od JS je v CoffeeScript slovo undefined kľúčové, nemôžete mať teda premennú s týmto menom.

Existenčné operátor ide použiť samozrejme aj na objekty a funkcie, takže možno tvoriť klenoty ako:

objekt?.funkce? parametr if parametr?

JavaScript:

if (typeof parametr !== "undefined" && parametr !== null) {
  if (typeof objekt !== "undefined" && objekt !== null) {
    if (typeof objekt.funkce === "function") {
      objekt.funkce(parametr);
    }
  }
}

Tu už to začína byť naozaj nechutné a to sme ani nenakousli OOP.

Switch

Dostali sme sa k poslednej dôležité časti vetvenia a tou je samozrejme switch. Jeho syntax v CoffeeScriptu je nasledovné:

switch spanek
  when 'spatny' then mnozstviKofeinu = 'hodne'
  when 'prumerny' then mnozstviKofeinu = 'malo'
  when 'dobry' then do nepijKafe
  else alert '???'

JavaScript:

var mnozstviKofeinu;

switch (spanek) {
  case 'spatny':
    mnozstviKofeinu = 'hodne';
    break;
  case 'prumerny':
    mnozstviKofeinu = 'malo';
    break;
  case 'dobry':
    nepijKafe();
    break;
  default:
    alert('asi nespíš a jsi robot');
}

Pomocou switche možno tiež priraďovať hodnoty namiesto niekoľkých if / else:

bodu = 83
znamka = switch
 when bodu < 60 then 5
 when bodu < 70 then 4
 when bodu < 80 then 3
 when bodu < 90 then 2
 else 1
# znamka === 2

JavaScript:

var bodu;
bodu = 83;

znamka = (function() {
  switch (false) {
    case !(bodu < 60):
      return 5;
    case !(bodu < 70):
      return 4;
    case !(bodu < 80):
      return 3;
    case !(bodu < 90):
      return 2;
    default:
      return 1;
  }
})();

Cykly

While

Základná while cyklus:

while podminka
 alert 'Cykluju...'         # 'bezna' forma

alert 'Cykluju...' while podminka   # postfix forma

Oba kódy sa skompiluje do:

while (podminka) {
  alert('Cykluju...');
}

Podobne ako unless je if not, until je while not:

alert 'Cykluju a podminka neni pravdiva...' until podminka

JavaScript:

while (!podminka) {
  alert('Cykluju a podminka neni pravdiva...');
}

Buďte s until i unless opatrní a nepridávajte do podmienok negácia, kód sa bude zle čítať. Tiež by sa s týmito slovami nemalo používať else.

Pomocou loop vytvoríme nekonečný cyklus:

loop
  alert 'Nekončíííím...'

JavaScript:

while (true) {
  alert('Nekončíííím...');
}

Keď som v minulom diele písal, že "Čo ide v JS, ide aj v CoffeeScriptu", nebola to tak celkom pravda, ako (nielen) teraz uvidíte. CoffeeScript nemá do-while cyklus, keďže slovo do v CoffeeScriptu znamená 'volej funkciu', ide ho však ľahko nahradiť nasledovným zápisom:

loop
  ### tělo cyklu ###
  break unless podminka

JavaScript:

while (true) {
  /* tělo cyklu */
  if (!podminka) {
    break;
  }
}

Pomocou cyklu možno vytvárať pole:

cislo = 10
pole = while cislo--
  cislo

# pole = [9, 8, 7, 6, 5, 4, 3, 2, 1, 0]

JavaScript:

var cislo, pole;
cislo = 10;

pole = (function() {
  var _results;
  _results = [];
  while (cislo--) {
    _results.push(cislo);
  }
  return _results;
})();

A keď chceme, aby cyklus (ne) prechádzal určitými hodnotami, použijeme slovo when. Toto sa nám bude obzvlášť hodiť neskôr pri for-in a for-of cykloch. Tento kód vám podobne ako v minulom príklade vytvorí pole, ale bez párnych čísel:

cislo = 10
pole = while cislo-- when cislo % 2 isnt 0
  cislo
# pole = [9, 7, 5, 3, 1]

Časť JS kódu po úprave:

//...
  while (cislo--) {
    if (cislo % 2 !== 0) {
      _results.push(cislo);
    }
  }
//...

For

Pre základné for cyklus použijeme nám už známe n-tica:

for [1..10]     # dvě tečky <=
  console.log 'a'

for [1...10]        # tři tečky <
  console.log 'a'

JavaScript:

var _i, _j;

for (_i = 1; _i <= 10; _i++) {
  console.log('a');
}

for (_j = 1; _j < 10; _j++) {
  console.log(_j);
}

Keby sme chceli vypísať číslo, ktoré je zrovna prechádzaní cyklom:

for i in [1..10]
  console.log i

V JS for cyklu bude nasledujúci:

for (i = _i = 1; _i <= 10; i = ++_i)

Nie je to zrovna najelegantnejší riešenie, ale tá premenná navyše snáď nikoho nezabije. Mohli by ste samozrejme premennú aj nahradiť _i, avšak pre každý ďalší cyklus sa tvorí nová premenná (_j, _k atď ...), a v .coffee súbore ju nevidíte, mohli by ste s týmto spôsobom naraziť.

Nechceme vždy riadiaci premennú cyklu zvyšovať o 1, máme našťastie k dispozícii slovo by:

for i in [50..0] by -5

JavaScript:

for (i = _i = 50; _i >= 0; i = _i += -5)

Cyklus for-in v CoffeeScriptu používame aj na pole (Pozor! Toto je veľký rozdiel oproti JavaScriptu, kde je tento cyklus používaný na objekty). Ukážeme si príklad na známom poli s kávami a nebudeme chcieť rozpustnú:

kavy = ['Alžírská', 'Espresso', 'Cappuccino', 'Latte', 'Rozpustná', 'Vídeňská']

console.log kava for kava in kavy when kava isnt 'Rozpustná'

JavaScript:

var kava, kavy, _i, _len;
kavy = ['Alžírská', 'Espresso', 'Cappuccino', 'Latte', 'Rozpustná', 'Vídeňská'];

for (_i = 0, _len = kavy.length; _i < _len; _i++) {
  kava = kavy[_i];
  if (kava !== 'Rozpustná') {
    console.log(kava);
  }
}

Od ES6 existuje cyklus for-of pre pole, CoffeeScript však volí toto riešenie kvôli kompatibilite. Čo je teda ekvivalentom for-in v CoffeeScriptu? Ironicky je to for-of. Pre príklad si vypožičiame kaviareň z prvého dielu:

kavarna =
 jmeno: "Kofeinová pumpa"
 rokZalozeni: 2001
 freeWifi: yes
 napojovyListek:
  kavy: [
   "Cappuccino"
   "Moccaccino"
   "Espresso"
  ]
  nealko: [
   "Sprite"
   "Pomerančový džus"
   "Voda z Marsu"
  ]

for nazev, hodnota of kavarna
 console.log "#{nazev} => #{hodnota}"

# jmeno => Kofeinová pumpa
# rokZalozeni => 2001
# freeWifi => true
# napojovyListek => [object Object]

Samotný cyklus v JS:

for (nazev in kavarna) {
  hodnota = kavarna[nazev];
  console.log("" + nazev + ": " + hodnota);
}

Čo keby sme chceli vypísať prvých päť vlastností v objekte? Ani to nie je problém:

console.log (nazev for nazev of document)[0...5]
# vytvoří pole a vypíše: ["vlinkColor", "linkColor", "alinkColor", "fgColor", "bgColor"]

Nedávajte medzeru medzi pravou guľatou a ľavú hranatú zátvorku, program by potom robil niečo úplne iné. Hlavne si zapamätá - v JavaScripte používame of na pole, in na objekty, v CoffeeScriptu je to naopak.

Uf, tak sme sa dostali ku koncu. Nabudúce sa pozrieme na hlavné pilier JavaScriptu - funkcie. Na záver tu máte tabuľku s operátormi, ako som sľúbil:

is, ==	===
isnt,! =	! ==
not	!
and	&&
or	||
in	nie je prekladaný (of)
of	in
a // b	Math.floor (a / b)
a %% b	(A% b + b)% b)