Data Type and Operators in JavaScript
Basic Data Types and Operators in Javascript.
Hey Guys, This is the second article from the series A, B, C's of JavaScript, If you haven't read my first article from the series, I do recommend you to read it here. In this article, I will be explaining the Basic Data Structure and Operators in JavaScript.
For every programming language, the values are the basic building blocks, values could have any type there could be a name of an entity, or numeric representation of an entity, or a simple yes or no format. In JavaScript for this, there are several types of value in programming terms we call it as Data Types. Before diving deep into the data types, let's just understand how to define any type of value in JavaScript.
Conventionally there was only one way to define the value, with the help of the keyword var
, but in modern programming, we were introduced with two new ways to define a value i.e let
and const
,
Defining a value is pretty easy in JavaScript you just need to follow this syntax,
var name = 'hashnode';
let name = 'hashnode';
const name = 'hashnode';
The syntax is similar, but there are differences in each of the variations, take a look at the following differences,
Property | var | let | const |
Global Scope | YES | NO | NO |
Re-declaration | YES | NO | NO |
Re-Assignment | YES | YES | NO |
The values with keyword var
and let
can vary throughout the program, that is why we refer to them as variables, In the case of const
once define can not be changed so they are called constant values or just constants.
Data Types
Number
To represent a numeric value we use a
Number
data type, it could be10
,-10
, or3.14
.let valueOfPI = 3.14; // data with the value type Number
There are three special values in javascript, they are considered numbers but they do not behave like numbers, The first two are
Infinity
and-Infinity
, which represent the positive and negative infinities. Infinity - 1 is still Infinity, and so on. The third one isNaN
, NaN stands for “not a number”, even though it is a value of the number type. You’ll get this result when you try to calculate 0 / 0 (zero divided by zero), Infinity - Infinity, or any number of other numeric operations that don’t yield a meaningful result.String
A
String
is another basic Datatype, they are used to represent the text value you can define a string value by enclosing the text in quotes,let name = 'Adarsh Thakur Blogs'; // enclosed in single quote let anotherName = "A, B, C's of JavaScript"; // enclosed in double quote
Apart from these two conventional methods, In modern programming, we can also use the backticks (`) to represent a string, they are helpful to create template literals in JavaScript that we will cover in upcoming articles,
let language = `JavaScript`; // this is also valid
You can almost enclose anything inside quotes, and it would end up as a string, But some characters need to be treated differently Imagine adding a quote on side of quotes or adding a new line
(\n)
into an input value, To make it possible to include such characters in a string, the following notation is used: whenever a backslash ( \ ) is found inside quoted text, it indicates that the character after it has a special meaning. This is called escaping the character.let title = "A newline character is written like \"\\n\".";
Boolean
There can be some scenarios where have a value that distinguishes between only two possibilities, like “yes” and “no” or “on” and “off”. For such Javascript has special DataTypes
Boolean
they can only have two valuestrue
andfalse
.let isThisArticleGreat = true;
Empty Values
There are two special types of value in JavaScript, denoted asnull
andundefined
, they are actual values but they do not carry any meaningful information. Documents suggest that the difference between the meanings of two values is an accident, you can use them interchangeably.
Operators
The special character in the language like *
and +
are called Operator, they are very useful in the programming, let's learn some of the operators and their uses.
Arithmetic Operator
The main reason we have numeric values is to perform arithmetic operation like, Addition, Multiplication, and so on. To add two numbers we simply use the Addition operator+
,-
,*
and\
subsequently for Subtraction, Multiplication, and Division.let sum = 10 + 10; // Expected output 20 let square = 2 * 2; // Expected output 4
Unary operators
Not all the operators and symbols, some of the written as words(keywords), One of them istypeof
, which when applied on a value gives us the type of that value
Theconst numberOfGirlfriendsIhave = 1; // 🥰 console.log(typeof numberOfGirlfriendsIhave); // -> number
typeof
operator uses only one value hence said to be a Unary operator, some operator uses two values and that is why they are Binary operator, please note the-
can be used as binary as well as a unary operator,console.log( - (9 -5) ); // → -4
Comparision Operator
You may encounter some situations where you need to compare 2 values, Javascript provides operators that may come in handy in such situations. here is the list of comparison operators,cosole.log(10 > 20); // > 'Greater than` cosole.log(10 < 20); // < 'Less than` cosole.log(10 >= 20); // > 'Greater than or equal to` cosole.log(10 <= 20); // < 'Less than or equal to` cosole.log(10 == 20); // < 'Equals to`
Fun Fact: In JavaScript, all the values are equal to themselves except NaN.
Logical Operator
Some operations can be applied to the Boolean values themselves. JavaScript supports three logical operators: and, or, and not. The&&
operator is a logical AND operation, It is a binary operator and it returns true only if both values are true otherwise false.
Theconsole.log(true && false); // → false console.log(true && true); // → true
||
operator is a logical OR operation, It is also a binary operator and it returns true if any one of the values is true.
The operator NOT is represented by Exclamation Markconsole.log(false || true); // → true console.log(false || false); // → false
!
, it is a unary operator and flips its value.console.log(!false); // → true console.log(!true); // → false
Ternary Operator
Till now we have seen unary operator and binary operator, but there is a ternary operator in JavaScript that is represented using Question Mark(?) and Colon(:) Symbol like follows,
In this operator, the output is dependent on the truthfulness of the value before theconsole.log(true ? 1 : 2); // Expected Output 1
?
, If the value provided is true the output will value before colon:
otherwise the value after it, sometimes is also referred to as the conditional operator.
We learned the basic Datatypes in JavaScript, you might be wondering 🤔 in all of the examples we are no specifying the data type of the values then how JavaScript come to know that 10
is a number and "10"
is a string, here comes a concept how Automatic Type Conversion.
Automatic Type Conversion
If you have followed my first article from this series then you must remember that JavaScript is one of the cleverest programming languages, Let me give you the proof,
console.log(5 * null)
// → 0
console.log("3" - 1)
// → 2
console.log("6" + 1)
// → 61
Whenever a wrong data type is used for an operator, JavaScript silently converts that value into an appropriate type using a set of rules that often aren’t what you want or expect. This is called type coercion.
In this case, the null
becomes 0
, "3"
gets converted into 3
, and in the third example we are trying to contact the "6"
with a number do 1
get converted to "1"
giving us the result of "61"
.
When you do not want JavaScript to convert the values and compare them as it is,
There is a special type of operators that JavaScript provides, ===
and !==
.
The first operator checks whether both of the values are precisely equal and the second one checks that both of the values are precisely unequal.
Tip: I recommend you to use
===
and!==
operator to accidentally fall for the automatic type conversion.
So we are good to use the different data types and operators to perform some operations, in the next article from this series I will be explaining Function and Object in JavaScript.
To get notified about my next article do follow me, till then You can connect me on Twitter or DM on Discord.