JavaScript Data Types

JavaScript Data types have an important concept in JavaScript. It contains various data types such as numbers, objects, strings, and more. Java Script executes expressions from left to right different sequences will give different results.

JavaScript Types are dynamics means that we can use the same variable to execute the different data types:

JavaScript Data Types – Numbers

The number is a primitive data type used to represent and manipulate a number like “71”. We can use it with or without decimals such as “42” or “4.21”.

<html>
<body>

<p id="tacode"></p>
<script>
var a1 = 42.1;
var a2 = 42;
var a3 = 4.21;

document.getElementById("tacode").innerHTML =
a1 + "<br>" + a2 + "<br>" + a3;
</script>
</body>
</html>

Output:

JS Data Types

JavaScript Data Types – Booleans

JavaScriptData Types Boolean use to manipulate and represents a logical entity we use Boolean data type and it can have two values: true and false.

<!DOCTYPE html>
<html>
<body>

<p id="tacode"></p>
<script>
var a = 3;
var b = 2;
var c = 2;
document.getElementById("tacode").innerHTML =
(a == b) + "<br>" + (b == c);

</script>
</body>
</html>

Output:

JS Data Types

JavaScript Data Types – String

The string data type is used to represent and manipulate a sequence of characters. Like “Tutorials Art”, We can use single quotes or double quotes.

<!DOCTYPE html>
<html>
<body>

<p id="tacode"></p><script>
var a="Tutorials Art";
var b='Tutorials Art';

document.getElementById("tacode").innerHTML = a + "<br>" + b; 
</script>
</body>
</html>

Output:

JS Data Types

JavaScript Data Types – Arrays

The array data type is used to store multiple values in a single variable. Each value/element in an array has a numeric position, known as its index, and it may contain data of any data type even of another array.

<!DOCTYPE html>
<html>
<body>

<p id="tacode"></p>
<script>
var languages = ["Python","C++","Java"];
document.getElementById("tacode").innerHTML = languages[0];
</script>

</body>
</html>

Output:

Capture 10

JavaScript Data Types – Objects

JavaScript Data Type object is a complex type that allows you to store collections of data. It contains properties, defined as a key-value pair. A property key (name) is always a string, but the value can be any type like strings, numbers, booleans, arrays, functions, and other objects. It is written with curly braces { }.

<!DOCTYPE html>
<html>
<body>

<p id="tacode"></p>

<script>
var std= {
  name : "Ali",
  class  : "8",
  marks     : 355
};
document.getElementById("tacode").innerHTML = std.name + " got " + std.marks + " marks.";
</script>

</body>
</html>

Output:

Capture 11

JavaScript – typeof Operator

The Javascript typeof operator is used to find the type of a variable or an expression. It is placed before its single operand and its value is a string indicating the data type of the operand.

<!DOCTYPE html>
<html>
<body>

<p id="tacode"></p>
<script>
document.getElementById("tacode").innerHTML = 
typeof 12 + "<br>" +       
typeof "Albert" + "<br>" +   
typeof (3+4);      

</script>
</body>
</html>

Output:

Capture 12

Undefined

In JavaScript Data Types When a variable is not assigned with any value it is of undefined data type. A variable can be empty by setting its value by undefined

<!DOCTYPE html>
<html>
<body>

<p id="tacode"></p>
<script>
var lan;
document.getElementById("tacode").innerHTML = lan;
</script>
</body>
</html>

Output:

Capture 13

Empty Values

An empty value has nothing but an empty string can have both the data type and a legal value.

<!DOCTYPE html>
<html>
<body>
<p id="tacode"></p>

<script>
var lan = "";
document.getElementById("tacode").innerHTML = "The value is: " +
lan + "<br>" +
"The type is: " + typeof lan;
</script>

</body>
</html>

Output:

Capture 14

Null

JavaScript data type null means nothing, It is of primitive type, It represents an intentional absence of a value. It has a data type of object. By applying typeof operator to the null you can check the data type as in the below code:

<!DOCTYPE html>
<html>
<body>
<p id="tacode"></p>

<script>
var std = {name:"Ali", class:"8", marks:678, dept:"CS"};
std = null;
document.getElementById("tacode").innerHTML = typeof std;
</script>

</body>
</html>

Output:

Capture 15

Difference between Undefined and Null

Both undefined and null are the same in value but different in type. As a variable with undefined has no value but data type will be “undefined” on the other hand a variable with Null has also no value but type “object”.

Primitive Data

The primitive data type is data that is simple and has no methods, objects, and properties.

The typeof operator will return one of these data types:

  • String
  • Boolean
  • Number
  • Undefined

Complex Data

Complex data means the typeof operator will return two complex data types:

  • Objects
  • Functions

The typeof operator returns Object for objects, arrays, and null.

and returns Function for functions.

NOTE: The tyepof operator returns object for “Arrays” because in JavaScript arrays are objects.