JavaScript undefined value and keyword what to know

In javaScript undefined is a value that comes up often. The undefined value is the default value for variables that are declared but do not have any value assigned to them. When working with functions a value of undefined is what is returned by a function by default unless something else is returned by using the return keyword. There is also the undefined keyword that can be used to intentionally set a variable to undefined, and can also be used in expressions. In this post I will be outlining some examples that point out some things that a javaScript developer should be aware of when it comes to undefined in javaScript.

1 - javaScript undefined defined

In javaScript undefined is a primitive value, and a global property that represents that value. In this section I will cover some examples that demonstrate some typical situations in which a javaScript developer will run into the undefined primitive.

1.1 - when a variable is declared, but not assigned anything.

When a variable is declare but is not assigned a value other than undefined, the default value for that variable is undefined.The same is true of object properties that have not been added to an object yet, this also includes array elements sense arrays are a kind of object in javaScript.

1
2
3
var n;
console.log(typeof n); // undefined

1.2 - undefined is what is returned by a function by default

When writing a function that returns some kind of result, if nothing is returned then the default value that is returned is undefined. To have a function return something other than undefined the return keyword can be used inside the body of a function to define what it is that is to be returned.

1
2
3
4
5
6
7
var noop = function () {};
var foo = function () {
return 'bar';
};
console.log(noop()); // undefined
console.log(foo()); // 'bar'

1.3 - undefined is the default value for an argument

When writing a function that accepts one or more arguments if an argument is not given then the default value for the argument is undefined. So testing for undefined is often used as a way to determine of no argument is given,and then thus set a default for that argument when writing a function.

1
2
3
4
5
6
7
8
9
var sum = function (a, b) {
a = a === undefined ? 0 : a;
b = b === undefined ? 0 : b;
return a + b;
};
console.log(sum()); // 0
console.log(sum(5)); // 5
console.log(sum(2,6)); // 8

2 - Calling javaScript undefined

When first starting out with javaScript you might find yourself running into errors that are the result of calling undefined. One reason why thins might happen could be a result of the difference between javaScript declarations and javaScript expressions. If a function is a javaScript expression then it can only be called after it is defined. If it is not defined yet this can result in calling the undefined value which of course results in a kind of error.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
// function declaration
console.log(func1()); // 'foo'
function func1() {
return 'foo';
};
console.log(func1()); // 'foo'
// function expression
try {
console.log(func2());
} catch (e) {
console.log(e.message); // func2 is not a function
console.log(func2 === undefined); // true
}
var func2 = function () {
return 'bar';
};
console.log(func2()); // 'bar'

There are a number of other reasons why calling undefined might happen. If for whatever the reason there is not a function in what is being called that will result in this kind of error.

3 - javaScript undefined will result in a true value when used with isNaN

One of the weird things about the isNaN method is that it will return true for some values that are not NaN including the undefined value. Because of this there are often isNaN methods in various frameworks besides the fact that there is a native method for doing so that do a better job of finding out if a value is nan or not.

1
console.log(isNaN(undefined)); // true

4 - Conclusion

The undefined value in javaScript comes up a lot in discussions when learning javaScript for the first time. A common mistake most new javaScript developers make involves errors resulting in calling undefined.