JavaScript data types - We Work Worldwide

In this section we will learn what data types are and how to use them in JavaScript.

What is Data Type in JavaScript?

In JavaScript, a data type is the attribute of a value that the compiler uses to define how the target value should be interpreted and stored in the memory.

Why there are Data Types in JavaScript?

The values we put and use in programming languages like JavaScript, have different memory footprints.

For example, if you have numeric value like 12, it takes different amount of memory space than a value like 23.33 which is a floating one.

So for JavaScript to be able to manage each value accurately and spare the right amount of memory for each one, it needs to differentiate and define a type for each value.

This is where data types come in!

List of Data Types in JavaScript

In short, there are 8 data types in JavaScript.

So, let’s dig in and see the list of supported data types in JavaScript.

JavaScript Number: (JavaScript Integer and Float values)

Integer and Floating values in JavaScript are considered of type Number.

JavaScript Number Data Type Example:

var num = 10;
var num2 = 2.33;
var num3 = 3234234.342;

The type of all the values mentioned above is Number.

JavaScript BigInt:

Values of type Number cannot be greater than (2⁵³-1) (that’s 9007199254740991) and less than -( 2⁵³-1). For the majority of times this is more than enough in JavaScript programs. But in some programs we even need numbers greater or lesser than the range that the Number type represents. For this reason, in recent years the JavaScript committee added another data type called BigInt that can have an arbitrary length. This data-type basically allows developers to pass the minimum and the maximum range of values that the Number data type allows.

A BigInt value is created by adding the letter n at the end of an integer number.

JavaScript BigInt Data Type Example:

var num = 1234567890123456789012345678901234567890n;

Note: the letter n essentially signals the execution engine that the value is of type BigInt.

JavaScript Boolean:

In programming there are times in which we have a block of code that its execution depends on a condition. For example, if a user inserted a correct input data (like a password) then part of the program should be executed and proceed to the next level (whatever that might be). One of the ways in which we can decide whether the instructions of a part of a program can run is via values of Boolean data type.

There are two values that are of type Boolean.

true

false

JavaScript Boolean Data Type Example:

let condition = true;
let condition2 = false;

Note: in the condition section you’ll see the use of Boolean values in practice.

JavaScript String:

A series of characters that are wrapped in double quotations " " or single quotation ' ' or backticks are considered of type String.

JavaScript String Data Type Example:

let st1 = "John";
let st2 = 'Doe';
let st3 = `2021`;

Note: the backtick is covered in greater detail in the template section.

JavaScript Symbol:

This data type is used to create unique identifier for Objects. This data type is fully covered in the Symbol section.

JavaScript Object:

Values of type Object in JavaScript are used to group together multiple values that are related.

JavaScript Object Data Type Example:

const person = {
name: "John",
lastName: "Doe",
email:`[email protected]`
}

The variable person here in this example contains a value of type Object.

Note: there are more into the Object data type but because it’s a lengthy topic, it is fully covered in the Object section.

JavaScript Null:

When we have a variable and want to set its value to empty or unknown, we would use the keyword null which represents the Null data type.

Basically there's only one value of type Null and that is `null`.

JavaScript Null Data Type Example:

const person = {
name: "John",
lastName: "Doe",
email:`[email protected]`
}
person = null;

Here the first value of the person variable was an object but in the next statement, we’ve replaced the value with the null which means the current value of the person variable is now empty.

JavaScript Undefined:

There’s only one value of type Undefined and that is undefined. By default, when we declare a variable and don’t initialize it with a value, it will have the undefined as its value. This means the variable is declared but we didn’t store a value into that variable yet.

Note: we could also explicitly store the value `undefined` to a variable that was initialized before.

JavaScript Undefined Data Type Example:

var num;
num = 20;
num = undefined;

In this example, when we declared the variable num in the first statement, its initial value was undefined. After that in the second statement, we’ve stored a value of type Number into that variable and so the value of the num is not of type Undefined anymore. In the last statement, again, we changed the value of this variable into undefined by explicitly storing this value into that variable.

Null vs Undefined

When we create a variable for the first time and didn’t initialize it with any value, it will have the default value of undefined. Basically this value is used to mentioned that the variable is declared but was not initialized yet!

On the other hand, the value null is of type object and it is assignable! It’s a way of representing a variable as an object though an empty one! Also when we assign this value to a variable, we’re basically initialize the target variable with a value (Although an empty object) and so it is not considered as an undefined variable anymore.

Example: creating null and undefined variables in JavaScript

<!DOCTYPE html>
<html>
<head>
<title>JS is fun :)</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script>
const nValue = null;
let undef;
console.log(typeof nValue);
console.log(typeof undef);
</script>
</body>
</html>
Output:
object
undefined

When developing a program in JavaScript, sometimes we want to know the type of the value that is stored in a variable. This is where the typeof operator can be helpful.

The typeof operator is covered in the next section.

A variable in JavaScript is capable of holding either of these data types mentioned above. Other than identifiers of type const (which can only be assigned once), the other variables can hold values of one type and reassign with values of different types.

For example:

var age = 28;
age = "John";
age = {

age:30

As you can see, the variable age at first hold the value 28 which is of type Number and in the next statement, we’ve changed the value from Number type to the String type. Also in the last statement, again, we’ve changed the value of the variable to be of type Object.

Besides the 8 data types that mentioned above, there are other sub-types like function, Array, Map, Set and a few others that are covered in later sections.