65

What's the best way to chain methods in CoffeeScript? For example, if I have this JavaScript how could I write it in CoffeeScript?

var req = $.get('foo.htm')
  .success(function( response ){
    // do something
    // ...
  })
  .error(function(){
    // do something
    // ...
  });
0

4 Answers 4

70

Using the latest CoffeeScript, the following:

req = $.get 'foo.html'
  .success (response) ->
    do_something()
  .error (response) ->
    do_something()

...compiles to:

var req;
req = $.get('foo.html').success(function(response) {
  return do_something();
}).error(function(response) {
  return do_something();
});
Sign up to request clarification or add additional context in comments.

2 Comments

This is awesome. Thank you, a language that puts the operator first on the next line rather than awkward trailing syntaxes. Hooray!
worth noting that the parens are no longer necessary around the 'foo.html' in Coffeescript 1.7 (see my answer below)
37

There are two approaches you can take: The best "literal" translation to CoffeeScript is (in my opinion)

req = $.get('foo.htm')
  .success((response) ->
    # do something
  )
  .error( ->
    # do something
  )

The other approach is to move the inline functions "outline," a style that Jeremy Ashkenas (the creator of CoffeeScript) generally favors for non-trivial function arguments:

onSuccess = (response) ->
  # doSomething

onError = ->
  # doSomething

req = $.get('foo.htm').success(onSuccess).error(onError)

The latter approach tends to be more readable when the success and error callbacks are several lines long; the former is great if they're just 1-2 liners.

1 Comment

+1 for the "outline" tip, definitely keeps the code more readable.
11

I sometimes prefer having fewer parentheses as opposed to chaining, so I'd modify Trevor's last example:

req = $.get 'foo.htm'
req.success (response) -> # do something
req.error -> # do something

1 Comment

This is not the same as chaining, as req object is being used each time
9

As of Coffeescript 1.7, chaining has been significantly simplified, and you shouldn't need any of the parens-related workarounds mentioned here. Your above example can now be written as

req = $.get 'foo.htm'
.success ( response ) ->
  alert "success"
.error ->
  alert "error"

Which compiles to

var req;

req = $.get('foo.htm').success(function(response) {
  return alert("success");
}).error(function() {
  return alert("error");
});

You can see an explanation of this and other CS 1.7 features here: https://gist.github.com/aseemk/8637896

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.