What are the Different Data Types in JavaScript?

Introduction

Are you familiar with the various data types used in JavaScript? If not, you’re at the proper spot. In this article, you’ll learn about the different data types in JavaScript by looking at some practical examples. Let’s have a look at them.

To create dynamic and user-friendly websites, programmers turn to JavaScript, a robust language. It’s a scripting language that works with text and has built-in support for specifying the data type of a variable. You can declare variables in JavaScript without specifying their data types because the language is dynamically typed. A variable in JavaScript can take on any value. In this post, we’ll go through several examples that illustrate the most frequently used data types in JavaScript. Learn Java from the top Java training institute in Chennai to master every concept of Java.

Different Data Types in Java

A program’s data storage and manipulation capabilities are largely determined by the data types it recognizes and supports. Primitive (also known as primary), composite (sometimes known as reference), and special data types are the three principal classifications that can be used to organize JavaScript’s six fundamental data types. Primitive data types include things like strings, numbers, and booleans. Composite data types include Object, Array, and Function, all of which are types of objects in and of themselves. In contrast, Undefined and Null are both considered to be special data types.

Primitive data types are limited to storing only a single value at a time, but composite data types are able to store collections of values as well as entities with a higher level of complexity. Let’s go through each of them one by one and discuss them in depth.

The String Data Type

The string data type is employed wherever there is a need to represent textual information (i.e. sequences of characters). Strings can be created by enveloping one or more characters in single or double quotation marks, as shown in the following example:

Illustration of String Data Type

var a = “Hi All! “; / Enclosed the value within single quotes

var b = “Hi All!”; / Enclosed in double quotation marks

You are free to put quotation marks within the string so long as those quote marks do not match the quotes that enclose the string.

Illustration of String Data Type

var x = “They’re planning for a surprise.”; / single quote within double quotes

var y = ‘Hari shouted “Hurrah” and jumped .’; / double quotes within single quotes

var z = ‘Shiva\’ll never come again.’; // escaping single quote via backslash

The Number Data Type

Positive or negative integers, with or without a decimal point, as well as values expressed using exponential notation, such as 5.4e-8, can all be represented using the number data type (equivalent to 5.4×10-8).

Illustration of Number Data Type

var u = 17; // integer

var v = 21.9; // floating-point number

var w = 1.92e+4; // exponential notation, same as 1.92e4 or 19200

var d = 5.15e-7; // exponential notation, same as 0.000000515

The Number data type additionally supports several unique values, such as Infinity, -Infinity, and NaN. These values are included in the type. In mathematics, infinity is denoted by the symbol and is defined as an amount that is greater than any number. As may be seen in the examples that follow, infinity is produced when a nonzero number is divided by 0.

Illustration of Number Data Type

alert(63 / 0); // Output: Infinity

alert(-261 / 0); // Output: -Infinity

alert(1111/ -0); // Output: -Infinity

whereas the value represented by NaN is a unique instance of Not-a-Number. It is the outcome of a mathematical operation that either cannot be performed or cannot be defined, such as calculating the square root of -1 or dividing 0 by 0, etc.

Illustration of Number Data Type

alert(“Come again” / 2); // Output: NaN

alert(“Sweet memory” / 2 + 10); // Output: NaN

alert(Math.sqrt(-1)); // Output: NaN

The Boolean Data Type

The only two values that can be stored in a Boolean data type are true and false. In most cases, it is utilized to store values like yes (true) or no (false), on (true) or off (false), etc., as will be illustrated in the following example:

Illustration of Boolean Data Type

var isWalking = true; / Yes, I am walking

var is Car = false; / No, That is not cat

In a computer program, comparisons can also lead to the production of boolean values. The following illustration makes a comparison between two variables and displays the findings in an alert dialog box:

Illustration of Boolean Data Type

var a = 15, b = 7, c = 1;

alert(b > a) / Output: false

alert(b > a) / Output: false

Want to do a master program in Java programming language? Reach out to us at SLA to enroll in the top Java training in Chennai.

The Undefined Data type

The data type undefined can only ever have one value, and that is the special value “undefined.” The value of a variable is considered undefined if it has been declared but has not been given a value to replace it.

Illustration of Undefined Data Type

var x;

var y = “Welcome All”;

alert(a) // Output: undefined

alert(b)// Output: Welcome All

The Null Data Type

This is another specialized data type that is only capable of holding a single value—the value of null. A value that is null indicates that there is no value present. It is not the same as a value of 0 or an empty string (“), but rather it is nothing at all.

By giving a variable the value null, its previous contents can be removed from it in a direct and deliberate manner.

Illustration of Null Data Type

var a = null; 

var a = null; 

var b = “India is my country!” 

alert(b);// Output: India is my country

b = null; 

alert(b) // Output: null

The Object Data Type

The object is a sophisticated data type that gives you the ability to store various data sets.

Properties, which are defined as key-value pairs, are contained within an object. The value of a property can be of any data type, including simple data types like strings, numbers, and booleans, or complicated data types like arrays, functions, and other objects. A property’s key, however, is always a string. In the following chapters, you will get further knowledge regarding various objects.

The following illustration will walk you through the most straightforward approach to generating an object using JavaScript.

Illustration of Object Data Type

var emptyObject = {};

var individual = {“name”: “Chandra”, “surname”: “Sekhar”, “age”: “28”};

// For better reading

var Phone = {

    “Brand”: “Samsung”,

    “Model”: “A11”,

    “sim”: 2

}

If the property name is a valid JavaScript name, you do not need to include quotation marks around it. That indicates that quotation marks are necessary around the phrase “first name,” but they are not necessary around the actual first name. Therefore, the object represented by the phone in the above example may also be written as:

Illustration of Object Data Type

var phone = {

    Brand: “Samsung”,

    Model: “A11”,

    Sim: 2

}

The Array Data Type

A sort of object known as an array can be used to store a number of different values in a single variable. It is possible for a value (also called an element) in an array to include data of any data type, including numbers, strings, booleans, functions, objects, and even other arrays. Each value in an array has a numeric position that is known as its index. Because the array index begins at 0, the first element of the array is not arr[1}, but rather arr[0].

Specifying the items of an array as a comma-separated list that is then encased in square brackets is the most straightforward method for creating an array, as demonstrated in the following example:

Illustration of Array Data Type

var directions = [“East”, “West”, “North”, “South”]; 

var firms = [“HCL”, “HP”, “CTS”, “TCS”]; 

alert(directions[0]); // Output: East

alert(firms[2]); // Output: CTS

Learning Java is made simple with SLA’s Java training in Chennai that is composed of immersive curriculum covering basics to advanced concepts, hands-on-training, true professionals as instructors, and extensive instruction. Enroll

The Function Data Type 

The function is an object that can be called to carry out an action on some code. Given that functions are themselves objects, it is feasible to assign them to variables, as will be seen in the following example:

Illustration of Function Data Type

var wishes = function(){

    return “Good Morning!”;

}

// Check the type of wishes variable

alert(typeofwishes) // Output: function

alert(wishes()); // Output: Good Morning!

In point of fact, functions can be used anywhere that one might use any other type of value. Variables, objects, and arrays are all suitable storage locations for functions. Functions can be passed on to other functions as arguments, and functions can return other functions as a result of their execution. Take into consideration the following operation:

Illustration of Function Data Type

function createWishes(name){

    return “Hi, ” + name;

}

function displayWishes(WishesFunction, userName){

    return wishesFunction(userName);

}

var result = displayWishes(createWishes, “Harini”);

alert(result); // Output: Hi, Harin

The typeof Operator

Finding out what kind of data a variable or operand stores can be accomplished with the use of a special operator called typeof. It is possible to use it either with or without the parenthesis (typeof x or typeof (x)).

The typeof operator is especially helpful in circumstances in which you need to process the values of different types in a distinct manner; however, you must exercise extreme caution when using it because, in certain circumstances, it can produce results that are unexpected, as will be demonstrated in the following example:

// Numbers

typeof 123;  // Returns: “number”

typeof 721.37;  // Returns: “number”

typeof 9.5e-6;  // Returns: “number”

typeof Infinity;  // Returns: “number”

typeof NaN;  // Returns: “number”. Despite being “Not-A-Number”

// Strings

typeof ”;  // Returns: “string”

typeof ‘welcome’;  // Returns: “string”

typeof ‘567’;  // Returns: “string”. Number within quotes is typeof string

// Booleans

typeof true;  // Returns: “boolean”

typeof false;  // Returns: “boolean”

// Undefined

typeof undefined;  // Returns: “undefined”

typeof undeclaredVariable; // Returns: “undefined” 

// Null

typeof Null;  // Returns: “object”

// Objects

typeof {name: “Mark”, age: 21};  // Returns: “object”

// Arrays

typeof [3, 5, 7];  // Returns: “object”

// Functions

typeof function(){};  // Returns: “function”

When we tested the null value with the type of operator, as you can see quite clearly in the example that was just presented, the result was “object” rather than “null.” 

This is a bug that has been present in JavaScript for a very long time; however, due to the fact that lots of codes on the internet are written around this behavior, and therefore fixing it would create a lot more problems, the committee that designs and maintains JavaScript decided against the idea of fixing this issue. Join the Java certification training in Chennai and upskill yourself.

Two Data Type Disparities in JavaScript 

If we find out the data type of null, the function should return null, but in practice, it returns the data type of an object.

It’s a little confusing, isn’t it, because the data type for null is actually an object and not null? Theoretically speaking, it ought to be null, but JavaScript has a bug that causes this mismatch, which we will have no choice but to accept and work around.

The data type of a function in JavaScript is another topic that has been brought up for discussion. When we ask a JavaScript function to return its data type, we get another function in return. Since we are aware that JavaScript does not support a function data type, we are perplexed as to why this error message displays a function data type.

The important thing to remember is that a function data type is, in fact, an object. The properties of an object are a part of every function in JavaScript. The fact that a function in JavaScript returns another function as its data type rather than being an object is merely an oversight in the programming language. This, too, is something that we have to accept and keep in mind.

The Data Types in JavaScript article is now complete with this section’s completion. To summarize, JavaScript supports a variety of data types, including primitive and non-primitive data types. Number, String, Boolean, NULL, and Undefined are the seven primitive data types, and Symbol is the only non-primitive data type. Object belongs to the category of non-primitive data type. Abstract class in Java is also an essential concept to be learned to master Java programming.

Despite the fact that both NULL and undefined data types store the same value, there are notable distinctions between the two. Similar to other programming languages, JavaScript contains various language faults or discrepancies that are built-in. These errors and discrepancies may be found in the NULL data type and the data type of JavaScript functions, respectively. 

Bottom line

If you are just starting off, then make enrollment in our JavaScript training in Chennai to get an understanding of the core concepts of Java. In this post, we provide an explanation of the various data types that can be used in JavaScript along with examples. We hope that you came away from this blog post with a deeper comprehension of the subject matter and are now better able to move on to the next step, which is writing JavaScript programs that are efficient. Good luck.