Javascript a CSS končí?

Co mají společného Javascript a CSS? Každý, kdo s nimi delší dobu pracuje, dokáže vyjmenovat, jak by se oba jazyky daly vylepšit. Někteří vzali vylepšování do svých rukou, a tak vznikl CoffeeScript a Sass.

CoffeeScript
CoffeeScript je jazyk inspirovaný Ruby a Pythonem, odstraňuje nedostatky JS a přidává některé užitečné nové funkce. Namátkou
Comprehensions

countdown = (num for num in [10..1])

Nové operátory is, isnt, not, and, or, existenční operátor ?

if band?
    volume = 10 if band isnt SpinalTap

Pohodlnější práci s třídami a objekty, bezpečnější deklaraci proměnných (globální proměnné už nelze deklarovat omylem, zapomenutím var, ale pouze explicitně) atd.

CoffeeScript se překládá přímo do JS.

Sass
Sass je nadmnožina CSS, která z čistě deklarativního CSS dělá procedurální jazyk s proměnnými a funkcemi. Umožňuje třeba definovat základní hodnoty do proměnných a provádět s nimi psí kusy pomocí specializovaných funkcí

$margin: 16px;
$blue: #3bbfce;
.border {
  padding: $margin / 2;
  margin: $margin / 2;
  border-color: darken($blue, 9%);
}

Vytvořit základní, opakující se deklarace a měnit je

@mixin left($dist) {
  float: left;
  margin-left: $dist;
}

#data {
  @include left(10px);
}

Nebo dědit vlastnosti od dřív definovaných selektorů

.error {
  border: 1px #f00;
  background: #fdd;
}
.badError {
  @extend .error;
  border-width: 3px;
}

Sass se překládá do CSS.

Nepřehání ale zprávy o smrti JS a CSS?
Rails, jeden z významných frameworků pro tvorbu webových aplikací, se rozhodl ve verzi 3.1 přejít právě na CoffeeScript a Sass. Tím jsou obě nadstavby definitivně legitimní součástí vývojářských nástrojů.

Nahrazení JS a CSS začíná.

Příspěvek byl publikován v rubrice Nezařazené. Můžete si uložit jeho odkaz mezi své oblíbené záložky.

4 komentáře u Javascript a CSS končí?

  1. Rammi napsal:

    Co je špatného na
    if(band && band != ‘SpinalTap’)
    volume = 10;

    ???

  2. Martin napsal:

    Lidi používají
    if(variable)
    pro testování existence proměnné, ale to funguje chybně v případě, kdy proměnná existuje a má hodnotu false, prázdný řetězec nebo 0.

    variable?
    v CoffeeScriptu se přeloží na
    if(typeof variable != "undefined" && variable !== null)

    Takže se správným testem existence můžeš napsat
    if(typeof band != "undefined" && band !== null && band !== 'SpinalTap') {
    volume = 10;
    }

    v JS, nebo
    volume = 10 if band? and band isnt 'SpinalTap'
    v CS.

    CS je expresivnější (méně psaní na stejnou funkčnost) a líp se čte.

  3. Rammi napsal:

    OK, tak pojďme hardcore ;)

    volume = (window.band === ‘SpinalTap’)?volume:10;

Napsat komentář

Vaše emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *

*

Můžete používat následující HTML značky a atributy: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>