Introduction to Operators in JavaScript
Like most programming languages, JavaScript has a set of operators that perform various operations on values and variables. In this introductory guide, we aim to cover the basics of arithmetic, assignment, comparison, and logical operators.
Arithmetic Operators
Arithmetic operators are used to perform mathematical operations on numbers. The following table lists the arithmetic operators in JavaScript and their corresponding symbols:
| Operator | Symbol | Example | Result |
|---|---|---|---|
| Addition | + | 5 + 3 | 8 |
| Subtraction | - | 5 - 3 | 2 |
| Multiplication | * | 5 * 3 | 15 |
| Division | / | 5 / 3 | 1.67 |
| Modulus | % | 5 % 3 | 2 |
Some examples of using arithmetic operators in JavaScript:
// Declare two variables and assign them values
var a = 5;
var b = 3;
// Perform arithmetic operations on the variables
console.log(a + b); // 8
console.log(a - b); // 2
console.log(a * b); // 15
console.log(a / b); // 1.67
console.log(a % b); // 2
In the example above, we declared two variables a and b, and assigned them the values of 5 and 3, respectively. We then used the arithmetic operators to perform various mathematical operations on the variables and logged the results to the console.
Assignment Operators
Assignment operators can be used to assign a value to a variable. The most commonly used assignment operator is the = operator, which assigns the value on the right side of the operator to the variable on the left side.
// Declare a variable and assign it a value
var x = 5;
// Re-assign a new value to the variable
x = 10;
console.log(x); // 10
In the example above, we first declared a variable x and assigned it the value of 5. We then re-assigned a new value of 10 to the variable and logged the new value to the console.
Other assignment operators include +=, -=, *=, and /=, which perform the corresponding arithmetic operation on the variable and then assign the result to the variable.
// Declare a variable and assign it a value
var x = 5;
// Add 5 to the variable and re-assign the result
x += 5;
console.log(x); // 10
We used the += operator to add 5 to the value of x and re-assign the result of 10 to the variable.
Comparison Operators
Comparison operators can be used to compare two values and return a Boolean value of true or false. The following table lists the comparison operators in JavaScript and their corresponding symbols:
| Operator | Symbol | Example | Result |
|---|---|---|---|
| Equal | == | 5 == 3 | false |
| Not equal | != | 5 != 3 | true |
| Strict equal | === | 5 === "5"` | false |
| Strict not equal | !== | 5 !== "5" | true |
| Greater than | > | 5 > 3 | true |
| Less than | < | 5 < 3 | false |
| Greater than or equal to | >= | 5 >= 3 | true |
| Less than or equal to | <= | 5 <= 3 | false |
Below we cover some basic examples:
// Declare two variables and assign them values
var a = 5;
var b = 3;
// Compare the variables using comparison operators
console.log(a == b); // false
console.log(a != b); // true
console.log(a === b); // false
console.log(a !== b); // true
console.log(a > b); // true
console.log(a < b); // false
console.log(a >= b); // true
console.log(a <= b); // false
We declared two variables a and b and assigned them the values of 5 and 3, respectively. We then used the comparison operators to compare the variables and logged the results to the console.
Note that the == and != operators perform type coercion, meaning they will attempt to convert the values to the same type before making the comparison. On the other hand, === and !== operators perform strict equality comparison, which means that the values must be of the same type and value.
Logical Operators
Logical operators can be used to perform logical operations on Boolean values. The following table lists the logical operators in JavaScript and their corresponding symbols:
| Operator | Symbol | Example | Result |
|---|---|---|---|
Logical AND | && | true && false | false |
Logical OR | || | true || false | true |
Logical NOT | ! | !true | false |
In JavaScript, the logical AND (&&) and logical OR (||) operators have a feature called short-circuiting. This means that if the outcome of the operation is already known, the second operand will not be evaluated. In the case of logical AND, if the first operand is "falsy", then the second operand will not be evaluated and the first operand will be returned. Similarly, in the case of logical OR, if the first operand is "truthy", then the second operand will not be evaluated and the first operand will be returned.
Conclusion
Operators are an essential part of JavaScript. Understanding how to use the different types of operators is a fundamental prerequisite to becoming proficient in the language.
Arithmetic operators are used to performing mathematical operations on numbers.
Assignment operators are used to assigning a value to a variable.
Comparison operators are used to comparing two values and return a Boolean value of true or false.
Logical operators are used to performing logical operations on Boolean values.
In addition, JavaScript has type and bitwise operators, used for more specific tasks. Type operators, such as typeof and instanceof, are used to check the type of a value or object. Bitwise operators, such as &, |, and ~, perform operations on the individual bits of a value. We will cover these operators in more depth in future articles.