4 ms·

Even with jQuery today it's often easier to step out of the box a little and use more straight JS You mean straight DOM not JS because as a matter of fact, jQu

Even with jQuery today it's often easier to step out of the box a little and use more straight JS You mean straight DOM not JS because as a matter of fact, jQuery didn't add a lot to the feature set of JS but contributed immensely to fix/smooth the DOM API.

tracker1 11y ago
Yes.. and DOM support across browsers is much better than when jQuery was first developed, also jQuery has a lot of utility methods that are already built into iteratables (Arrays). [].concat(document.querySelectorAll('#foo > div')).forEach(function(div){ //got my div }) Isn't too much worse than $('#foo > div').each(function(){ var div = this; //never liked this pattern, and even then why isn't "this" a jQuery object? }); Let alone adding another few dozen k for the library itself... Zepto is about 1/3 the size for modern browsers, without all the extras you generally don't need if you just want some dom sugar around modern browsers. Though, I'm not sure if Zepto has enough for say the Bootstrap components to work against.
- bshimmin 11y ago
  `.bind(this)` or an ES6 fat arrow solves the `this` problem in your jQuery example. As to why... well, it makes more sense with jQuery's event listeners (`$(this)` being much shorter than `$(event.currentTarget)` and usually being what you actually want), and thus I guess in the name of consistency it's good to have all callbacks behave the same way. Why it's not a jQuery object... pass. More often than not that would be what you want, and if it's not, `.get(0)` or `[0]` is hardly a great stretch. Historical reasons, perhaps. If I'm iterating over collections of elements and I have access to Underscore, I'll just use `_.each($("..."))`, which has the benefits of a more suitable `this` and the callback arguments in a sensible order (element then index).
  - tracker1 11y ago
    If I did a `bind(this)` in a jQuery event handler, I could never access the item that was being iterated, or the event was raised for... My problem with `this` in jQuery is that it's context that isn't passed. $('#foo').click(function(foo,event){ ... }); $('#foo .item').each(function(item,index){...}); Is more sensical than... $('#foo').click(function(event){ var foo = $(this); ...}) $('#foo .item').each(function(index){ var item = $(this); } With jQuery, I couldn't use a function that was bound to an object. $('#foo').bind('foo',myContextObject.handleFoo.bind(myContextObject)); The binding/pattern just blows up, and handleFoo can't get to the foo instance... It's just really sloppy in my mind to change the context of functional expressions that way. Don't get me wrong, I really like a lot of what jQuery has done, and it's better than what came before it, I just find that using the this context removes a lot of options.

tracker1 11y ago

Yes.. and DOM support across browsers is much better than when jQuery was first developed, also jQuery has a lot of utility methods that are already built into iteratables (Arrays). [].concat(document.querySelectorAll('#foo > div')).forEach(function(div){ //got my div }) Isn't too much worse than $('#foo > div').each(function(){ var div = this; //never liked this pattern, and even then why isn't "this" a jQuery object? }); Let alone adding another few dozen k for the library itself... Zepto is about 1/3 the size for modern browsers, without all the extras you generally don't need if you just want some dom sugar around modern browsers. Though, I'm not sure if Zepto has enough for say the Bootstrap components to work against.

bshimmin 11y ago
`.bind(this)` or an ES6 fat arrow solves the `this` problem in your jQuery example. As to why... well, it makes more sense with jQuery's event listeners (`$(this)` being much shorter than `$(event.currentTarget)` and usually being what you actually want), and thus I guess in the name of consistency it's good to have all callbacks behave the same way. Why it's not a jQuery object... pass. More often than not that would be what you want, and if it's not, `.get(0)` or `[0]` is hardly a great stretch. Historical reasons, perhaps. If I'm iterating over collections of elements and I have access to Underscore, I'll just use `_.each($("..."))`, which has the benefits of a more suitable `this` and the callback arguments in a sensible order (element then index).
- tracker1 11y ago
  If I did a `bind(this)` in a jQuery event handler, I could never access the item that was being iterated, or the event was raised for... My problem with `this` in jQuery is that it's context that isn't passed. $('#foo').click(function(foo,event){ ... }); $('#foo .item').each(function(item,index){...}); Is more sensical than... $('#foo').click(function(event){ var foo = $(this); ...}) $('#foo .item').each(function(index){ var item = $(this); } With jQuery, I couldn't use a function that was bound to an object. $('#foo').bind('foo',myContextObject.handleFoo.bind(myContextObject)); The binding/pattern just blows up, and handleFoo can't get to the foo instance... It's just really sloppy in my mind to change the context of functional expressions that way. Don't get me wrong, I really like a lot of what jQuery has done, and it's better than what came before it, I just find that using the this context removes a lot of options.