クラス
class Animal
constructor:(name) -> @name = name
say:(word) -> console.log "#{@name} said: #{word}"
class Dog extends Animal
constructor:(name) -> super name
say:(word) -> super "Bowwow, #{word}"
dog = new Dog("Bob")
dog.say("hello")
#### 静的なプロパティ クラスの静的なプロパティを定義するには変数名の頭に@を付けます。
class Dog
@TYPE_CHIHUAHUA = 1
コンパイル結果↓
var Dog;
Dog = (function() {
function Dog() {}
Dog.TYPE_CHIHUAHUA = 1;
return Dog;
})();
クラスの静的なプロパティの使い方というか、そもそもJsのオブジェクト指向、クロージャの実装がしっかりと理解していない。ここは後日勉強する。
無名関数
setTimeoutなど引数に無名関数を渡したい場合は、次の行頭にカンマを付けます。
setTimeout ->
console.log("ok")
,1000
コンパイル結果↓
setTimeout(function() {
return console.log(“ok”);
},1000);
コンパイルせずに、直接CoffeeScriptを記述する方法
本家サイトに置いてある、「coffee-script.js」を読み込んで、scriptタグ 「script type=“text/coffeescript”」で囲むと、直接CoffeeScriptが記述できる。
<script type="text/javascript" src="http://coffeescript.org/extras/coffee-script.js"> </script>
<script type="text/coffeescript">
hogehoge...
</script>
CoffeeScriptで、Jqueryを使う
これは、とくに考えずに、そのままCoffeeScriptで記述するだけ。 Jsで書くより、カッコの入れ子がなくなり読みやすくなる。
<script type="text/coffeescript">
$('#add-more').click ->
$('#add-more').hide()
$('#task-add').fadeIn()
</script>
参考サイト
以下のサイトを参考にさせていただきました。ありがとうございます！