Declaring a variable in Javascript but not initialising it

Question

At the moment I'm trying to wrap my head around the use case for declaring a Javascript variable but not initialising it right away. I understand that declaring a variable will store/set aside memory to that variable for future use, but what's the point in declaring a variable and not initialising it immediately?

My first thought would be a use case where you'd want to declare a variable to use in multiple functions, or for creating multiple objects, like so:

var me;

function firstMe(){
  var me = "Ryan";
  //do something...
}

function secondMe(){
 var me = "Bob";
 //do something...
}

Is it good practice to work with variables like this? What are the situations in which declaring a variable and not initialising it are useful or preferred?

Answer 1

For starters, it's always initialized as undefined:

var a;
a === undefined; // true
var b = undefined; // exact same thing

Now, since the language is weakly typed, when undefined a variable doesn't set up memory for future use, since it can't know how are you going to use it, until you assign something to it.

As for when to declare but not initialize, well that's very specific to your needs and constraints; for example, a common technique (to cope with javascript global scope nuances) is to declare all the variables you'll need at the beginning of a function, so they don't inadvertently go to the global scope if you forget to user var:

var a, b, c;
// some code
a = 1 // since it was declared at the beginning, this will stay in local scope

This is considered good practice.

And to clarify, in your example you're declaring var me inside each function, that actually creates a new variable in the local scope, so you're not changing the global scope; for instance, take this code:

var me = 'jaime';
function change() {
    var me = 'ryan';
}
change()
alert(me) // jaime

It may also worth adding that there's no practical performance benefit of declaring the variables before use (uninitialized), just don't worry about it.

Answer 2

If you redeclare "var me" inside your functions, these vars will not be global. You would rather do:

var me;

function firstMe(){
  me = "Ryan";
  //do something...
}

function secondMe(){
 me = "Bob";
 //do something...
}

Answer 3

Declaring a variable but not initialising it depends on the programmer and the situation. It is a very broad subject. An example where it could happen is if a global reference to an element is desired. The document would have to load before the variable can be initialised, but it would need to be declared first.

var canvas;
function onLoad()
{
    canvas = document.getElementById("myCanvas");
}

But if you are talking about locally, again, it is all down to the programmer.

Answer 4

I don't know about javascript memory management (except that you really should not care about it in almost all cases..), but the most common reason to define a variable is to define it's scope.

In your example, you have written var in front of your variable inside both functions. This means those variables have a scope only inside that function. (So it's not the same "me" as outside the function).

If you leave var out however from both functions, the both functions will share the same variable.

For example

var lock;

function doSomething() {
    lock = true;
    // do something
}

function doSomethingElse() {
    if (lock) .. else ..
}  

doSomething and doSomethingElse functions both use the same lock variable.

And to answer your question:

Is it good practice to work with variables like this? What are the situations in which declaring a variable and not initialising it are useful or preferred?

I think the above example is a perfectly acceptable example. Using "global variables" as such is bad programming paradigm, but if you are doing a simple script then why not.