13

What is the difference between javascript window and jquery $(window)?

I tried in the Chrome console and I get this: enter image description here

So, I would conclude is "just" a window object wrapped in a jquery object in a way that then I can use jquery's functions on it (like height(), width(), etc...)

I did try googling, and stackoverlowing :) OFC, but to no luck.

Community
  • 1
  • 1
Nikola
  • 14,888
  • 21
  • 101
  • 165

4 Answers4

14

When you write $(window), you should know that that piece of code is going to run on the JS engine. Have you ever wondered why jQuery objects all have parentheses around them? It is because $ is a function object. Basically you're calling the $ function, and passing the native global, or window object to it as an argument.

If you browse through the jQuery source code, you'll see that it'll pass that object on to many internal functions and in the end, it'll return a jQuery wrapper object.
So yes, your assumptions are pretty much correct.

Yay295
  • 1,628
  • 3
  • 17
  • 29
Elias Van Ootegem
  • 74,482
  • 9
  • 111
  • 149
0

window is a global object and have no relation to any 3rd party library. however $(window) returns a jQuery object. You are right that its nothing but a wrapper but it comes with all possible jQuery goodies. We can use it just like normal jQuery object we can access its childs, can associate data wtih it etc etc.

K D
  • 5,889
  • 1
  • 23
  • 35
  • 1
    `window` isn't a DOM object, it's a circular reference to the nameles global object. Just write a script that does this: `console.log(this === window);`, it'll log true. As will: `console.log(this.window === window === this)` in a simple `` dom, in any case – Elias Van Ootegem Jun 05 '13 at 12:01
  • @EliasVanOotegem - Your second example `console.log(this.window === window === this)` logs `false`. – nnnnnn Jun 05 '13 at 12:37
  • @nnnnnn: true, just tried it in console, yet `window === this` and `this.window===this` both log true, then again: does JS support `operand === operand === operand` ? probably not – Elias Van Ootegem Jun 05 '13 at 12:42
  • 1
    @EliasVanOotegem - It's a legal statement, but what it is doing is evaluating the first `===` with its two operands, which always returns a boolean value, and then moving on to do the other `===` test against that boolean value. I.e., `(this.window === window) === this` or `(true) === this`. – nnnnnn Jun 05 '13 at 12:43
  • @nnnnnn: Nips, can't believe I overlooked that :) – Elias Van Ootegem Jun 05 '13 at 12:47
0

You are ture

window, which is a jQuery wrapper containing the global window object. The intent here was to create a locally-scoped window variable that would give me immediate access to jQuery methods like width(), height(), scrollLeft(), and scrollTop().

Suresh Atta
  • 120,458
  • 37
  • 198
  • 307
  • 1
    You've missed the plot, I think: How can you create a locally scoped variable of _the global object_? – Elias Van Ootegem Jun 05 '13 at 12:06
  • @EliasVanOotegem - `var localVariable = window;` would do it wouldn't it? But still this answer doesn't really make sense because the scope of the variable has nothing to do with what methods are available on it. – nnnnnn Jun 05 '13 at 12:41
0

The window object represents the window itself. You can find more explanation here. From what you describe above, it seems that you are looking to access the document properties instead of window properties. You can access the properties length, height, etc. as follows:

  • document.height (pure javascript) or $(document).height() (jQuery)
  • document.width (pure javascript) or $(document).width() (jQuery)

For more document properties, see here.

user2424941
  • 31
  • 4
  • Why not `$(window).height()`? Gives the height of the browser's viewport, which is (generally) not the same as the document's height. – nnnnnn Jun 05 '13 at 12:34
  • You can do that too, you'll just get a different result because window.height gets the height of the window instead of the browser. So you will get a lesser number using window.innerHeight than document.height. The usage pretty much boils down to what you're trying to achieve. – user2424941 Jun 06 '13 at 02:16