Understanding JavaScript Data Types
The ‘Symbol’ data type is new in JavaScript. It has been included in the ES6 version. We can find the type of value or data by using the ‘typeof’ JavaScript operator. The above data types in JavaScript are divided into two broad categories, primitive and non-primitive.
JavaScript is a loosely typed or a dynamic language. Variables in JavaScript are not directly associated with any particular value type, and any variable can be assigned.
Var can be used to specify the data type. It can hold any type of values such as numbers, strings .
JavaScript primitive data types are data types that refer to a single value.
Here the variable ‘a’ is an integer data type and has a single integer value. The variable ‘a’ refers to a single value in memory. If we want to change the value of a, we would have to assign a new value to a. Primitive data types are not mutable.
When we create a variable, it reserves a space for itself in the memory. The variable ‘a’ has space in memory which holds its value. When we try to change the value of ‘a’ by assigning another value like var a = 6, it doesn’t alter the value of the original a, it just creates a new variable ‘a’ with the new value 6.
We can assign the value of ‘a’ to another variable like this:
var a1=a;
Here the variable ‘a1’ is assigned the value of ‘a’, not the address of ‘a’ in memory. Thus ‘a1’ now holds the same value as ‘a’.
We can compare the two variables ‘a’ and ‘a1’ as the two variables refer to the same value now.
Using the comparison operator will return a Boolean value of ‘true’.
checks both the value and type of these two variables are true.
JavaScript non-primitive types are objects.
An object holds a reference/address of a single key-value pair or many key-value pairs. Whenever we refer to an object, we refer to an address in memory which contains the key-value pair. If we assign an object ‘object1’ to another object ‘object2’, we are actually assigning the address of ‘object1’ to ‘object2’ instead of the key-value pair which the ‘object1’ contains in memory. Let’s see below”.
The statement assigns the address of object2 to object1, and not the value {a:5, a1:6}. Thus with this assignment ‘object1’ and ‘object2’ refer to the same address in memory.
When we compare these two objects, we find that both of them refer to the same address in memory.
This statement object1===object2 // would return a false because both the objects refer to two separate addresses in memory. When we compare two objects, we compare their addresses, not their values.
Hence, primitive data types refer to a ‘single value’ in an address in memory whereas non-primitive data types refer to the ‘address’ in memory which contains single or multiple key-value pair/s.
Primitive Data Types
- Primitive data types are number, string, boolean, NULL, Infinity and symbol.
- Non-primitive data types is the object. The JavaScript arrays and functions are also objects.
Numbers:
A number data type can be an integer, a floating point value, an exponential value, a ‘NaN’ or a ‘Infinity’.
We can create a number object using the ‘new’ operator and the Number() constructor:
String:
The string data type in JavaScript can be any group of characters enclosed by a single or double-quotes or by backticks.
Like the ‘number’ and the ‘boolean’ data types, a ‘String’ object can be created using the ‘new’ operator:
Boolean:
The boolean data type has only two values, true and false. It is mostly used to check a logical condition. Thus Booleans are logical data types which can be used for comparison of two variables or to check a condition. The true and false implies a ‘yes’ for ‘true’ and a ‘no’ for ‘false in some places when we check a condition or the existence of a variable or a value.
When we check the data type of ‘true’ or ‘false’ using typeof operator, it returns a boolean.
Let’s see an example of comparison statement:
A boolean value is also used to check a condition in an expression:
If the above condition ‘a<b’ is true, the alert will pop on the screen.
We can create a new Boolean variable using the Boolean() function.
The Boolean() function converts a non-boolean value to a boolean value.
Undefined:
Undefined data type means a variable that is not defined. The variable is declared but doesn’t contain any value.
var a; console.log(a); // This will return undefined.
The variable ‘a’ has been declared but hasn’t been assigned a value yet.
We can assign a value to a:
a=5; console.log(a); // This will return 5
Null:
The null in JavaScript is a data type that is represented by only one value, the ‘null’ itself. A null value means no value.
Something like this:
If we check the data type of a using the typeof operator, we get:
This means the type of a null value is an object, not null.
Symbol:
The ‘symbol’ data type is new in es6. It is one of the new features of es6. The symbol data type defines a property of an object which is private to the object. It refers to the ‘key’ of the key-value pair of an object.
The function Symbol() is used to create a new symbol. Here we have created a symbol ‘occupation’ with the value ‘engineer’ for the above object ‘object1’.
Every symbol is unique. Two Symbols even with the same key values are not same.
occupation===occupation // returns false. Thus both the above ‘occupation’ symbols are different. Each one is a unique property of the object.
We cannot create a symbol object using the ‘new’ operator because the Symbol() cannot be used as a constructor.
The string description inside Symbol() function is optional.
Checking the type of ‘occupation’ symbol:
The Non-Primitive Data Types
The ‘object’ is a non-primitive data type in JavaScript. Arrays and Functions in JavaScript belong to the ‘object’ data type.
Object:
Let’s create an object literal. An object in JavaScript contains key-value pairs in its address. When we refer to obj1, we are actually referring to the address in memory which contains the value {a: 5, b: 6}, instead of the value {a: 5, b: 6} directly.
We can change or mutate the value of obj1.
Thus the value has changed successfully.
When we check the value of obj1 using the typeof operator, it returns an object.
Array:
An array in JavaScript is an object data type. An array contains more than one value with a numerical index, where the index starts from 0. Thus it holds its value in a key-value pair.
We cannot mutate or change the above array arr1.
Suppose we try to change its value.
The array ‘arr1’ refers to the address in memory which contains the value [4, 2, 3].
Function:
JavaScript doesn’t have a function data type but when we find the data type of a function using the typeof operator, we find that it returns a function. This is because a function is an object in JavaScript. Ideally the data type of a function should return an object but instead, it returns a function. This is an error in JavaScript.
Difference Between Undefined and Null
These are two different data types of JavaScript. When a variable is declared but has not been assigned a value yet, the data type of that variable is undefined.
Null is a data type in JavaScript but it is mainly used as a value that is assigned to a variable. Assigning a null to a variable means that the variable contains no value, similar to the meaning of ‘undefined’ which also means empty value.
There are differences between NULL and undefined data types though both contain the same value. Like other programming languages, JavaScript also has some in-built language errors or discrepancies which is found in the NULL data type and the data type of JavaScript functions.
Conclusion
Understanding how we classify data types is a fundamental skill to posses when moving forward with JavaScript. In this article, we looked at what distinguishes each datatype.