<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The + Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

JavaScript Multiplication

The Multiplication Operator (*) is used to multiply numbers in JavaScript.

Example of Multiplication:

x is assigned the value 5, and y is assigned the value 2.
The product of x and y is calculated using x * y and the result, 10, is stored in z.

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The * Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x * y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Types of JavaScript Operators

There are different types of JavaScript operators:

Arithmetic Operators
Assignment Operators
Comparison Operators
String Operators
Logical Operators
Bitwise Operators
Ternary Operators
Type Operators

JavaScript Arithmetic Operators

‍Arithmetic operators in JavaScript are used to perform common mathematical operations on numbers.

Example of Using Arithmetic Operators:

a is set to 3.
x is calculated by adding 100 and 50, then multiplying the result by a, which results in x being 450.

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Arithmetic Operations</h2>
<p>A typical arithmetic operation takes two numbers (or expressions) and produces a new number.</p>

<p id="demo"></p>

<script>
let a = 3;
let x = (100 + 50) * a;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Here's a list of some common JavaScript arithmetic operators along with their descriptions:

+: Addition
-: Subtraction
*: Multiplication
**: Exponentiation (introduced in ES2016)
/: Division
%: Modulus (Division Remainder)
++: Increment
--: Decrement

JavaScript Assignment Operators

‍Assignment operators in JavaScript are used to assign values to variables.

The Addition Assignment Operator (+=): This operator adds a value to a variable and then reassigns the sum back to the same variable.

Example of Assignment:

x is initially set to 10.
x += 5 increases the value of x by 5, making the new value of x 15.

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The += Operator</h2>

<p id="demo"></p>

<script>
var x = 10;
x += 5;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Here's a list of JavaScript assignment operators along with examples and their equivalent long-form expressions:

=: x = y — Same as x = y
+=: x += y — Same as x = x + y
-=: x -= y — Same as x = x - y
*=: x *= y — Same as x = x * y
/=: x /= y — Same as x = x / y
%=: x %= y — Same as x = x % y
**=: x **= y — Same as x = x ** y

Here’s a list of JavaScript comparison operators along with their descriptions:

==: Equal to
===: Equal value and equal type
!=: Not equal
!==: Not equal value or not equal type
>: Greater than
**

JavaScript String Comparison

All the comparison operators mentioned can be used for string comparisons in JavaScript as well:

Example: If you compare the strings "A" and "B" using the less than operator, the result will indicate whether "A" is less than "B" based on their lexicographical order.

‍

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>

<p>All conditional operators can be used on both numbers and strings.</p>

<p id="demo"></p>

<script>
let text1 = "A";
let text2 = "B";
let result = text1 < text2;
document.getElementById("demo").innerHTML = "Is A less than B? " + result;
</script>

</body>
</html>

Note that strings are compared alphabetically:

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript String Operators</h1>
<p>Note that strings are compared alphabetically:</p>

<p id="demo"></p>

<script>
let text1 = "20";
let text2 = "5";
let result = text1 < text2;
document.getElementById("demo").innerHTML = "Is 20 less than 5? " + result;
</script>

</body>
</html>

JavaScript String Addition

In JavaScript, the + operator is not only used for adding numbers but also for concatenating strings. By using +, you can combine multiple strings into one:

Example: Concatenating the strings "John" and "Doe" with a space in between results in the string "John Doe" when using the + operator.

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript String Operators</h1>
<p>Note that strings are compared alphabetically:</p>

<p id="demo"></p>

<script>
let text1 = "20";
let text2 = "5";
let result = text1 < text2;
document.getElementById("demo").innerHTML = "Is 20 less than 5? " + result;
</script>

</body>
</html>

The += assignment operator in JavaScript can also be used for string concatenation. It appends the string on the right side of the operator to the string variable on the left side:

Example: Starting with the string "What a very ", and then using text1 += "nice day"; appends "nice day" to the existing string. This results in the combined string "What a very nice day".

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The += Operator</h2>
<p>The assignment operator += can concatenate strings.</p>

<p id="demo"></p>

<script>
let text1 = "What a very ";
text1 += "nice day";
document.getElementById("demo").innerHTML = text1;
</script>

</body>
</html>

Adding Strings and Numbers

When you add two numbers in JavaScript, the result is their sum. However, adding a number and a string results in string concatenation because JavaScript converts the number into a string:

Example:

let x = 5 + 5; computes the sum of two numbers, which is 10.
let y = "5" + 5; combines a string and a number, resulting in the string 55.
let z = "Hello" + 5; concatenates a string with a number, producing Hello5.

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The + Operator</h2>
<p>Adding a number and a string, returns a string.</p>

<p id="demo"></p>

<script>
let x = 5 + 5;
let y = "5" + 5;
let z = "Hello" + 5;
document.getElementById("demo").innerHTML =
x + "<br>" + y + "<br>" + z;
</script>

</body>
</html>

JavaScript Logical Operators

In JavaScript, logical operators are used to perform logical operations and typically return a boolean value based on the result of the operations. Here's a summary of the logical operators:

&& (Logical AND): This operator returns true if both operands are true; otherwise, it returns false.
|| (Logical OR): It returns true if at least one of the operands is true; otherwise, it returns false.
! (Logical NOT): This operator inverts the truth value of its operand. If the operand is true, it returns false; if the operand is false, it returns true.

JavaScript Type Operators

In JavaScript, type operators are useful for determining the type or the construction of variables and objects. Here’s a brief overview of these operators:

typeof: This operator returns the type of a variable as a string. It helps in identifying whether a variable is a number, string, function, or other types in JavaScript.
instanceof: This operator checks whether an object is an instance of a particular class or constructor function. It returns true if the object inherits from the prototype property of the constructor.

JavaScript Bitwise Operators

JavaScript bitwise operators manipulate individual bits within their operands, which are treated as 32-bit integers. Here's an overview of how these operators work along with their effects:

& (AND): Compares each bit of its first operand to the corresponding bit of its second operand. If both bits are 1, the corresponding result bit is set to 1. Otherwise, it is set to 0.
- Example: 5 & 1 is 1 because 0101 & 0001 results in 0001.
| (OR): Compares each bit of its first operand to the corresponding bit of its second operand. If either bit is 1, the corresponding result bit is set to 1.
- Example: 5 | 1 is 5 because 0101 | 0001 results in 0101.
~ (NOT): Inverts all the bits of its operand.
- Example: ~5 is not 10 in JavaScript, but -6 because the bitwise NOT of 00000000000000000000000000000101 is 11111111111111111111111111111010.
^ (XOR): Compares each bit of its first operand to the corresponding bit of its second operand. If the bits are different, the corresponding result bit is set to 1.
- Example: 5 ^ 1 is 4 because 0101 ^ 0001 results in 0100.
<< (Left Shift): Shifts the first operand the specified number of bits to the left. Excess bits shifted off to the left are discarded. Zero bits are shifted in from the right.
- Example: 5 << 1 is 10 because 0101 << 1 results in 1010.
>> (Right Shift): Shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Copies of the leftmost bit are shifted in from the left.
- Example: 5 >> 1 is 2 because 0101 >> 1 results in 0010.
>>> (Unsigned Right Shift): Shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Zero bits are shifted in from the left.
- Example: 5 >>> 1 is 2 because 0101 >>> 1 results in 0010.

‍

Take a look into your desired course

Students

Hire from us

Partners