JavaScript Operators Complete Tutorial

In this section, we will learn what the operators are and how to use them in JavaScript.

What are Operators in JavaScript? Also Symbols in JavaScript

Symbols like `*`, `/`, `+`, `==` etc. in JavaScript programming are called operators and allow developers to do certain operations.

For example, the `*` symbol is called multiplication operator and is used to multiply two values together.

Or the `+` symbol is called addition operator and is used to add two values together.

Operator and Operands

There are two things involve in an operation:

  • Operator: an operator is the runner of an operation! For example, in a multiplication operation, the operator that runs the operation is `*`. Or in a division operation, the operator is `/`.
  • Operands: On the other hand, in an operation, we need value to run the operation. These values are called operands. For example, in `2+3`, the values 2 and 3 are the operands of the addition operation.

What is Expression?

You should know that together operand and operators create something that is called expression.

The keynote about expression is that it should return a value.

Example: creating expression that resolve to a value in JavaScript

var result = 2 * 4

console.log(result);

Output: 8

In this example, we’ve created the variable named `result` and for its value we have the `2 * 4` expression.

The operands in this expression are `2` and `4`. Also, the operator of this expression is multiplication `*`.

As mentioned before, expressions always return a result. So the result of this expression will be assigned as the value of the `result` variable.

JvaScript Left Values and Right Values: LValues and RValues

When we work with assignment operators like `=`, the operand on the right side of the operator is called Rvalue and the operand on the left side of the operator is called LValue.

You should know that we can’t put constant values (like 1,2,3,4 etc.) or a function call on the left side of assignment operators. Basically, such values can’t be LValues

The LValues should point to a memory-space that allows for storing a value. So because variables point to memory space, they are the perfect candidate for being LValues.

For example:

var jackSalary = 200000;
5000 = jackSalary;

The first assignment ` var jackSalary = 200000;` is acceptable because the LValue is a variable that points to a memory space.

But the second assignment causes the compiler to return error. This is because the value `5000` is a constant value and does not point to any memory location that allows for storing a value.

On the other hand, the RValues can be a constant value (like `c`, `f`, 10, 233.322 etc.), a variable, an expression that results a value or a function call that returns a value.

Example: Left Values and Right Values in JavaScript

var jackSalary = 200000;
var ellenSalary = 160000;
var totalSalary = jackSalary + ellenSalary;

In the third assignment of the example above, because both `jackSalary` and `ellenSalary` are pointing to values, they can be used as the RValues in this expression. So the final value that will be stored in the `totalSalary` variable is: 36000

List of JavaScript Operators

In short, there are 5 categories of operators and in the next couple of sections we will dive deep in each of these categories:

Name: Example:
Arithmetic Operators +, -, * etc.
Assignment Operators =, -=, += etc.
Comparison Operators <, >, <=, >=, == etc.
Logical Operators &&, ||, !
Bit fiddling operators (AKA bitwise operators) <<, >>, ^, &, |

Arithmetic Operators in JavaScript

Operators like addition `+`, subtraction `-`, multiplication `*` etc. are considered as part of arithmetic operators.

Using these operators, we can run arithmetic operations in JavaScript.

Example: using arithmetic operators in JavaScript

const el1 = 2+2;

const el2 = 2*3;

const el3 = 10-1;

console.log(el1);

console.log(el2);

console.log(el3);

Output:

4

6

9

Comparison Operators in JavaScript

Those operators that are used for comparing values in an operation are called comparison operators.

For example, one of these operators is called bigger-than `>` operator. Using this operator, we can see if the operand on the left side is bigger than the operand on the right side of this operator.

You should know that the result of calling a comparison operator is always a boolean value (either true or false).

Note: there are other types of comparison operators which you’ll learn about them in later sections.

Example: using comparison operators in JavaScript

const el1 = 2 > 2;

const el2 = 2<3;

const el3 = 10>=1;

console.log(el1);

console.log(el2);

console.log(el3);

Output:

false

true

true

Assignment Operators in JavaScript

Operators that are used for assigning a value to a variable are called assignment operators.

The main one of them that we’ve used many times so far is the `=` operator, where it takes a rvalue and assigns it to the lvalue (which should be a variable that points to a memory location).

The main point to remember about the `=` operator is that it will replace whatever is already in the target variable with a new rvalue.

Note: There are other types of assignment operators as well, which you’ll learn about them in the future sections.

Example: using assignment operators in JavaScript

let el1 = "Ellen";

el1 = "Jack";

console.log(el1);

Output:

Jack

Logical Operators in JavaScript

Logical operators are those operators that allow us to combine multiple boolean expressions (like expressions that use conditional operators) and evaluate the result of each expression and produce one final result.

Basically, when using a conditional operator, you have only two values involve! But sometimes we have more values in a condition to reach in an accurate decision. Basically, we might want to run multiple conditional statements in order to reach a certain decision!

In situations like this, we can use the logical operators.

One of these logical operators is the AND `&&` operator. This operator basically combines two logical expressions and if both of them result true, then the final result of this operator will be true as well. Otherwise, it will return the value false even if one of the expressions returned false.

Note: in the logical operators’ section, you’ll see these operators in greater details.

Example: using logical operators in JavaScript

const el1 = 100;

const el2 = 500;

const el3 = 200;

const result = el1 > el2 && el3<el2;

console.log(result);

Output:

false

Leave a Reply