Hacker News new | past | comments | ask | show | jobs | submit login

Yes, it could control it with indentation. "Simplify" though? Are you sure?

This whitespace zig-zaging is barely readable.




Very much so. Otherwise you get this, at best:

  $('.class')
    .find('.sub')
      .remove()
      .end()
    .find('.stuff')
      .addClass('other')
      .find('.more_stuff')
        .removeClass('things')
        .end()
      .end()
    .filter('li')
      .appendTo('#my_list')
Or, to match jQuery's documentation style for that function, this:

  $('.class').find('.sub').remove()
    .end().find('.stuff').addClass('other').find('.more_stuff').removeClass('things')
    .end().end().filter('li').appendTo('#my_list')
Matching .end() with each selector change is equivalent to writing valid XML by hand, without the aid of an auto-tag-closer, and without a validator - you only see the error on run, and only if you hit that code path, and only if it does something you notice isn't correct.

None of this is meant to imply that chaining things like this is a Good Idea™, and I avoid .end() like the plague and use intermediate variables. But when you don't need the root or intermediate results for anything else, yes, this is more readable, more easily optimized (you can't get it wrong, every level is cached for you), less prone to error, and significantly fewer characters / lines of code. That's simplifying and improving.

-- late-edit:

Less whitespace zigzaggery is also possible (I agree, not easy to read such dense zigzagging), and similarly easier with significant whitespace. My example was essentially just a trivial one, I tend to see larger ones where I see that kind of indentation at all. Is this better?

  $('.class')
    .find('.sub').remove()
    .find('.stuff').addClass('other')
      .find('.more_stuff').removeClass('things')
    .filter('li').appendTo('#my_list')


In your last example, `.find('.more_stuff')` works on the value returned from `.addClass('other')` (or so it'd seem), so it behaves differently.


Which, with jQuery, is the same as the results from the most-recent selector in the chain (in this case, the .find('.stuff') before it). Normally though, you'd be absolutely correct, and that example would need to nest the .addClass('other') inside its .find so it doesn't pollute the next .find:

  $('.class')
    .find('.sub').remove()
    .find('.stuff')
      .addClass('other')
      .find('.more_stuff').removeClass('things')
    .filter('li').appendTo('#my_list')


  with($('.class')) {
  	find('.sub').remove()
  	with(find('.stuff')) {
  		addClass('other')
  		find('.more_stuff').removeClass('things')
  	}
  	filter('li').appendTo('#my_list')
  }


Great point:

    This whitespace zig-zaging is barely readable.
I considered an example like this in the post, but it confuses accidental with essential complexity. If you’re going to do all of that, then I suggest that significant indentation is a win over everything being a chain and using something like jQuery’s `.end()` to discriminate chaining from cascading.

It’s a lot easier to spot an error in indentation than a missing `.end()`. That being said... This could be a false dichotomy. Perhaps the right thing to do is use named temporary variables or structure the code another way.

Although I don’t see a ton of it in the wild, it’s 100% valid to write your own custom jQuery traversals, filters, and so forth. my own jQuery Combinators includes `.K` and `.T` combinators so that you can break code up into functions so you don’t need to write elaborate trees.

So... I agree that an elaborate tree is a difficult problem to handle, and perhaps neither significant whitespace nor `.end()` is the answer. But for the limited and possibly artificial choice of a fluent interface OR significant whitespace, I prefer significant whitespace.


"Although I don’t see a ton of it in the wild, it’s 100% valid to write your own custom jQuery traversals, filters, and so forth. my own jQuery Combinators includes `.K` and `.T` combinators so that you can break code up into functions so you don’t need to write elaborate trees."

This is very interesting to me. Tell me more :)





Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: