Fundamentals of JavaScript
Learn the commonly used data types and operators in JavaScript.
Types of data in programming
Several forms of data may be used in programming. Here’s an example:
let persons = 1;
let greet = "Hello!";
In the example above:
- The variable,
persons
, stores a number. - The variable,
greet
, stores a string.
Variable declaration
In JavaScript, we use let
to declare a variable. Here’s an example:
let persons; // declaring a variable
Here, the variable persons
is declared, but its value is undefined
.
Note: It is a good practice to initialize every variable.
Variable initialization
Assigning a value to a variable at the time of its declaration is called initialization. For example, the following code demonstrates the initialization of a variable in JavaScript:
In the code above, we have initialized the variable persons
:
JavaScript supports the following:
- Number: Numeric values (
5
,3.0
,-1
, etc.) - String: String values (
Educative
,JavaScript
, etc.) - Boolean: Boolean values (
true
,false
)
The following code demonstrates variables storing values of different types in JavaScript:
In the code above, we have initialized different variables to define their types.
Operations depend on the type of data
The type of data also tells which operations are permissible on a specific piece of data and indicates the semantics (or meaning) of those operations. The following code demonstrates the effect of the +
operation on different types of data in JavaScript:
Every input is a string in JavaScript
When we use a prompt()
statement in JavaScript, it always returns a string of characters. Even the integer, 25
, is considered a string, as shown in the following code widget:
Note: Please type an integer value in each prompt after you run the following code.
In the code above, integers are treated as strings and they are concatenated due to the +
operator in the output.
We must convert the input value to the suitable data type to apply the correct operation. We should use the parseInt()
to convert it into an integer, as demonstrated below:
Note: Even if the input value is a floating-point,
parseInt()
converts it into an integer. The result contains only the integer part in the output.
Similarly, we can use the parseFloat()
to store a floating-point value in a variable, as demonstrated below:
Operators in JavaScript
Like any other programming language, JavaScript supports several types of operators. We have already seen the assignment operator, =
, which assigns a value to a variable in our programs. The following are various forms of the assignment operator:
Line 1: We use let
to define a variable (this is the recommended way).
Line 4: We use var
to define a variable.
Lines 11–12: We define different variables in a single line of code.
Commonly used operators
There are several other commonly used operators in JavaScript, including:
-
Arithmetic operators: These are used for arithmetic operations (addition, subtraction, multiplication, etc.).
-
Comparison operators: These are used in conditional expressions (less than, greater than, etc.).
-
Logical operators: These are used to combine conditional expressions (and, or, not).
-
Compound assignment operators: These are the combinations of arithmetic and assignment operators.
Arithmetic Operators
Operator | Description | Syntax | Results x=7 and y=4 |
+ | Addition: Adds two operands | x + y | 11 |
- | Subtraction: Subtracts two operands | x - y | 3 |
* | Multiplication: Multiplies two operands | x * y | 28 |
/ | Division: Divides the first operand by the second | x / y | 1.75 |
% | Modulo: Returns the remainder when the first operand is divided by the second | x % y | 3 |
** | Power: Returns the first number raised to the power of the second number | x ** y | 2401 |
-- | Decrement: Updates the variable with the value that is one less than the already stored value | x-- | 6 |
++ | Increment: Updates the variable with the value that is one more than the already stored value | x++ | 8 |
Comparison Operators
Operator | Description | Syntax | Results x=7 and y=4 |
> | Greater than: True if the left operand is greater than the right | x > y | True |
< | Less than: True if the left operand is less than the right | x < y | False |
== | Equal to: True if both operands are equal | x == y | False |
!= | Not equal to: True if both operands are not equal | x != y | True |
>= | Greater than or equal to: True if the left operand is greater than or equal to the right | x >= y | True |
<= | Less than or equal to: True if the left operand is less than or equal to the right | x <= y | False |
Logical Operators
Operator | Description | Syntax | Results x=7 and y=4 |
&& | Logical AND: True if both the operands are true | x > 4 && y > 4 | False |
|| | Logical OR: True if either of the operands is true | x > 4 || y > 4 | True |
! | Logical NOT: True if the operand is false | !(x > 4) | False |
Compound Assignment Operators
Operator | Description | Syntax | Results x=7 and y=4 |
+= | Add and assign: Add the right-side operand with the left-side operand and then assign the result to the left operand (x = x + y) | x += y | x = 11 |
-= | Subtract and assign: Subtract the right-side operand from the left-side operand and then assign the result to the left operand (x = x - y) | x -= y | x = 3 |
*= | Multiply and assign: Multiply the right-side operand with the left-side operand and then assign the result to the left operand (x = x * y) | x *= y | x = 28 |
/= | Divide and assign: Divide the left operand with the right operand, and then assign it to the left operand (x = x / y) | x /= y | x = 1.75 |
%= | Modulo and assign: Take modulo after dividing the left operand with the right operand, and then assign the result to the left operand (x = x % y) | x %= y | x = 3 |
**= | Exponent and assign: Calculate the exponent (raised power) value using operands, and then assign the value to the left operand (x = x ** y) | x **= y | x = 2401 |
Before we dive into the contents of the next lesson, take a moment to answer the question below.
Get hands-on with 1300+ tech skills courses.