帮酷LOGO
0 0 评论
文章标签:coffee  bea  COFF  Coffeescript  

我想用漂亮的方式写JavaScript 。

CoffeeScript是一种漂亮的编程语言,它允许编写像ruby,python这样的代码。

我在CoffeeScript中发现一些很好的技巧和有用的语法,所以想分享它们。

使用@而不是this

通常我们编写this来引用对象/元素


$('.account-link').click ->
 alert($(this).html())

我们可以用@


$('.account-link').click ->
 alert($(@).html())

调用类实例方法,我们也可以使用@,


class Calculation
 sum: (a, b)->
 @print_sum(a+b)

 print_sum: (total)
 console.log("Total is #{total}")

p = new Person
p.sum()

一些有用的操作符

CoffeeScript给操作符的别名很漂亮,它让我们觉得在写英语句子。

is和isnt

例如检查布尔值

在JavaScript中我们喜欢


var a;

a = true;

if (a === true) {
 alert('rays');
}

但在CoffeeScript中我们可以


a = true
alert('Rays') if a is on

is===on别名用于true。 我们也可以在true中使用yes


a = true
alert('Rays') if a is yes


a = false
alert('Rays') if a isnt yes

链式比较

如果我们需要比较一个变量和两个值,我们在JavaScript中


a = 5
a > 1 && a > 4

CoffeeScript中


a = 5
1 < a > 4

我知道这跟Python里的一样

运算符?

如果我们想检查nullundefined


if (a!=null && typeof a!='undefine')
 alert('rays')

在CoffeeScript中只


alert('rays') if a?

JavaScript检查a不是0


if (a!=null && typeof a!== 'undefine' && a!=0)
 alert('rays')

CoffeeScript中


alert('rays') if(a?=0)

 
object?.sum()

 

Ruby中的try类似

...

例如


printAddress = (address1, address2...) ->
 alert("#{address1} #{address2.join(',')}")

printAddress('12', 'Mansarover', 'Jaipur')

同样我们在调用函数时也可以


printAddress = (address1, address2..) ->
 alert("#{address1} #{address2.join(',')}")

printAddress(['12', 'Mansarover', 'Jaipur']...)

列表推导

有时我们需要在循环中设置条件 ,例如


for book in books
 alert(book.name) if book.price > 18

我们可以使它简短。


alert((book.name) for book in books when book.price > 18

现在看起来是不是很漂亮?

=

在CoffeeScript中,我们有=->用于函数,它还有=如果我们需要调用JavaScript事件,并想使用类实例变量,那么我们需要使用=


class Person
 constructor: () ->
 @name = 'rashmi'
 
 print_name: ->
 $('.show_name').click =>
 alert(@name)
 
p = new Person
p.print_name()

我相信你在写CoffeeScript时也会发现这些技巧



文章标签:bea  coffee  COFF  Coffeescript  

Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语