Data type is the value, which we store in a variable in a program. These values may be of different kinds like string, number etc. In programming it is very important to know the data type perfectly. Only after this we will be able to operate on variables. Without understanding the data types a computer is not able to solve it safely.
JavaScript has eight datatypes:
1. String
2. Number
3. Bigint
4. Boolean
5. Undefined
6. Null
7. Symbol
8. Object
The Object data type can contain an object, an array and a date.
1. String Data Type: String is the series of characters like "Peter Waterson". Strings are written with single or double quotes.
For example:
<html>
<body>
<h2>JavaScript Strings</h2>
<p>Strings are written with single or double quotes.</p>
<p id="demo"></p>
<script>
var Name = "Peter Waterson";var Address = 'z-10 milan road, Hawaii';
document.getElementById("demo").innerHTML =
Name + "<br>" +
Address;
</script>
</body>
</html>
Try it in try it editor.
| Output |
2. Number Data Type: Other programming languages have many number types like:
Whole Numbers (Integers): These are byte(8 bit), short(16 bit), int(32 bit) long(64 bit).
Real Numbers (Floating Numbers): float(32 bit), double(64 bit).
Javascript Numbers are always one type:
double(64 bit floating point). All JavaScript numbers are stored as decimal numbers (floating point). Numbers can be written with or without decimal.
For example:
<html>
<body>
<h2>JavaScript Numbers</h2>
<p>Numbers can be written with, or without decimals:</p>
<p id="demo"></p>
<script>
var x1 = 314.00;
var x2 = 314;
var x3 = 3.14;
document.getElementById("demo").innerHTML =
x1 + "<br>" + x2 + "<br>" + x3;
</script>
</body>
</html>
Try above code in try it editor:
| Output |
Exponential Notation:
Extra large or extra small numbers can be written as exponential (scientific) notation.
For example:
<html>
<body>
<h2>JavaScript Numbers</h2>
<p>Extra large or extra small numbers can be written with scientific notation:</p>
<p id="demo"></p>
<script>
var a = 111e5;
var b = 222e-5;
document.getElementById("demo").innerHTML =
a + "<br>" + b;
</script>
</body>
</html>
Try above code in try it editor:
| Output |
3. BigInt Data Type: All JavaScript numbers are stored in a 64 bit floating number format. JavaScript bigInt is a new data type that is used to store integer values that are too big to be represented by normal JavaScript number. Mathematical calculations can't be performed between bigInt and number type.
For example:
<html>
<body>
<h1>JavScript Bigint</h1>
<p>A big integer value.</p>
<p id="demo"></p>
<p>Calculation can't be performed between bigInt and number datatype.</p>
<script>
var c = BigInt("123456789012345678901234567890");
document.getElementById("demo").innerHTML = c;
</script>
</body>
</html>
Try above codes in try it editor.
| Output |
4. Boolean Data Type: Booleans can have only two values 'true' and 'false'. Booleans are often used in conditional testing.
For example:
<html>
<body>
<h2>JavaScript Booleans</h2>
<p>Booleans are used for conditional testing</p>
<p id="demo"></p>
<script>
var x = 5;
var y = 5;
var z = 6;
document.getElementById("demo").innerHTML =
(x == y) + "<br>" + (x == z);
</script>
</body>
</html>
Try above code in try it editor.
| Output |
5. Undefined Data Type: In JavaScript the variable without a value, has the value undefined and it shows 'undefined' as output. We can also give the value 'undefined' to a variable. The output will be the same.
For Example:
<html>
<body>
<h2>JavaScript undefined data type</h2>
<p>The value (and the data type) of a variable with no value is <b>undefined</b>.</p>
<p id="demo"></p>
<script>
var mobile;
document.getElementById("demo").innerHTML =
mobile + "<br>" + typeof mobile;
</script>
</body>
</html>
Try above code in try it editor.
| Output |
6. Object Data Type: JavaScript object datatype is written with curly braces, in which properties of the object is written like:
person={firstname:"value", lastname:"value", age:value, eyecolor:"value"}
Here there are four properties (firstname, lastname, age and eyecolor) of an object "person" given.
<html>
<body>
<h2>JavaScript Objects</h2>
<p id="demo"></p>
<script>
person = {
firstName : "Peter",
lastName : "Waterson",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>
</body>
</html>
Try the above code in try it editor.
| Output |
7. JavaScript Arrays: JavaScript arrays are written with square brackets under double quotes and separated from each other by comma.
The following program declare an array called "Asia" having three items "India", "Japan" and "China".
<html>
<body>
<h2>JavaScript Arrays</h2>
<p>Array indexes are zero-based, which means the first item is [0].</p>
<p id="demo"></p>
<script>
Asia = ["India","Japan","China"];
document.getElementById("demo").innerHTML = Asia[0];
</script>
</body>
</html>
JavaScript Array indexes are zero(0) based, means first item is zero, second item is one and so one.
Try above code in try it editor.
| Output |
in above program, in following statement
document.getElementById("demo").innerHTML = Asia[0];
you can change Asia[1] or Asia[2] instead of Asia[0] and click 'Run Code' and see the output.
8. The typeof operator: JavaScript's typeof operator is used to find the type of JavaScript variable. It returns the type of variable or an expression.
<html>
<body>
<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof "" + "<br>" +
typeof "Peter" + "<br>" +
typeof "John Waterson";
</script>
</body>
</html>
TOP