Operators in JavaScript

• JavaScript operators are symbols or keywords used to perform operations on values and variables.
• They are the building blocks of JavaScript expressions and can manipulate data in various ways.

1. Arithmetic Operator

• Arithmetic operators take numerical values (either literals or variables) as their operands and return a single numerical value.

Addition operator (+)
The addition operator returns the sum of two values. For example, the following uses the addition operator to calculate the sum of two numbers:

let sum = 10 + 20;
console.log(sum); // 30

You can also use the addition operator with two variables. For example:

let netPrice    = 9.99,
    shippingFee = 1.99;
let grossPrice  = netPrice + shippingFee;

console.log(grossPrice);   // 11.98

If either value is a string, the addition operator uses the following rules:

• If both values are strings, it concatenates the second string to the first one.
• If one value is a string, it implicitly converts the numeric value into a string and concatenates two strings.

For example, the following uses the addition operator to concatenate two strings:

let x = '10',
    y = '20';
let result = x + y;   // 1020

The following example shows how to use the addition operator to calculate the sum of a number and a string:

let result = 10 + '20';  // 1020

In this example, JavaScript converts the number 10 into a string '10' and concatenates the second string '20' to it.

Subtraction operator (-)

The subtraction operator (-) subtracts one number from another. For example:

let result = 30 - 10;
console.log(result); // 20

If a value is a string, a boolean, null, or undefined, the JavaScript engine will:

• First, convert the value to a number using the Number() function.
• Second, perform the subtraction.

Multiplication operator (*)

JavaScript uses the asterisk (*) to represent the multiplication operator. The multiplication operator multiplies two numbers and returns a single value. For example:

let result = 2 * 3;
console.log(result);  // 6

If either value is not a number, the JavaScript engine implicitly converts it into a number using the Number() function and perform the multiplication. For example:

let result = '5' * 2;

console.log(result);   // 10

Divide operator (/)

Javascript uses the slash (/) character to represent the divide operator. The divide operator divides the first value by the second one. For example:

let result = 20 / 10;

console.log(result); // 2

If either value is not a number, the JavaScript engine converts it into a number for division. For example:

let result = '20' / 2;
console.log(result); // 10;

Remainder Operator (%)

JavaScript uses the (%) to represent the remainder operator. The remainder operator returns the remainder left over when one value is divided by another value. For example:

The following example shows how to use the remainder operator with a positive dividend:

let remainder = 5 % -2;
console.log(remainder); // 1

remainder = 5 % 2;
console.log(remainder); // 1

The following example uses the remainder operator with a negative dividend:

let remainder = -5 % 3;
console.log(remainder); // -2

remainder = -5 % -3;
console.log(remainder); // -2

2. Assignment Operators

Assignment operators are used to assign values to variables. They can also perform operations like addition or multiplication while assigning the value.

+= operator

The following example uses the += operator to add one to variable x:

let x = 10;
x += 1;
console.log(x); // 11

-= operator

The following example uses the -= operator to minus one from the variable x:

let x = 10;
x -= 1;
console.log(x); // 9

(*=) operator

The following example uses the *= operator to multiply 10 with the variable x:

let x = 10;
x *= 10;
console.log(x); // 100

/= operator

The following example uses the /= operator to divide x by 2 and assign the result back to x:

let x = 10;
x /= 2;
console.log(x); // 5

%= operator

The following example uses the %= operator to get the remainder of x is divided by 2 and assigns the remainder back to x:

let x = 5;
x = x % 2;

console.log(x);  // 1

Chaining JavaScript assignment operator

If you want to assign a single value to multiple variables, you can chain the assignment operators. For example:

let a = 10, b = 20, c = 30;
a = b = c; // all variables are 30

In this example, JavaScript evaluates from right to left. Therefore, it does the following:

let a = 10, b = 20, c = 30;

b = c; // b is 30
a = b; // a is also 30 

3. Comparison / Relational operators

Comparison operators compare two values and return a boolean (true or false). They are useful for making decisions in conditional statements.

See the following example:

let r1 = 20 > 10; // true
let r2 = 20 < 10; // false
let r3 = 10 == 10; // true

Compare numbers

If values are numbers, the comparison operators perform a numerical comparison. For example:

let a = 10, 
    b = 20; 

console.log(a >= b);  // false
console.log(a == 10); // true

This example is straightforward. The variable a is 10, b is 20. The expression a >= b expression returns false and the expression a == 10 expression returns true.

Compare strings

If the operands are strings, JavaScript compares the character codes numerically one by one in the string.

let name1 = 'alice',
    name2 = 'bob';    

let result = name1 < name2;
console.log(result); // true
console.log(name1 == 'alice'); // true

Since JavaScript compares the character codes in the strings numerically, you may receive an unexpected result, for example:

let f1 = 'apple',
    f2 = 'Banana';
let result = f2 < f1;
console.log(result); // true

In this example, f2 is less than f1 because the letter B has the character code 66 while the letter a has the character code 97.

To fix this, you need to:

• First, convert the strings into a common format, either lowercase or uppercase
• Second, compare the converted values

For example:

let f1 = 'apple',
    f2 = 'Banana';

let result = f2.toLowerCase() < f1.toLowerCase();
console.log(result); // false

Note that the toLowerCase() is a method of the String object that converts the string to lowercase.

4. Strict equal (===) and not strict equal (!==)

The strict equal and not strict equal operators behave like the equal and not equal operators except that they don’t convert the operand before comparison.

See the following example:

console.log("10" == 10); // true
console.log("10" === 10); // false

In the first comparison, since we use the equality operator, JavaScript converts the string into a number and performs the comparison.

However, in the second comparison, we use the strict equal operator (===), JavaScript doesn’t convert the string before comparison, therefore the result is false.

https://www.geeksforgeeks.org/javascript/javascript-operators/
https://www.javascripttutorial.net/javascript-unary-operators/