Primitive data types

We'll go over each of the primitive types one-by-one, starting with numbers.

1. Numbers

Numbers are everywhere when it comes to computing. They are used in arithmetic calculations, computer algorithms, data science, 3D modeling, transformations, artificial intelligence, and what not.

In programming, generally, numbers are categorized into two groups — integers and floats.

An integer is a whole number without a decimal point.

Examples include 0, 1, 100. A minus sign (-) can be included before the number to denote a negative integer. Examples include -30, -50, -100.

Integers are sometimes also referred to as fixed-point numbers.

Similarly,

A float, or floating-point number, is a number with a decimal point.

Example include 0.1, 3.878, -4589.4 and so on.

Some programming languages, such as Python, actually make this distinction between numbers by providing individual types for them.

However, JavaScript doesn't make any distinction between integers or floats whatsoever — we've got only one type for numbers in the language and that is the type 'number'.

In the snippet below we play around with a couple of numbers:

2 + 2

4

2 + 2.5

4.5

2.5 + 2.5

5

2.5 - 2

0.5

2 - 20

-18

All the numbers shown above are known as number literals.

What is a literal?

A literal is an exact representation for a value in the code.

We will go over numbers in detail in the JavaScript Numbers unit.

2. Strings

Another extremely common data type in JavaScript, and nearly all programming languages, is the string type. We've already seen strings in the previous chapters.

A string is a sequence of textual characters.

A string can be denoted using a pair of single quotes (''), or a pair of double quotes ("").

The following code shows two strings:

var lang = 'JavaScript';
var os = "Windows";

The first string is created using single quotes ('') while the second one is created using double quotes ("").

Recall that there is yet a third way to denote strings and that is using a pair of backticks (``). Such strings are called template literals and could contain JavaScript code within them. We'll learn more about template literals in JavaScript Strings — Basics.

Let's now talk about two vital concepts of strings.

Each character in a string sits at a given position, formally known as its index. Indexes begin at 0. This means that the first character is at index 0, the second one is at 1, and so on and so forth.

To access a given character in a string, we start by writing the string followed by a pair of square brackets ([]), and within them mention the index of the character, as an integer.

Consider the snippet below:

lang[0]

'J'

os[2]

'n'

In the first statement, lang[0], we access the first character of lang by putting the number 0 inside the square brackets. Similarly, in the second statement, os[2], we access the third character of the string os by writing the number 2 inside the brackets.

Apart from the index, another core concept of strings is that of the length. In particular, the total number of characters in a string is referred to as its length.

To get the length of a given string, we access its length property.

The syntax to access a property is easy: start by writing the value whose property you want to access, followed by a period character (.), followed by the name of the property.

Consider the snippet below where we access the length property on the strings lang and os defined above:

lang.length

10

os.length

7

The string lang, shown above, has 10 characters, hence the length 10. Similarly, os has 7 characters, hence the length 7.

But wait a minute. Didn't we say that a string is a primitive and that a primitive doesn't have properties/methods on it?

How come a string has a property?

Well, this is by virtue of JavaScript's behavior behind the scenes. Let's look into it.

How can a primitive in JavaScript have a property on it? Via autoboxing.

To restate it, a primitive can't have a property on it. Ever. However, this doesn't mean that we can't use a primitive in some way such that the final result has a property on it.

JavaScript internally performs what's known as autoboxing when it sees that we are trying to use a property on a primitive.

The idea of autoboxing is not specific to JavaScript; it's done by some other programming languages as well, such as C# and Java.

Essentially, excluding undefined and null, JavaScript defines wrapper classes (sometimes also referred to as wrapper types) for all primitive types, used to denote corresponding objects of those types. The nomenclature of these objects is also pretty intuitive.

Shown below are the five wrapper types corresponding to the five primitives:

1. Number for numbers

2. String for strings

3. Boolean for Booleans

4. BigInt for big integers

5. Symbol for symbols

Autoboxing is simply when JavaScript automatically boxes, i.e. wraps, a primitive value into an object based on its corresponding wrapper class.

So, for example, suppose that str is a variable holding a string. Accessing a property on str, like str.length would autobox str into a String object and then access the property on the object before deleting the object.

To help understand this better, consider the following code:

var str = 'Autoboxing';
console.log(str.length);

When the expression str.length in line 2 is encountered, as stated before, autoboxing happens.

Behind the scenes, here's what actually gets executed:

var str = 'Autoboxing';
var strBoxed = new String(str);
console.log(strBoxed.length);
strBoxed = undefined;

• First, the value str is boxed using its corresponding wrapper type String and stored in a temporary variable called strBoxed. (We'll learn more about the new keyword and the String class later on in this course.)

• Then, the property length is accessed on this wrapper object strBoxed and then the result logged to the console. Since strBoxed is an object (not a primitive), it makes perfect sense for it to have a property available on it.

• Finally, this temporary variable is deleted from memory, which could best be shown in JavaScript code by setting the temporary variable to undefined.

Keep in mind that what we've shown above is just for the sake of visualizing autoboxing in JavaScript code. For example, there isn't actually a variable such as strBoxed created to store the wrapper object for the variable str shown above — it's purely created to help you understand autoboxing.

How exactly autoboxing is performed is completely implementation-dependent. But it's definitely a thing in JavaScript, and likewise, worth knowing.

So was understanding autoboxing easy?

3. Booleans

The third in this list is Booleans.

A Boolean is simply a true or false value.

Booleans are used extensively in conditional programming to control program flow by making decisions on the outcomes of given evaluations.

The name 'Boolean' is given in honour of the notable British mathematician, George Boole, who made many important contributions to modern-day Boolean algebra and logic. He is called the 'father of symbolic logic'.

In JavaScript, a Boolean is denoted using the literal values true and false.

The following code creates two Boolean variables:

var proceed = true;
var stopNow = false;

We'll go over Booleans and their applications in detail in the JavaScript Booleans chapter.