I was just thinking how much I love JavaScript and how it has been my favorite language/platform for years. People who consider themselves 'real' developers have always given me a hard time because of it. That and "you can use it just like an OOP language, but it's not really one"! Haha! Who cares if it only acts like it!?
How could you not love it? It's so dynamic - you can do anything you want with it!
It's funny that everyone is getting excited about the DLR in upcoming .Net releases. And, "it's so cool, because it supports dynamic language extensions to C#." Hehehe.. Well, at least the rest of the world is finally starting to catch up to me.. 8^)
I'm cleaning up some old code today primarily consisting of JavaScript and a bit of C# (ASP.net). I'm trying to make the code faster and more easily understood.
I thought I'd clean up the code used when working with elements on the page. Generally, this consists of an assignment from the DOM to a local JS variable and then an if statement to verify the object was found.
Now, some people will claim that it isn't necessary to perform the check (assuming you are checking during onload or after) because it is highly unlikely that only part of the web page will be downloaded. I agree that it is unlikely and quite frankly if only a portion of the page gets downloaded you're going much more important problems to worry about than a few JavaScript error dialogs. But, nevertheless, I still feel it is a good practice to check for null objects.
I have always done a simple check as follows:
var obj = document.getElementById("myobject"); if (obj) obj.style.display = "block";
However, I know many web developers who go a little further:
var obj = document.getElementById("myobject"); if (null != obj && "undefined" != typeof(obj)) obj.style.display = "block";
I generally only check for undefined when checking if a method parameter exists or not.
function myFunc(id, e) { var obj = document.getElementById(id); if (obj) { if ("undefined" != e && null != e) obj.innerHTML = "An error occurred: " + e; } }
Does it matter? What do you do? What's the difference between null and undefined?
Well, so the difference between null and undefined are very simple, yet very important. null is actually an object in JavaScript. undefined is a value for objects that don't exist or variables that have not yet been assigned to.
Checking for null is simple:
if (obj) // the object exists if (null != obj) // the object exists if (!obj) // the object is null if (null == obj) // the object is null
Checking for undefined is just as simple*:
// test as an object if (undefined != obj) // the object is defined if (undefined == obj) // the object is undefined // test as a string if ("undefined" != typeof(obj)) // the object is defined if ("undefined" == typeof(obj)) // the object is undefined
*Please note, however that a lot of people make the simple mistake of testing the wrong thing with regards to undefined. There are two ways to test it, as a string or as an object. Look closely at the two different types of examples above, so you don't accidentally mix them up! (Which I've only done about a bajillion times!)
And, don't forget that just because an object is not undefined, does not mean that it is non-null as well. In other words a null object is still an object therefore it is defined. That make sense?
Well, in my cleaning up I decided to revisit the whole thing and noticed like all maturing web applications there are many variations and uses of these throughout our code. I needed to know for sure, however, what is returned by getElementById (and getElementsByName) when the object or objects are not found. And, also what is the best, cleanest way to test those objects.
So, I wrote a few tests:
var obj = document .getElementById("this-elem-doesnt-exist"); if (!obj) alert("!obj"); if (obj) alert("obj"); if (null == obj) alert("null == obj"); if (null != obj) alert("null != obj"); if (undefined == obj) alert("undefined == obj"); if (undefined != obj) alert("undefined != obj"); if ("undefined" == typeof(obj)) alert("\"undefined\" == typeof(obj)"); if ("undefined" != typeof(obj)) alert("\"undefined\" != typeof(obj)"); if (undefined == typeof(obj)) alert("undefined == typeof(obj)"); if (undefined != typeof(obj)) alert("undefined != typeof(obj)");
Now, let's run the same tests against an object that we know exists:
var obj = document .getElementById("this-elem-exists"); if (!obj) alert("!obj"); if (obj) alert("obj"); if (null == obj) alert("null == obj"); if (null != obj) alert("null != obj"); if (undefined == obj) alert("undefined == obj"); if (undefined != obj) alert("undefined != obj"); if ("undefined" == typeof(obj)) alert("\"undefined\" == typeof(obj)"); if ("undefined" != typeof(obj)) alert("\"undefined\" != typeof(obj)"); if (undefined == typeof(obj)) alert("undefined == typeof(obj)"); if (undefined != typeof(obj)) alert("undefined != typeof(obj)");
Based on the results, I really think that all you should have to do is a simple check as in the first example. So, I'm changing our code to look nice and clean using just a simple if (obj), unless there is a need to check if it's undefined.
I've been doing a lot JavaScript lately for my new job. We're creating a dashboard for our web-site that is totally cool! One of several things that I have licensed to my new employer is my JavaScript-based XML parser. We're using this on the user-agent to load the widgets without having to talk to our server. Eventually, we will even allow using other companies widgets or gadgets or whatever they are called at the time.
I think that'd be a great feature for one of the big boys (i.e.: Google, MSN, Yahoo, PageFlakes, etc.) to support the others' widgets as well.
But, in the real world there is a problem with that though. Just like when an operating system supports applications from another, there comes a time when the developers wonder why they should create anything for OS A when all of OS B's applications will work on A.. (Just refer to OS/2 for more details..)
