JavaScript Data Types

In this tutorial you will learn importance of data types and JavaScript data types.

Variables can contain many different kinds of values—for example, A person’s name, phone numbers, a person’s height, or a person’s age etc. Data types specify what kind of data, such as numbers and characters, can be stored and manipulated within a program.

A variable’s specific data type is very important in programming because the data type helps determine how much memory the computer allocates for the data stored in the variable. The data type also governs the kinds of operations that can be performed on a variable.

Variables in JavaScript can hold any type of data without specifying a strict data type. Such programming languages are referred to as dynamically typed languages or loosely typed languages, i.e. data types exist but are not strictly bound to the variables.

Many programming languages require that you declare the type of data that a variable contains. Programming languages that require you to declare the data types of variables are called strongly typed programming languages. A strongly typed language is also known as statically typed, because data types do not change after they have been declared.

Programming languages that do not require you to declare the data types of variables are called loosely typed or duck typed programming languages. A loosely typed language is also known as dynamically typed, because data types can change after they have been declared.

JavaScript is a loosely typed programming language. In JavaScript, you are not required to declare the data type of variables and, in fact, are not allowed to do so. Instead, a JavaScript interpreter automatically determines what type of data is stored in a variable and assigns the variable’s data type accordingly.

The following code demonstrates how a variable’s data type changes automatically each time the variable is assigned a new literal value:

Example: Try It

data = "Hello World"; // String
data = 8; // Integer number
data = 5.367; // Floating-point number
data = true; // Boolean
data = null; // Null

JavaScript supports a number of fundamental data types. These types can be broken down into two categories, primitive data types and composite data types.

Data types that can be assigned only a single value are called primitive types. They are types that can be assigned a single literal value such as the number 5.7, or a string of characters such as 'hello'.

Data types can hold collections of values and more than one values are called as composite data type or complex datatype.

String, Number, and Boolean are primitive data types. Object, Array, and Function (which are all types of objects) are composite data types. Whereas Undefined and Null are special data types.

The Number Data Type

JavaScript supports both integers and floating-point numbers. Integers are whole numbers and do not contain a decimal point, such as 123 and –6. Integers can be expressed in decimal (base 10), octal (base 8), and hexadecimal (base 16), and are either positive or negative values.

Floating-point numbers are fractional numbers such as 123.56 or –2.5. They must contain a decimal point or an exponent specifier, such as 1.3e–2. The letter "e" for exponent notation can be either uppercase or lowercase.

JavaScript numbers can be very large (e.g., 10^-308 or 10³⁰⁸).

Example:

var num1 = 135;	// integer
var num2 = 170.5;	// floating-point number
var num3 = 8.54e+6;	// exponential notation, same as 14.54e6 or 8540000
var num4 = 6.25e-6;	// exponential notation, same as 0.00000625

The String Data Type:

A string is a sequence of characters representing text value. A String data type object in JavaScript can hold character or string values. The values must be enclosed within quotes (double quotes, single quotes, backticks). Double quotes ("…") and single quotes ('…') are similar in functioning, and there is no marked difference.

However, backticks (`…`) are used to embed data value in the script. Also known as extended functionally quotes, they allow us to embed either expressions or variables into a string by using ${…} symbol.

Example: Try It

let str1 = "our first string"; //allowed 
let str2 = 'our second string'; //allowed

let str3 = 'we can embed ${str1} and ${str2} in this'; 
//embed a variable 
/*output: we can embed our first string and our second string in this*/ 

let str4 = 'embed an expression ${25 + 25}'; 
//embed an expression 
//output: embed an expression 50

An empty set of quotes is called the null string. If a number is enclosed in quotes, itis considered a string; for example, “5” is a string, whereas 5 is a number. Strings are called constants or literals. The string value "hello" is called a string constant or literal. To change a string requires replacing it with another string.

The Boolean Data Type

A Boolean is a logical data type; it can have either a true value or a false value. You can also think of a Boolean value as being yes or no, or on or off. Boolean values are most often used for deciding which code should execute and for comparing data. In JavaScript programming, you can only use the words true and false to indicate Boolean values. In other programming languages, you can use the integer values of and to indicate Boolean values of true and false.

Example: Try It

var hostelFacility = confirm("Do you need hostel facility?");
alert(hostelFacility);

var a = 22, b = 55, c =100;

alert(b > a);	// Output: true
alert(b > c);	// Output: false

The Undefined Data Type

The undefined data type is a special data type for a variable that has not been assigned a value.If a variable has been declared, but has not been assigned a value, has the value undefined.

Example: Try It

var name;
var message1="Hello World!”;
var message2=undefined;


alert(name);	// Output: undefined
alert(message1);	// Output: Hello World!
alert(message2);	// Output: undefined

The Null Data Type

This is another special data type for saying that a variable is empty or has an unknown value. This is case sensitive. You should use lowercase for null. It is not equivalent to an empty string ("") or 0, it is simply nothing. A variable can be explicitly emptied of its current contents by assigning it the null value.

Example: Try It

let message =null;
alert(message);	// Output: null

message ="Hello World!"
alert(message);	// Output: Hello World!

message =null;
alert(message);	// Output: null

Working out the type of a variable:

Typeof Operator: The typeofoperator returns the data type of the operand on which it is used. This is a unary operator and is used to know the data type that may require explicit type casting.

Syntax for using typeofoperator is given as:

Example: Try It

typeof operand 
typeof (operand)

let age = 25;
console.log(typeof age);

Converting data types (Type Casting):

Type casting is the process of converting one data type to another data type.

There could be situations when we need this conversion for the program, for example, to print a numeric value in a HTML tag where strings are only expected. To help this conversion, JavaScript provides implicit and explicit conversion alternatives.

The implicit conversion enables automatic conversion from one type to another when assigned or used in methods. For example, if we print a numeric value in console.log() method, JavaScript will automatically call the toString() method over it. Similarly, the use of + operator with strings and numeric values automatically converts the numeric value to a string value.

Example: Try It

var age = 35; 
console.log(typeof age);  // typeof age is number 
console.log(age);  //equivalent to console.log (age.toString()); 
var output = "My age is"+age;  //Implicit Conversion
console.log(output);  //displays My age is 35

If JavaScript is unable to do implicit conversion, then explicit conversion is needed. For example, suppose we have two numbers numberA and numberB that are of String type, and we need to perform arithmetic addition on them. In this case, we will have to explicitly define the type casting being performed. The next example shows both these cases.

Example: Try It

var numberA = "10"; 
var numberB = "20"; 
console.log(typeof numberA); //type is String 
console.log(typeof numberB); //type is String

console.log(numberA + numberB); //Output is 1020

console.log(Number(numberA) + Number(numberB)); 
         //Output is 30
	//This is explicit type casting

JavaScript offers explicit conversion by using built-in methods such as Number(), String(), Boolean() etc. Empty strings and using null value in JavaScript always return 0.