677

In this tutorial, you’ll learn about JavaScript primitive and non-primitive data types including String, Number, Boolean, Null, Undefined, Symbol, Object, Array, Function, RegEx, Date.

Understand data types of JavaScript in depth in a simple way. A value in JavaScript is always of a certain type. For example, a string or a number.

JavaScript provides different data types to hold different types of values. There are two types of data types in JavaScript.

1. Primitive data type
2. Non-primitive (reference) data type

JavaScript has the primitive data types

• JavaScript is a dynamically typed language. It means that a variable doesn’t associate with a type. In other words, a variable can hold a value of different types.

let data = 120;      // data is a number
data = false;         // data is now a boolean
data = "foo";        // data is now a string

To know the type of the value that the variable stores, you use the typeof operator

let data = 120;
console.log(typeof(data)); // "number"

data = false; 
console.log(typeof(data)); // "boolean"

data = "Hi";
console.log(typeof(data)); // "string"

In JavaScript, there are six type of primitive data types. They are as follow

Datatypes	Description
String	represents sequence of characters e.g. “hello”
Number	represents numeric values e.g. 100
Boolean	represents boolean value either false or true
Undefined	represents undefined value
Null	represents null i.e. no value at all
Symbol	Symbol is unique and immutable.

Let’s see each data type one by one.

• The String Type

In JavaScript, a string is a sequence of one or more characters. It must be enclosed in single or double quotation marks.

Consider the following examples

let greeting = 'Hi';
let foo = "It's a valid string";
let bar = 'I'm also a string';

JavaScript strings are immutable. It means that you cannot modify a string once it is created. However, you can create a new string based on an operation on the original string, like this

let myStr = 'js';
myStr = myStr + ' world';

In this example ,first declared the myStr variable and initialize it to a string of ‘js’. Second, use the + operator to combine ‘js’ with ‘ world’ to make its value as ‘js world’. Behind the scene, JavaScript engine creates a new string that holds the new string ‘js world’ and destroys two other original strings ‘js’ and ‘ world’.

• The Number Type

There is only one number type. There is no specific type for integers. Number can written with or without a decimal point. It is able to represent floating-point numbers, the number type has three symbolic values: +Infinity, -Infinity, and NaN (not-a-number).

Many operations can be done with numbers e.g. multiplication *, division /, addition +, subtraction -, and so on.

var num1 = 10;
var num2 = 15.5;

var num3 = 20 / +0;
console.log(num3); // show result Infinity

var num4 = 20 / -0;
console.log(num4); // show result -Infinity

• The Boolean Type

The boolean datatype variable holds only one value, which can be true or false, in lowercase.

Both the cases are shown below, one with true and one with false boolean value.

let a = true;
let b = false;
console.log(typeof b); // boolean

• The Undefined Type

The undefined data type in JavaScript occurs when a variable is defined but a value is not specified.

var cityName; //variable declared but not defined.
console.log(cityName);

Note: Meaning of undefined is “value is not assigned”.

• The Null Type

The null data type variable contains only null value. Javascript defines that null is an empty object pointer.

var name = null;
console.log(typeof name); // object

In the above example, name variable is defined as null , when you try to find the type of this variable its object which is an empty object pointer.

• The Symbol Type

New in ECMAScript6. A Symbol is unique and immutable(cannot be changed) datatype.

// two symbols with the same description

const value1 = Symbol('hello');
const value2 = Symbol('hello');

console.log(value1 === value2); // false

In the above case, Although value1 and value2 both contain the same description, they are different.

JavaScript non-primitive data types

In javascript, non-primitive data types can hold collections of values and more complex entities. Let’s discuss each one of them in detail.

The non-primitive data types are as follows

Datatypes	Description
Object	represents instance through which we can access members
Array	represents group of similar values
Function	represents boolean value either false or true
RegEx	represents regular expression
Date	represents undefined value

• The Object Type

In JavaScript, objects can be seen as a collection of properties. JavaScript objects are written with curly braces {}. The properties are stored in key value pairs. Property values can be values of any type, including other objects.

var product = {
name: "Watch", 
price: 50.20, 
quantiy: 20, 
description: "It is product description"
};

• The Array Type

An array is a non-primitive data type in js, which is used to store multiple values in a single variable. Each elements an array has a numeric position, known as its index. Using the index, can access values from an array.

The following example defines an array with values

let colors = ["Red", "Yellow", "Green", "Pink"];

To access values from an array variablename[index]

console.log(color[0]) // Red

• The Function Type

In JavaScript, a function allows to define a block of code, give it a name and then execute it as many times. So it is possible to assign them to variables.

The following example defines a function named say that has a return value “Hello World”.

var say = function(){ 
    return "Hello World!"; 
}

// Check the type of greeting variable
console.log(typeof say) // Output: function
console.log(say());     // Output: Hello World!

• The RegEx Type

Regular expressions (called Regex or RegExp) are patterns that we can use to match character combinations in strings. These are used in many languages for text processing and manipulations.

In JavaScript, regular expressions also function as objects and are represented by the native RegExp object. By forming a search pattern with Regex, we can easily search for data and make our work more productive.

• The Date Object

The Date object is a datatype built into the JavaScript language. Date objects are created with the new Date( ) as shown below.

You can use any of the following syntaxes to create a Date object using Date() constructor.

new Date( )
new Date(milliseconds)
new Date(datestring)
new Date(year,month,date[,hour,minute,second,millisecond ])

Having fun learning JavaScript!