While there are many different data formats that JavaScript can communicate and manipulate, all of the information that JavaScript understands breaks down into six primitive data types: numeric, string, boolean, null, undefined and symbol. (Objects also count as a separate data type). JavaScript needs to know what kind of data it has in order to understand how to process it: for example, a + operator will be used to add numeric data, but if the data contains strings, the same operator will concatenate the information.

Unlike other programming languages, JavaScript is “loosely typed”, meaning that you do not have to declare the type of information a variable will contain ahead of its use; the variable will automatically pick up the type from the data provided. In some ways, this implicit behaviour makes understanding data types even more important when learning JavaScript.

Numeric Data

Numeric data is just that: numbers. Numeric data encompasses all forms of numbers, from integers (1, 5, 623) to floating point (0.75, .3333). This includes negative numbers. Note that numbers appearing inside quotes (“52”) are not treated as numeric data, but as strings.

As an example, I’ll create a variable that contains numeric data:

var daysInYear = 365;

number data may also be positive infinity (for example, the result of dividing a number by 0), negative infinity and Nan (“not a number”)

String Data

Used to contain textual information: essentially, any text immediately inside quotes (single or double) is considered a string.

var myName = "Dudley Storey";

Boolean Data

A logical entity that can only have one of two absolute values: true or false. Boolean values are useful when making certain clear decisions, the values may also be interpreted as 1 (true) and 0 (false) as well as “yes”, “no”, etc.

if (memberOfGroup == true) {
    // take action
}

Note that true and false boolean values should never be surrounded by quotes: if they are, the value will turn into a string.

Undefined

Used as the default for a variable that has been created but not yet explicitly provided with a value. For example, if we declare a variable in the console without providing it with a value, this Undefined default will be immediately reported, and again when it is tested:

var dataContainer;
> Undefined

This is also why trying to set a variable to the value of an object on the page that has not been created (or does not yet exist) will return undefined:

var bearerBonds = document.getElementById("nakatomi");
> Undefined

Null

null represents an empty value, or that no value is present. Understandably, this is often confused with undefined. The difference is that null indicates the absence of a value; whereas Undefined means that the value does not exist.

A variable of any data type can be “reset” by setting its value to null:

var standardBearer = null 

Note that null is not equal to a value of "", undefined, false, 0 or Nan: it is its own “thing”.

Objects

Objects are a special kind of data type, which is why I’ve provided them with their own article.

Symbols

Introduced in ES6, Symbols are semi-private “labels” for object properties. Since they are very new, only recent browsers support them (Chrome 38+, Firefox 36+, Safari 9+, Opera 25+). Some features of Symbol are not yet supported, even in modern browsers, and one (IE / Edge) has no support for symbols at all. For that reason, I’ll return to them in a separate article when browser support is more broadly established.

Photograph by NATS Press Office. licensed under Creative Commons.

Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.