Introduction
JavaScript Data types refer to the different types of data that we will be working with and storing in variables. It’s essential that we learn each of these data types for the reason that if not data may become stored in an incorrect format that will result in problems in our code afterward.
In this article, we will discuss the more common data types in JavaScript and how to appliance them in our code.
Description
Data types essentially state what kind of data may be stored and deployed inside a program. There are six elementary data types in JavaScript. Those further can be divided into three key groups:
- Primitive (Primary)
The primitive data types are String, Number, and Boolean. These data types can hold only one value at a time.
- Composite (Reference)
All types of objects such as Object, Array, and Function are composite data types. These data types can hold groups of values and additional complex entities
- Special data types
Undefined and Null are special data types.
Now, we will discuss each data type one by one in-depth.
The String type
String type is used to signify textual data. These are groups of alphanumeric characters and symbols. This is in what way we’re going to store letters and words. It is a collection of elements of 16-bit nameless integer values. Each element in the String lives in a position in the String. The first component is at index 0, the afterward at index 1, and so on. The String length is the number of elements in it. Strings are immutable as it is not possible to change something once a string is created.
We create Strings by using single or double quotes surrounding one or more characters. Look at the below code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript String Data Type</title>
</head>
<body>
<script>
// Creating variables
var a = 'Hi there!'; // using single quotes
var b = "Hi there!"; // using double quotes
// Printing variable values
document.write(a + "/\n/g");
document.write(b);
</script>
</body>
</html>
We can take in quotes within the string on the condition that they don’t match the enclosing quotes.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Including Quotes inside the JavaScript String</title>
</head>
<body>
<script>
// Creating variables
var a = "Let's have a cup of coffee.";
var b = 'He said "Hello" and left.';
var c = 'We\'ll never give up.';
// Printing variable values
document.write(a + "/\n/g");
document.write(b + "<br>");
document.write(c);
</script>
</body>
</html>
The Number Type
The Number signifies integer and floating numbers such as decimals and exponential.
Example:
const number1 = 3;
const number2 = 3.433;
const number3 = 3e5 // 3 * 10^5
- A number type may also be;
- +Infinity
- -Infinity
- NaN (not a number).
Example:
const number1 = 3/0;
console.log(number1); // Infinity
const number2 = -3/0;
console.log(number2); // -Infinity
// strings can't be divided by numbers
const number3 = "abc"/3;
console.log(number3); // NaN
The Boolean Type
The Boolean data type may hold only true or false values data. It is normally used to store values similar to yes (true) or no (false) as proved below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Boolean Data Type</title>
</head>
<body>
<script>
// Creating variables
var isReading = true; // yes, I'm reading
var isSleeping = false; // no, I'm not sleeping
// Printing variable values
document.write(isReading + "/\n/g");
document.write(isSleeping);
</script>
</body>
</html>
The Object Type
An object is a complex data type that permits us to store collections of data.
Example:
const student = {
firstName: 'ram',
lastName: null,
class: 10
};
The Array Type
The array is a type of object. It is t used for storing several values in a single variable. Each value or element in an array has a numeric position. That is known as its index. It can cover data of any data type-numbers, strings, Boolean, functions, objects, and even other arrays.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Array Data Type</title>
</head>
<body>
<script>
// Creating arrays
var colors = ["Red", "Yellow", "Green", "Orange"];
var cities = ["London", "Paris", "New York"];
// Printing array values
document.write(colors[0] + "/\n/g"); // Output: Red
document.write(cities[2]); // Output: New York
</script>
</body>
</html>
The Function type
A function is a callable object. It implements a block of code. It is likely to assign functions to variables as the functions are objects.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Function Data Type</title>
</head>
<body>
<script>
var greeting = function(){
return "Hello World!";
}
// Check the type of greeting variable
document.write(typeof greeting) // Output: function
document.write("/\n/g");
document.write(greeting()); // Output: Hello World!
</script>
</body>
</html>
The Undefined type
The undefined data type may only have one value. It has a special value undefined.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Undefined Data Type</title>
</head>
<body>
<script>
// Creating variables
var a;
var b = "Hello World!"
// Printing variable values
document.write(a + "/\n/g");
document.write(b);
</script>
</body>
</html>
The Null Data Type
The Null is one more special data type. It can have only one value-the null value. It means that there is no value. A variable may be clearly emptied of its present contents by allocating it the null value.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Null Data Type</title>
</head>
<body>
<script>
var a = null;
document.write(a + "/\n/g"); // Print: null
var b = "Hello World!"
document.write(b + "<br>"); // Print: Hello World!
b = null;
document.write(b) // Print: null
</script>
</body>
</html>
Conclusion
- At this time, we should have a well understanding of some of the main data types that are available for us to use in JavaScript.
- All of these data types will become vital as we develop programming projects in the JavaScript language.
For more details visit:https://www.technologiesinindustry4.com/2022/01/javascript-data-types.html
