将Coffeescript Underscore.js和Backbone.js放在一起

时间:2012-03-12 19:06:15

标签: backbone.js coffeescript underscore.js

TLDR; http://jsfiddle.net/squarism/zaVrE/

我是Backbone.js和Underscore.js的新手(我认为Underscore包含在Backbone中)。我在一个rails应用程序中使用它,但它的一点不/不重要。我正在关注主干上的Railscast两部分剧集。我正在尝试下划线,骨干,coffeescript,调试和每个人的文档。令人困惑的是Underscore API和coffeescript版本之间的差异。

例如:我有一个User对象数组作为'entries'。每个都有一个胜利者属性。所以这将有效:

# why does this return everyone?
non_winners = @select(entries) ->
  @get('winner') == false

所以这里有很多事情要发生。 @select来自下划线。 @get来自骨干。所有这些都是coffeescript。将其转换为JS调试行有点疯狂。最终虽然我确实找出了骨干以外的javascript来测试它。我的问题是文档:

文档说:

filter_.filter(list, iterator, [context]) Alias: select 

我不知道怎么读这个。我刚刚调用@select,我认为它等同于.select(),但我没有给它一个迭代器。在浏览器控制台上的Javascript中,它仅返回一个数组,其中包含wins为false的对象。在我的应用程序中,如果我是console.log(non_winners),它会让我回复所有人,但是console.log(non_winners.length)符合我的预期(即:如果我有一个胜利者,那就是1)。在我学习的过程中,这种差异确实令人困惑。

entries = [
  { name: 'Joe', winner: false },
  { name: 'Bob', winner: false },
  { name: 'Henry', winner: true }
]

# here's an example from my app
#non_winners = @select (entries) ->
#  @get('winner') == false

# here's an example from the API
#evens = _.filter [1..6], (num) -> num % 2 is 0

# here's something that works
non_winners = _.select entries, (entry) ->
  entry.winner is true

我发现一些令人困惑的事情:

  1. 人们如何实际调试这个疯狂的组合。 Coffeescript,Underscore,Backbone,哦,我的!在我理解一切之前,我想玩它。 JSfiddle(下面)很不错但是有没有希望使用浏览器控制台?
  2. 你如何翻译@select()业务(@是coffeescript的自我别名权利,指向Backbone集合?)来强调_.select()api文档?论证的顺序是不同的。
  3. 在上面的例子中(以及下面的小提琴),只返回一个人。但在我的应用程序中,所有人都被退回。
  4. 我可以让一个人在小提琴中返回,但语法与railscast(#323)中的示例不同。
  5. 在小提琴中工作的代码仍然与下划线API文档不匹配。我想学习如何阅读下划线文档(学习捕鱼与单鱼等)。
  6. 你可以看到这个: http://jsfiddle.net/squarism/zaVrE/

1 个答案:

答案 0 :(得分:6)

从你的实际代码中你的问题是什么并不是很清楚。我认为这里的主要问题是@get('winner'),相当于this.get('winner')。您正在调用集合方法而不是入口方法。 @只是this(或函数情况下为this.)的替代品。你的代码应该是

non_winners = @select (entry) ->
  entry.get('winner') == false

_只是一个包含许多方法的对象(包括select)。 Backbone.js集合对象恰好包含了Underscore方法。

就调试而言,绝大多数时候将浏览器中的JS映射到CoffeeScript代码是微不足道的。有时JS输出不是您所期望的,因为缩进错位或没有括号。这也很容易调试 - 只需看看JS输出。

Underscore.js和Backbone.js只是JS库,所以你可以检查(或调试)他们的代码。这很干净,很直接。