Naming Things is Hard

Hey! Let’s read jQuery — Part 2: The biggest picture

What is jQuery, anyway? I think it's important to know what this jQuery thing does if we're going to try to understand what's going on under the hood. (I imagine one might be able to deduce what a car does from nothing but a box of engine parts and headrests, but that seems like a lot of work.)

Let's start with a few pertinent facts about how JavaScript itself works (or at least my current understanding of how it works). This way simplifies things, but:

So far? So good. More or less.

With all that in mind, we can say (and I'm kind of elliding the proof of my work, but that's fine, we're all friends here) that jQuery is really just one massive function. When we use jQuery, when we use the $ that's virtually synonymous with jQuery in our code, we're just running a function.

Typically, we give the jQuery function a bit of data to work with; we point to something on our page, by class or an id or something else, essentially giving jQuery something from our DOM to do things with. The jQuery function then returns a value; the thing it returns is an object. That object, that jQuery object, that we get back, when we run the jQuery function, it has a bunch of methods (functions) on it, and that's where the jQuery magic kicks in; we're running methods on an object that has a connection to something else, something that exists somewhere in our HTML. (Basically.)

So like, when I use $("#menu") in my code, I'm giving the jQuery function a bit of data to work with (a reference to an element with the id of "menu" somewhere on my page), and what I get back is an object, one that knows exactly where to find the menu element on my page. So then I can run $("#menu").hide(), and what happens is I'm running a "hide" method that lives on a jQuery object, and by the magic of its internals it knows that it's going to actually do things to this menu element it's referencing. 

It's actually really kind of cool, from that perspective; there's a lot going on, in there. Realizing how this actually worked in reality was another a-ha momenet for me. I read about this in that jQuery Considered Harmful post sometime last year, but it took me a long time and some additional study to actually get what the heck that meant.

One thing about jQuery that always kind of confused me, before I spent any time really thinking about it, was those other jQuery function calls, the ones that didn't have any parentheses after them; stuff like $.ajax() or $.when(). They always looked a little weird to me. Sort of illegal. Wrong. I didn't get them. Turns out these, at least in principle, make perfect sense, knowing now that, since jQuery is just a function—which means it's just a fancy object—I can have other methods attached to it, that I can call directly. Hey! Also kind of cool!

As a rather light user of jQuery, and having never developed plug-ins for it or having purposefully attempted to extend it, my understanding of it and how it works and what it does is obviously a bit surface-level, and I'm also not going deep into some of the technical details yet (like, how do all those methods wind up on the object the jQuery function returns?), but I think there's enough there to give myself an idea what to look for when I start digging into the actual code. In the next post. I promise.

Periodic reminder down here about how much I'm indebted to Anthony Alicea's JavaScript: Understanding The Weird Parts course for helping put me on the path to understanding some fundamental truths about JavaScript; anything good I said above, he probably said better, and anything wrong I said above, definitely wasn't his fault.


Home & About &