Comment by andrewingram | Hacker News Reader

Comment by andrewingram | Hacker News Reader

Parent Full thread

A few years ago I made an email campaign editor using JavaScript, I re-implemented it in CoffeeScript a few months ago. What I now want to do is re-implement it in the good JavaScript I've learned from reading the code that CoffeeScript generates.

There are some annoying parts of CoffeeScript. If your function takes callbacks as the first parameters, and another value as the second (such as setTimeout), you end up with some really awkward syntax. I've seen a lot of people define a delay method that swaps the parameters of setTimeout just so it's easier to use with CoffeeScript.

Like the author of the article, I have a Python background, but I've also written a lot of JavaScript, I love the syntactic sugar that CoffeeScript brings, but I hate reading CoffeeScript code. The project that my re-implemented email editor is used in has a hybrid of JavaScript and CoffeeScript code, and I'm not kidding when I say that everyone (myself included) groans when they have to work on the CoffeeScript parts.

    > If your function takes callbacks as the first parameters, 
    > and another value as the second (such as setTimeout), 
    > you end up with some really awkward syntax.

Hopefully no more awkward than the equivalent call in JavaScript.

    setTimeout (-> alert "later"), 300

Versus:

    setTimeout(function(){ alert("later"); }, 300);

Or, on multiple lines:

    setTimeout(-> 
      alert "later"
    , 300)

    setTimeout(function(){ 
      alert("later"); 
    }, 300);

But here we're introducing brackets just to avoid the syntax ambiguity. The Pythonista in me is crying out for a single way of doing things, either require brackets or don't. It makes me want to go down the road of always using parenthesis in CoffeeScript, but then it'll feel like I'm not using the language in an idiomatic way (which is something I hate doing).

In my mind, this usage of parenthesis is less ambiguous. Parenthesis are used in C-like languages for both function calls and order of operations. That is to say, they are used in these two ways:

    foo(a, b, c)  // functions
    (a + b) * c   // order of operations

Making parenthesis optional for function calls means parenthesis are used instead for just controlling order of operations.

In practice, CoffeeScript can't always guess when something is a function call (such as a function call without arguments), so you end up mixing in some function call usage no matter what.

I really hope it isn't guessing anything...

Personally, I prefer

    setTimeout -> (
      alert "later"
      alert "later"
      alert "later"
      ), 300

to

    setTimeout(-> 
      alert "later"
      alert "later"
      alert "later"
      , 300)

I think it's much more clear and close to how we write JS code:

    setTimeout(function() {
      alert("later");
      alert("later");
      return alert("later");
    }, 300);

In my experience I would find myself frequently falling back to explicit brackets and more traditional Javascript syntax when I wasn't sure how to construct the statement. Which was okay (I wasn't stumped), but it happened fairly often. Your multiple line example (without "function") is the kind of thing I wouldn't be able to create on my own – both the indentation and comma have to be in just the right place, and the rules that govern that are not very clear. Or rather, it seems to be the one thing that works given a bunch of rules that are interacting in that particular situation. And each time I'd get something like that wrong it'd probably compile, but then I'd have to read the generated source to see what I'd actually done.

As for `delay`... I had to think hard to think why would it be a bad idea and concluded that it is non-standard and can confuse readers. If this is the case then just define a `swap` or `flip` function, along the lines of

    flip f = (a, b) -> f(b, a)

and use it inline:

    flip(setTimeout) 300, -> "it's fun!"

Sweet ;)

Making the callback the last parameter is very common in JavaScript too. It just makes things look nicer when you want to put anonymous functions in there. Underscore.js does this for all their functions.

To me, this says that you should define your callback as a function, and pass the function. If you're used to how to write functional code, this can be a clean way to do things.

That said, I've seen the same problem myself.

Reply on news.ycombinator.com