So, let us start our discussion.
First Category: Primitive Data Types:
The Primitive data types are non-mutable & static. That means the value of such data type can’t flow to any other variable while the program is executing. And if any value has been provided to the variable, it can’t be changed in the program.
The Primitive data types can also be divided into some classes. There are seven primitive data types present. They are the following:
- Number Data Type
- String Data Type
- BigInt Data Type
- Boolean Data Type
- Undefined Data Type
- Null Data Type
- Symbol Data Type
Second Category: Non Primitive Data Types:
Such kind of data type is Mutable in nature & dynamic also. This means the value can be easily changed during the execution of the program.
There is only one kind of Data type present in this category. It is known as the Object Data Type. We will know more about it later.
var z = 1000; // Normal Integer Value var a = 100.5; // Floating Value var p = 10e4; // Exponential Value Evaluates To 10*10000
Now, the concept should become clear to you. We will now implement some programs that will help to clear the Number data type topic.
Play With The Number Data Type:
Also, if we try to divide one string by some number, it will not give an error. Rather, it prints a NaN value that shows it is not applicable.
const a = 10/0; // Trying To Divide Number By Zero console.log("The Result Is: ", a); // Infinity Output const b = "zap"/10; // Trying To Divide String By Number console.log("The Division Result Is: ", b); // NaN (Not Applicable) Output
From the output, we can see that in the first case, it is giving the Infinity message. And in the second case, it is giving the message NaN. So, the implementation of the program is errorless.
Now, let us look at another example of using Numbers.
B. Dynamic Nature Of Numbers:
The number of variables can become dynamic. If the variable has earlier assigned to one number data type & now it is assigned with the String value. The same variable will be going to point to the string value.
Here, one variable earlier had a number value. We have changed the value to a string. Now, if we try to print the variable, we will get the string value, not the number value.
let x; // Declaration Of Variable x = 5; // Variable Is Now A Number x = "ZapOne"; // Variable Is Now A String console.log("The New Value Is: ", x); // Printing The Value
The output clearly shows that the variable has now the value of the string. It has removed the value of the number that it has earlier.
var s1 = “Double Quote Sting”; var s2= ‘Single Quote Sting’; var s3 = `Tilda Sting`;
We can implement some of the programs to get a clear understanding of Strings.
A. Game Of Single or Double Quotes:
But what if, we need to use another set of single & double quotes inside of the string?
let a = "-It Is 'ZapOne'-"; // Single Quote Inside Double Quote String let b = '-It Is "CodingZap"-'; // Double Quote Inside Inside Quote String console.log("The First String Is: ", a); // Printing First One console.log("The Second String Is: ", b); // Printing Second One
From the above output, we can see that we have successfully used the single quote inside the double quote string. And in the second case, the double quotes are successfully used inside of the single quote string.
B. Concatenation Of Strings & Numbers:
If only two values are pasted at the beginning of the concatenation process, it will act as the number. But if there is only one value present, it will be considered a string. But if values are pasted at the end, they will be treated as strings every time irrespective of their numbers.
let a1 = 10 + 20 + "ZapOne"; // Numbers Are Pasted In The Front let a2 = "CodingZap" + 10 + 20; // Numbers Are Pasted At The End console.log("The First Result Is: ", a1); // Printing First One console.log("The Second Result Is: ", a2); // Printing Second One
In the above output, in the case of the first result, the numbers are added before going for concatenation as they are present in the front. In the second case, the numbers don’t add to each other. Rather, they are all concatenated as they are present at the backside.
let a = BigInt("978456789044444678901234567890"); // Declaration With BigInt() const value1 = 500071555554740998n; // Declaration With 'n' At The End
const e1 = 500071555554740998n; // Declaration Of Big Value const r1 = e1 + 2n; // Adding With Another Big Value console.log("The Result Value Will Be: ", r1); // Printing The Value
From the above output, we can see that the BigInt value is added with another bog value. And the complete value is printed in the program without using any floating point or decimal point values.
const a = true; // True Boolean Value const b = false; // False Boolean Data
let d = 10; // First Value let f = 10; // Second Value let v = 22; // Third Value console.log ("The Boolean Value In First Two Variables Is: ", (d == f)); console.log ("The Boolean Value In Last Two Variables Is: ", (f == v));
As the first condition is satisfying, the respective result is giving the Boolean True Value. And in the next case, the condition is not satisfying with the data. So, the result is coming as Boolean False.
Undefined data type means whatever is declared as the variable in the program is not initiated at all. If any value has been given to the variable, it will not be considered as the Undefined element.
Code To Check Syntax & Use Of Undefined Operation:
let x; // Declaring Variable console.log("The Value Is: ", x); // Printing Without Value Assigning
In this case, the variable is not defined with values. And we are trying to print the value. So, it will give the Undefined message as the output.
Code To Check Syntax & Use Of Null Operation:
let x = null; // Declaring Variable With Null console.log("The Value Is: ", x); // Printing Value
In the above case, we have provided the Null Value to the variable. Now, if we try to print the value. We will get the Null message rather than Undefined. That means the variable is declared successfully.
const b1 = Symbol('ZapOne'); // First Symbol const b2 = Symbol('CodingZap'); // Second Symbol console.log("First Initiated Symbol: ", b1); // Printing First Symbol console.log("Second Initiated Symbol: " ,b2); // Printing Second Symbol
From the output, we can see that the two symbols are declared successfully. The Symbol “CodingZap” & Symbol “ZapOne” will be used as the tags to make some other components inside the program.
If you are not able to understand what element is used, you can use the typeof() operator function. Though, the chances of that are very rare because all the parts have been discussed well form.
General Syntax: typeof(variable-name);
Code To Demonstrate The Typeof() Operator:
const t = 'ZapOne'; // First Variable console.log("The Type Is: ", typeof(t)); // Returns "string" Type const u = 2023; // Second Variable console.log("The Type Is: ", typeof(u)); // Returns "number" Type
In the above output, we can see, in the first case, it is giving type as String because not a number is used there. In the second case, one integer value is used. So, the Number type is arriving.
The concept of these variables & datatypes should be clear to you because it is going to be a gateway for your journey toward the Web Development process. All the Data Structures should be cleared. Still. if you wish to learn how JavaSciprt in Web Development works, you can check out our article.
In this article, we have used a few more programs that help to clear the concept of that data. We recommend you practice the concept as much as possible. Because practice is the only key to grabbing knowledge easily.