Question

i just started to learn coffeescript and it’s great, but it’s tricky..

i try to translate code, that worked in javascript to coffeescript

and i fail alot, in a link i posted 3 pastes

1. js.js is original code that working
2. cs.coffee is same version, but in coffeescript
3. compiled.js translated by cs compiler version of js

in translated js i got an error of “String is not a function” somewhere in a lambda that returns to map

gist source code link

Answer 1

1. coffeescript’s @ is just shorthand for this.

So where your original js has:

if (input1.val().length <= 4 ...

your coffeescript should have

if   input1.val() <= 4 

1. Where you have $(this) in your original js, you still need $(this) in your coffeescript. So

   or @input1.map(-> this.val().match(/\s+/g)).length not 0

should be:

or   @input1.map(-> $(this).val().match(/\s+/g)).length not 0

I can’t offhand see any other issues – try it and let’s see if that gets it working, or if there are still errors.

[Edit]

There were other issues, largely related as mentioned to the not 0 and also to bracketing. Here’s a working (I think) coffeescript:

    if input1.val() <= 4 \
    or (input1.map(-> $(this).val().match(/\s+/g)).length != 0) \
    or (input1.map(-> $(this).val().match(/[^A-Za-z0-9]/g)).length != 0)
    then input1.attr('id','error-highlight');
    else input1.attr('id','success-highlight');

It becomes:

  (function() {
    if (input1.val() <= 4 || (input1.map(function() {
      return $(this).val().match(/\s+/g);
    }).length !== 0) || (input1.map(function() {
      return $(this).val().match(/[^A-Za-z0-9]/g);
    }).length !== 0)) {
      input1.attr('id', 'error-highlight');
    } else {
      input1.attr('id', 'success-highlight');
    }
  }).call(this);

Which looks about right.