Home » JavaScript » JavaScript Data Types

JavaScript Data Types - Primitive and Non-Primitive

JavaScript Data types are used to specify the 'type' of value stored by a variable like integer, character,etc..

Types of DataTypes in JavaScript

There are two types of Data Types in JavaScript:

Primitive data type
Non-Primitive data type

JavaScript is a dynamic language, i.e. there is no need to specify the 'type' of the variable because it is dynamically(automatically) used by JavaScript engine. You just need to use var to specify the data type. It can hold any type of values such as numbers, strings, boolean, etc.

Syntax:

var a = 40; //hold Numaric values
var b = "Rahul"; //hold string

JavaScript Primitive Data Types

JavaScript Primitive data types can hold only one value at a time.

There are 3 types of primitive data types in JavaScript:

Data Type	Description
Number	Represents numeric values e.g. 10.
String	represents sequence of characters e.g. "Hello".
Boolean	Represents boolean value either True or False.

JavaScript Number Data Type

JavaScript number data type is used to represent positive or negative numbers with or without decimal place.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Number DataType </title>
</head>
<body>
<script>
// Creating variables
var a = 25;
var b = 75.5;
var c = 4.25e+6;
var d = 4.25e-6;
// Printing variable values
document.write(a + "<br>");
document.write(b + "<br>");
document.write(c + "<br>");
document.write(d);
</script>
</body>
</html>

Output

JavaScript Number DataType

The Number data type also includes some special values which are: Infinity, -Infinity and NaN(Not a number). Infinity represents the mathematical Infinity ∞, which is greater than any number. Infinity is the result of dividing a nonzero number by 0, as demonstrated below:

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Infinity & NAN Number DataType </title>
</head>
<body>
<script>
document.write(1.7976931348623157E+10308);
document.write("<br>");
document.write(-1.7976931348623157E+10308);
document.write("<br>");
document.write("Some text" / 2);
document.write("<br>");
document.write("Some text" / 2 + 10);
document.write("<br>");
document.write(Math.sqrt(-1));
document.write("<br>");
document.write(10/"text");
</script>
</body>
</html>

Output

JavaScript Infinity & NAN Number DataType

JavaScript String Data Type

The String data type can hold multiples characters in a sequence like "Ansh", "Roger".

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript String DataType </title>
</head>
<body>
<script>
document.write( "CSS " + 3 + "<br>");
document.write( "HTML " + 5 + "<br>");
document.write( "Bootstrap " + 4 + "<br>");
</script>
</body>
</html>

Output

JavaScript String DataType Example

Note : When adding a number and a string, JavaScript will always treat the number as a string.

JavaScript Boolean Data Type

JavaScript Boolean data type can hold only two values: true or false. It is typically used to store values like yes (true) or no (false), on (true) or off (false), etc.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Boolean DataType </title>
</head>
<body>
<script>
// Creating variables
var isPlaying = true; // Yes, I'm Playing
var isEating = false; // No, I'm not Eating
// Printing variable values
document.write(isPlaying + "<br>");
document.write(isEating);
</script>
</body>
</html>

Output

JavaScript Boolean DataType

Boolean values also come as a result of comparisons in a program. The following example compares two variables and shows the result in an alert dialog box.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Compare Boolean DataType </title>
</head>
<body>
<script>
var a = 5, b = 10, c = 15;
document.write(b > a) // Output: True
document.write("<br>");
document.write(b > c) // Output: False
</script>
</body>
</html>

Output

JavaScript Compare Boolean DataType

JavaScript Non-Primitive Data Types

Non-Primitive data types are as follows:

Datatypes	Description
Object	It is an instance through which we can access members.
Array	Collection of Homogenious Elements.
RegExp	Represents regular expression
Function	Block of code.

JavaScript Object Data Type

The object is a complex data type that allows you to store collections of data. An object contains properties, defined as a key-value pair. A property key (name) is always an identifier, but the value can be of any data type, like strings, numbers, booleans, or complex data types like arrays, function and other objects.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Object Datatype </title>
</head>
<body>
<script>
var greet = "Hello JavaScript"
// Print variable value in browser's console
document.write(greet);
</script>
</body>
</html>

Output

JavaScript Object Datatype

JavaScript Array Data Type

An array is a collection of multiple values in single a variable. Each value (also called an element) has a numeric position, known as its index, and it may contain data of any data type. The array index starts from 0, so that the first array element is arr[0] not arr[1].

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Array Datatype </title>
</head>
<body>
<script>
// Creating arrays
var Laptops = ["Dell", "HP", "Microsoft Surface", "Xiaomi"];
var Smartphone = ["OnePlus", "Samsug", "Google Pixel"];
// Printing array values
document.write(Laptops[0] + "<br>"); // Output: Dell
document.write(Smartphone[2]); // Output: New Google Pixel
</script>
</body>
</html>

Output

JavaScript Array Datatype

Special Data Types

Datatypes	Description
Undefined	Represents undefined value.
Null	Represents null i.e. no value at all.

JavaScript Undefined Data Type

If a variable has been declared, but has not been assigned a value, has the value undefined.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Undefined Datatype </title>
</head>
<body>
<script>
// Creating variables
var a;
var b = "Hello JavaScript!"
// Printing variable values
document.write(a + "<br>");
document.write(b);
</script>
</body>
</html>

Output

JavaScript Undefined Datatype

JavaScript Null Data Type

This is another special data type that can have only one value-the null value. A null value means that there is no value. It is not equivalent to an empty string ("") or 0, it is simply 'null' nothing.

Example Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript Null Datatype </title>
</head>
<body>
<script>
var a = null;
document.write(a + "<br>"); // Print: null
var b = "Hello World!"
document.write(b + "<br>"); // Print: Hello World!
b = null;
document.write(b) // Print: null
</script>
</body>
</html>

Output

JavaScript Null Datatype Example

Recommended :

1 . Types of Operators in JavaScript
2 . While loop in JavaScript
3 . Functions in JavaScript
4 . Document Object model

5 . Type Conversion
6 . Dialog Boxes
7 . Create Bootstrap 4 Spinner
8 . Photography Snippets using HTML and CSS

Web Developement Courses
BootStrap Snippets
JS Keywords
Form Events
CSS Navbar
JS Objects
Cookies
Forms
Icons
Buttons
Progress
Footer
Errors