1. COFFEESCRIPT
счастье для javascript разработчика
Иван Немытченко Омск, 26 июня 2010

2. JAVASCRIPT

3. var a = "3";
2+a-a-2 ==

4. var a = "3";
2+a-a-2 == 18

5. '' == '0' // false
0 == '' // true
0 == '0' // true

6. '' == '0' // false
0 == '' // true
0 == '0' // true
false == 'false' // false
false == '0' // true

7. '' == '0' // false
0 == '' // true
0 == '0' // true
false == 'false' // false
false == '0' // true
false == undefined // false
false == null // false
null == undefined // true

8. '' == '0' // false
0 == '' // true
0 == '0' // true
false == 'false' // false
false == '0' // true
false == undefined // false
false == null // false
null == undefined // true
' trn ' == 0 // true
NaN === NaN // false

9. typeof(1) // "number"
typeof('a') // "string"
typeof({a:1}) // "object"

10. typeof(1) // "number"
typeof('a') // "string"
typeof({a:1}) // "object"
typeof([1,2]) // "object"
typeof(null) // "object"

11. typeof(1) // "number"
typeof('a') // "string"
typeof({a:1}) // "object"
typeof([1,2]) // "object"
typeof(null) // "object"
typeof(false) // "boolean"
typeof(new Boolean(false)) // "object"

12. if(a == b)
c = 3;

13. if(a == b)
c = 3;
doSomething();

14. if(a == b)
c = 3;
doSomething();
if(a == b){
c = 3;
doSomething();
}

15. if(a == b)
c = 3;
doSomething();
if(a == b){
c = 3;
}
doSomething();

17. глобальные переменные
точка с запятой
прототипное
наследование
with
switch
eval

18. JAVASCRIPT
ПЛОХОЙ КОД
ЛЕГКО ПИСАТЬ

19. JAVASCRIPT
ХОРОШИЙ КОД
СЛОЖНО ПИСАТЬ

20. JAVASCRIPT
ХОРОШИЙ КОД
СЛОЖНО ЧИТАТЬ

21. JAVASCRIPT
var _a, _b, age, ages, child;
var __hasProp = Object.prototype.hasOwnProperty;
ages = (function() {
_a = []; _b = years_old;
for (child in _b) { if (__hasProp.call(_b, child)) {
age = _b[child];
_a.push(child + " is " + age);
}}
return _a;
})();

22. COFFEESCRIPT
INSPIRED BY

23. COFFEESCRIPT
INSPIRED BY

24. COFFEESCRIPT
INSPIRED BY

25. Все является выражением

26. Условия

27. Условия

28. Функции

29. Объекты

30. Произвольное кол-во параметров
race: (winner, runners...) ->
print winner, runners

31. Проверка на существование
alert "Yay!" if margincon?
if ((typeof margincon !== "undefined"
&& margincon !== null)) {
alert("Yay!");
}

32. Интервалы (ranges)
numbers: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
three_to_six: numbers[3..6]
numbers_copy: numbers[0...numbers.length]
numbers[3..6]: [-3, -4, -5, -6]

33. Проход по массиву (итерации)
cubed_list: math.cube num for num in list
countdown: num for num in [10..1]

34. Проход по хэшу (свойствам объекта)
years_old: {max: 10, ida: 9, tim: 11}
ages: for child, age of years_old
child + " is " + age

35. Присвоение по паттерну
bait: 1000
and_switch: 0
[bait, and_switch]: [and_switch, bait]

36. Строки
moby_dick: "Lorem ipsum dolor var moby_dick;
sit amet, consectetur moby_dick = "Lorem ipsum dolor
adipiscing elit." sit amet, consectetur
adipiscing elit.";
html: ''' var html;
<strong> html = '<strong>n cup of
cup of coffeescript coffeescriptn</strong>';
</strong>
'''
author: "Wittgenstein"
quote: "A picture is a fact. -- $author"
sentence: "${ 22 / 7 } is a decent approximation of π"

37. Наследование

38. Наследование
Base2
PrototypeJS
JS.Class

39. brain-safe way
Наследование
class Animal
move: (meters) ->
alert @name + " moved " + meters + "m."
class Snake extends Animal
constructor: (name) ->
@name: name
move: ->
alert "Slithering..."
super 5

40. Собери всю коллекцию!
HTML
CSS
JAVASCRIPT

41. HTML
<article id='id1'>
<section class='a1'>
Lorem ipsum
</section>
<section class='a2'>
Sit dolor
</section>
</article>

42. HTML → HAML
%article#id1
%section.a1
Lorem ipsum
%section.a2
Sit dolor

43. CSS
article {
margin: 2em 0;
}
article section {
text-align: right;
}

44. CSS → SASS
article
margin: 2em 0
section
text-align: right

45. JAVASCRIPT
var margincon;
margincon = {
date: "26.06.2010"
};
if ((typeof margincon !== "undefined"
&& margincon !== null)) {
alert("Yay!");
}

46. JAVASCRIPT → COFFEESCRIPT
margincon: {date: "26.06.2010"}
alert "Yay!" if margincon?

47. HTML → HAML
CSS → SASS
JAVASCRIPT → COFFEESCRIPT

48. HTML → HAML
CSS → SASS
JAVASCRIPT → COFFEESCRIPT
JSON → TEQUILA

49. COFFEESCRIPT
.coffee → .js

50. COFFEESCRIPT

51. COFFEESCRIPT

52. УСТАНОВКА
Node.js
http://github.com/jashkenas/coffee-script
sudo bin/cake install

53. УСТАНОВКА
Node.js
http://github.com/jashkenas/coffee-script
sudo bin/cake install
brew install coffee-script

54. УСТАНОВКА
...
<script type="text/coffeescript">
alert "Inline scripting!"
</script>
...

55. thnx to @drnic

56. http://coffeescript.org
http://jazzcloud.net
http://twitter.com/inem