JavaScript Primitive Data Types – Be on the Right Side of Change

In this tutorial, we will learn everything about JavaScript DataTypes. We will get to know the different kinds of data types, how to determine data types, and how to convert them into other data types.

In short, JavaScript has seven primitive data types, namely: String, Number, BigInt, Boolean, undefined, null, and Symbol.

Besides that, there are JavaScript objects, but they will be part of another JavaScript tutorial. This tutorial will focus on primitive data types exclusively.

We determine the data type of a variable with the typeof operator.

And since JavaScript is a dynamically typed language, we do not have to specify the data type of a newly created variable.

Also, data types are automatically converted when we reassign a variable to a new value of a different data type.

Great documentation about JavaScript data types can be found here.

This is part of our Learn JavaScript series:

Primitive Data Types

Primitive data types are types that are already built into the programming language. They are the most basic form of data type, and they are very different from each other. JavaScript treats variables differently depending on the data type these variables have.

There are seven primitive data types which we will now discuss one after the other.

String

A string is just a series of characters used to represent some form of text.

Let’s have a look at an example:

let word1 = "Hello!";

We create the variable word1 using the keyword let. We assign this variable the value "Hello!" which is a string. We put the content of the text inside double-quotes.

Alternatively, we can use single quotes as well:

let word2 = 'House';

Whether we use double quotes or single quotes is a matter of taste. However, when we have apostrophes in our text, it’s necessary to use double quotes:

let sentence = "It's nice to meet you!";

because this would not work:

let sentence = 'It's nice to meet you!';

The computer thinks that the string ends after "It" and does not know what to do with the rest of the line of code.

Thus, if we create our string with double quotes, we cannot use double quotes within the string, and if we create our string with single quotes, we cannot use single quotes within the string.

Number

The Number data type is one of two numeric data types that JavaScript provides us with.

A number can be an integer or a decimal:

let x = 5;
let y = 2.1;

Here, we declare two variables x and y. Variable x is assigned the integer value 5 and y is assigned the decimal value 2.1.

With numbers, we can perform arithmetic operations, like addition, subtraction, multiplication, division, etc.

let z = x + y;
console.log(z);
>>> 7.1

We declare the variable z and assign it the sum of x and y. When we output z with console.log(), we can see that the sum of x and y is 7.1.

BigInt

The other numeric data type is BigInt which can represent integer values of arbitrary length. The Number data type, however, has limitations.

We create BigInt numbers by adding the letter n to the end of an integer value:

let a = 43158490244031231567560143649357809134n;
console.log(a);
>>> 43158490244031231567560143649357809134n

We create this huge integer number and add the letter n as a suffix. When we output the value of the variable that we assigned this value, the output shows the exact same number.

When we do the same without an n, this is what we get:

let b = 43158490244031231567560143649357809134;
console.log(b);
>>> 4.315849024403123e+37

This way, the output is much less precise than before.

Boolean

A Boolean can have two values: true or false.

let booleanValue1 = true;
let booleanValue2 = false;

The first variable has the value true and the second one has the value false. We can use boolean expressions in if statements or in loops.

For example:

if (booleanValue2) {
    console.log("Hey guys!");
}
>>>

As we can see, this code snippet does not produce any output.

The if statement checks if the statement inside the parenthesis is true or false. Since booleanValue2 is set to false, the console.log() statement is not executed.

Let’s have a look at another example:

if (booleanValue1) {
    console.log("Hey guys!");
}
>>> Hey guys!

The only thing we changed here was we replaced booleanValue2 with booleanValue1. Since booleanValue1 is true, the console.log() statement will be executed and we get an output.

Undefined

When we declare a variable and we do not assign it a value, the value of this variable is undefined:

let d;
console.log(d);
>>> undefined

When we assign this variable for example a numeric value it is not undefined anymore:

d = 4;
console.log(d);
>>> 4

However, we can set the variable back to undefined:

d = undefined;
console.log(d);
>>> undefined

Null

The null value in JavaScript represents a value that is nonexistent.

let n = null;
console.log(n);
>>> null

One might think that null is the same as undefined.

But there are differences between these two. We must explicitly set a variable to null to make it null, whereas a variable is automatically set to undefined when we do not assign it a value.

So, null values are nonexistent and undefined values are not yet existent.

Symbol

Symbols can be used as unique values. They are created with the Symbol() function:

let symbol1 = Symbol("Symbol");
let symbol2 = Symbol("Symbol");

Here, we create two symbols: symbol1 and symbol2. Both symbols contain the same description ("Symbol").

Let’s check if they are unique. We achieve that with the strict equality operator ===:

console.log(symbol1 === symbol2);
>>> false

When we compare the symbols with the strict equality operator, we get the result false. That shows us that these two symbols are unique.

This is where Symbols differ from strings because if we do the same with strings, this happens:

let string1 = "Hi!";
let string2 = "Hi!";
console.log(string1 === string2);
>>> true

We create two identical strings. When we compare them with the strict equality operator, the result is true since these strings are actually identical.

Determine Data Type with typeof Operator

We use the typeof operator to determine the data type of a variable. This is useful when we don’t know what data type a certain variable has.

let x1 = 5;
console.log(typeof (x1));
>>> number

We assign the newly declared variable x1 the number 5.

Then we check the type of x1 with the typeof operator and put it inside a console.log() statement to output the type.

The output says that the type of x1 is number.

Data Type Conversion

Since JavaScript is a dynamic language, we do not have to specify the type of a variable when declaring it:

let v = 3;
console.log(typeof(v));
>>> number

We declare the variable v and assign it the value 3. When we output the type of this variable, we can see that the type of v is number although we never specified that.

Due to these dynamic features, we can reassign the variable v a value of another type easily:

v = "Hello";
console.log(typeof(v));
>>> string

We assign the variable the string "Hello". And when we output the type of v now, we can see that we successfully changed the type to string.

Summary

All in all, we learned about the different data types that JavaScript provides us with. We learned the data type’s characteristics, how to determine the data type of a variable, and how to reassign variables to values of another data type.

If you wish to learn more about JavaScript, stay tuned for the other tutorials that are being released to Finxter.

And for more tutorials about other computer and data science-related topics, check out the Finxter email academy!

Happy Coding!