Marc's brain backups (incremental)

Learn 10 + 11 things about JS and jQuery

jQuery logoPaul Irish lead developer of Modernizr and HTML5Boilerplate and member of the jQuery team has two really great video tutorials about everybody’s favorite library up on his blog. If you haven’t seen them I highly recommend them to any frontend hacker.

He starts out how in the beginning jQuery (any library actually) is this black box that ‘just works’ and you have no idea how. He then explains some of the basic internals and also some of the more scary (and very smart) parts of the jQuery code. But what’s really cool is that the videos are actually very funny. The first video runs for about an hour and I never got bored watching it, in the contrary some of the things he does and says will just make you laugh out loud. And you’ll learn some impressive techniques that are actually quite useful in your day to day programming work.

Some of the things you’ll learn, smiling:

In the first video http://paulirish.com/2010/10-things-i-learned-from-the-jquery-source/

  • about the cool hack that makes the .ready() function work in IE
  • a replacement for eval: [cci lang="javascript"](new Function(“return ” + stringdata ))();[/cci]
  • to pass references to window and document into your scope for better minification
  • building a better delay using setTimeout asynchronously
  • how to grab some code from the jQuery and build a script loader.
  • an awesome way to get a random element from an array:
    [cci lang="javascript"]
    var myArray = [5,2,10,4];
    var randomValue= myArray[Math.floor(Math.random()*times.length)];
    [/cci]

In the second video: http://paulirish.com/2011/11-more-things-i-learned-from-the-jquery-source/

  • IIFE:  immediately invoked function expression: [cci](function(){})();[/cci]
  • defining shortcuts to set attributes using jQuery.attr() and jQuery.props, which helps especially if you use custom attributes with long names like data-thingamjig
  • a while loop without a block that evaluates and executes two statements at once
  • Paul Irish has 3034 unread notifications on Github :)
  • jQuery.cssHooks
  • that [cci]jQuery.fn === jQuery.prototype[/cci]

Paul Irish is the only JavaScript comedian.

One Response

  1. Thanks for new tips and ideas. Hope it helps.

    August 14, 2011 at 11:45

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>