理解coffeescript语法答案

【问题标题】：understanding coffeescript syntax理解coffeescript语法
【发布时间】：2012-05-07 13:57:56
【问题描述】：

我是 CoffeeScript 的新手，我无法理解它的某些语法。

例如，在这个函数调用中：

e('')
    .color('rgb(255,0,0)')
    .attr( x: 20,
           y: 100,
           w: 10,
           h: 100 )

我希望这可以编译 JS 代码，该代码将带有键 x、y、w、h 的对象传递给 attr 方法。但是这段代码实际上编译成这样：

e('').color('rgb(255,0,0)').attr({
  x: 20
}, {
  y: 100,
  w: 10,
  h: 100
});

它将两个对象传递给attr，第一个使用键x，第二个使用键y、w 和h。我无法理解为什么 x 与其他键分开，但其他键没有彼此分开？

由于我想通过attr方法一个对象，我尝试了这个：

e('')
    .color('rgb(255,0,0)')
    .attr({x: 20,
           y: 100,
           w: 10,
           h: 100})

但这给了我y: 100 所在行中的编译错误：Error: Parse error on line 4: Unexpected '{'。奇怪的是，第 4 行中没有 {。我也尝试删除 attr 中的括号，但仍然出现相同的错误。

我可以用这个解决它：

e('')
    .color('rgb(255,0,0)')
    .attr(
           x: 20,
           y: 100,
           w: 10,
           h: 100)

如果我在 .attr( 之后删除换行符，那么我在第一个示例中会得到相同的代码，这不是我想要的。

现在我想知道我是否误解了 CoffeeScript 语法中的某些要点，或者其中确实有一些奇怪的东西。还是我在 CoffeeScript 中发现了一个错误？有什么想法吗？

我使用的是 CoffeeScript 1.3.1

【问题讨论】：

【解决方案1】：

在coffeescript 中，空格很重要。你不能把事情排在你认为应该去的地方。试试这样的：

e('')
  .color('rgb(255,0,0)')
  .attr(
    x: 20
    y: 100
    w: 10
    h: 100
  )

编辑：如果你想让 x 与方法调用在同一行，你只需要正确缩进：

e('')
    .color('rgb(255,0,0)')
    .attr(x: 20,
    y: 100,
    w: 10,
    h: 100)

【讨论】：

嗯，所以删除对象文字中的逗号是可行的。谢谢。我仍在寻找编译器错误的答案，以及为什么在我的第一个示例中只有 x 与其他键分开。
我相信它被分开的原因是因为第一个参数与方法调用放在同一行。换行符使编译器假定第二组变量。这种假设适用于具有这种签名 methodName(param1, param2, objOrCallback) 的方法
x 分开的原因是因为有重要的空格。你缩进错了。
@Sandro，我不确定。 : 字符在参数语法中无效。它不应被解释为参数。
确定它是有效的，它只是意味着你正在创建一个对象。

【解决方案2】：

这就是你要找的东西：

e('')
  .color('rgb(255,0,0)')
  .attr
    x:20
    y:100
    w:10
    h:100

编译为：

e('').color('rgb(255,0,0)').attr({
  x: 20,
  y: 100,
  w: 10,
  h: 100
});

请记住，CoffeeScript 是关于简单性并避免使用花括号和逗号...

【讨论】：

【解决方案3】：

显而易见的解决方案是将对象放在一行中，如.attr({x: 20, y: 100, w: 10, h: 100})。（虽然还没有测试过，但我不明白为什么它不起作用）。

虽然您有时不能使用方括号，但我更喜欢在函数调用中使用它们，因为我发现它更具可读性。

【讨论】：