4 ms·
While I like CoffeeScript, I feel I need to note that this isn't really a great example - in fact, I'd call it an incorrect example: var elem, formValues;
by Klonoar 16y ago
While I like CoffeeScript, I feel I need to note that this isn't really a great example - in fact, I'd call it an incorrect example:
var elem, formValues;
formValues = (function() {
var _i, _len, _ref, _results;
_ref = $('.input');
_results = [];
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
elem = _ref[_i];
_results.push(elem.value);
}
return _results;
})();
That's... needlessly bad, so to speak. That could be rewritten in a much more readable fashion, like so:
var formValues = (function(inputEls) {
var results = [];
inputEls.each(function() {
results.push($(this).val());
});
return results;
})($('.input'));
If CoffeeScript is generating the first block seen here, then I'd actually be concerned, but perhaps I care more about this than some. Either way, while...
formValues = (elem.value for elem in $('.input'))
...is certainly nicer, I don't really think it's necessary to further bastardize the views held on Javascript syntax in general. The first block in this comment is, to put it bluntly, utter shit, and does nothing but continue the trend that "oh god Javascript is horrible".
- TrevorBurnham 16y agoThe JavaScript compilation you propose isn't standard JS: arrays don't have an `each` method. Also, even if such a method existed, your code would fail because $(this) would resolve to `$(window)` in your function. To avoid that, you'd need to use `.call(this)`... but then how would you compile `break`, `continue`, etc.? I'm not saying CoffeeScript's output has no room for improvement, but given the challenge of compiling to working JS in all cases without modifying prototypes or adding tons of helper methods, I think you're being a little harsh.
- M1573RMU74710N 16y agoI think what Klonoar was trying to do was contrast the Javascript generated by Coffeescript with what a Human would write in the same scenario. Note in both Klonoar's example and the article, we are using jQuery. In Klonoar's example inputEls is a jQuery object with a collection of input elements, which does have an each method. When you use a method like .each() jQuery will also apply the function to each element in the collection in turn, so on each execution the context of the function is the element, so Klonoars example is correct. That said, I think it's obvious that a compiler will not produce code as pretty as what a human would write, and that's generally ok. For the most part you only look at the compiled code for debugging, and as long as the generated code is fairly readable it shouldn't hinder that much. Though more verbose and a little more ugly, the compiled Coffeescript JS has some benefits over Klonoars example. In the CS version the crux of the iteration is a for loop which will be pretty fast. In the Vanilla JS version it's using jQuery .each() which will most likely be slower. It is a good point to bring up though because there is some overlap in the goals and functionality of something like Coffeescript vs many libraries like jQuery. The difference is with Coffeescript you are paying upfront with compilation and with jQuery et al you are paying at runtime. The cost-benefit analysis is something each developer must run for themselves and continually re-evaluate as they work.
- Klonoar 16y agoUhh, no, you're incorrect (albeit in a sense, I'll admit). The entire article was about jQuery and CoffeeScript, so my example was built using jQuery. This entails a .each method on DOM collections, and $(this) will properly scope being inside that $().each method. M1573RMU74710N summed up what I aimed to do here, though, which was show that the resulting code isn't actually that bad. In my opinion the article in question is making a case that all Javascript looks horrible, when in reality that's simply not the case. Edit: I see it noted in another comment on this thread that you're writing a book on this... and you couldn't tell I was using jQuery, when I pass in the results of the selector call as an argument? Tut tut...
- TrevorBurnham 16y agoSorry, you're quite right! I misunderstood the point you were making.