Question

I was wondering if I can add to Javascript’s document object. Like:

var document = {
    name: "My Name"   
}

• Is that legal in JavaScript?
• If it is, is it considered “good practice”, or should I avoid it?
• If I define it as a variable, is it then considered as a unique object, and not a JS DOM object?

I am plenty new to JavaScript and any help would be much appreciated.

Edit:

After some conversation in the comments and a little more thought on it, I really want to know if I can manipulate the document variable and still use document for normal use.

Answer 1

• Yes you can do that
• No you shouldn’t do that

document is just another property of the global / window object. If you declare it as formal parameter or variable within a scope, the lookup process will match that name first in that scope you declared it, so it kinda overlaps it.

Regardless, you don’t want to do it, why would you ? Its so confusing for you and anybody else who is looking at your code. Its very bad practice.

Actually, that is the reason why most “advanced” javascript snippets / libraries begin with a closured function scope like

(function( window, document, undefined ) {
    // window will always reference the "window" object that got originally passed in
    // document will always reference the "document" object that got originally passed in
    // undefined will always reference the "undefined value" that got originally passed in
}( window, window.document ));

..just to avoid, the such called asshole effect. If such a closure is openend at the very top of a file, it makes sure that you reference the original objects within, just in case some genius had the great idea to overwrite/overlap them.

Conclusion: You are of course free to choose the name of your
variables at will, but you really shouldn’t use the name of such
prominent names like window, document, undefined et cetera for
obvious reasons.