How can I check whether a variable is defined in JavaScript?

Question

How to check whether a JavaScript variable defined in cross-browser way?

I ran into this problem when writing some JavaScript utilizing FireBug logging. I wrote some code like below:

  function profileRun(f) {
   // f: functions to be profiled
   console.profile(f.constructor);
   f();
   console.profileEnd(f.constructor);
  }

It works fine in FireFox/FireBug, but it reports error in IE8 RC1. So, I'd like to do some checking whether console variable exists in the execution environment.

Below code works fine in FireFox, but not in IE8 RC1.

  function profileRun(f) {
   if (console != undefined) {
    console.profile(f.constructor);
   }

   f();

   if (console != undefined) {
    console.profileEnd(f.constructor);
   }
  }

However, if I do it this way. It works in IE8 RC1. Why?

  function profileRun(f) {
   if (window.console != undefined) {
    console.profile(f.constructor);
   }

   f();

   if (window.console != undefined) {
    console.profileEnd(f.constructor);
   }
  }

Is there any cross-browser way to check it?

Answer 1

You want the typeof operator. Specifically:

if (typeof variable === 'undefined') {
    // variable is undefined
}

Answer 2

In addition to Jim's answer, you could check this javascript FB console. It may be valid for both IE8 and before.

FB = {
    iesetup : false,
    o : true,
    log : function(tf, junk, x)
    {
     if (!FB.o) return true;
     if (!FB.iefb){
      FB.iefb = (!window.console && !FB.iefb) ? document.createElement("div") : false;
     }
     if (FB.iefb && !FB.iesetup) {
      FB.iefb.id = "IEFB";
      document.body.appendChild(FB.iefb);
      FB.iefb.style.backgroundColor = "#fff"; FB.iefb.style.color = "#000"; FB.iefb.style.fontSize = "11px";
      FB.iefb.style.height = "150px"; FB.iefb.style.overflowY = "scroll"; FB.iefb.style.fontFamily = "verdana";
      FB.iesetup = true;
     }
     if (window.console && tf) {
      console.log(junk.join(" "));
      if (x) console.trace();
     }
     else if (FB.iefb && tf) {
      var x = document.getElementById("IEFB")
       x.innerHTML += junk.join(" ") + "<br />";
       x.scrollTop = x.scrollHeight;
     }
    }
};

Answer 3

You should also check out firebug lite which works for many browsers when the ordinary firebug is not available. There is also a firebugx.js, which has no functionality but can be loaded just to avoid having to do the test. (Google that if you need it)