Operators in JavaScript
Introduction to Operators
In JavaScript, an operator is a special symbol that performs an action on values (called operands). You use operators to perform calculations, compare values, assign data, combine strings, and more.
- Operand: The value or variable the operator works on.
- Operator: The symbol that performs the action.
- Expression: A combination of operands and operators that produces a result.
let sum = 5 + 3; // '+' is the operator, 5 and 3 are operands, sum is 8
Unary and Binary Operators
Operators are classified based on the number of operands they use:
- Unary operator: Works on a single operand. Example: `++x` or `typeof x`.
- Binary operator: Works on two operands. Example: `x + y`.
let x = 5; console.log(-x); // Unary minus, outputs -5 console.log(x + 2); // Binary addition, outputs 7
Arithmetic Operators
- `+` Addition
- `-` Subtraction
- `*` Multiplication
- `/` Division
- `%` Remainder (modulus)
- `**` Exponentiation
console.log(5 + 3); // 8 console.log(5 - 3); // 2 console.log(5 * 3); // 15 console.log(5 / 2); // 2.5 console.log(5 % 2); // 1 (remainder) console.log(2 ** 3); // 8 (2 to the power 3)
String Concatenation with +
The `+` operator can also join strings. If one operand is a string, JavaScript converts the other to a string and concatenates them.
console.log('Hello' + ' ' + 'World'); // Hello World console.log('Number: ' + 5); // Number: 5
Unary Plus for Numeric Conversion
The unary `+` converts its operand to a number if possible.
console.log(+"5" + 2); // 7 console.log(+true); // 1 console.log(+false); // 0
Operator Precedence
Precedence determines which operator is applied first in an expression. For example, multiplication has higher precedence than addition.
console.log(2 + 3 * 4); // 14, because * runs before + console.log((2 + 3) * 4); // 20, parentheses change the order
Assignment Operators
The `=` operator assigns a value. Other assignment operators combine assignment with another operation.
- `x += y` → x = x + y
- `x -= y` → x = x - y
- `x *= y` → x = x * y
- `x /= y` → x = x / y
- `x %= y` → x = x % y
- `x **= y` → x = x ** y
let a = 5; a += 3; // a = 8 a *= 2; // a = 16
Chaining Assignment
let a, b, c; a = b = c = 5; // all become 5
Increment and Decrement
`++` increases a number by 1, `--` decreases it by 1. Prefix form changes before using the value, postfix changes after.
let count = 5; // Prefix increment: increases first, then returns the value console.log(++count); // 6 (count is now 6) // Postfix increment: returns the value first, then increases console.log(count++); // 6 (count becomes 7 after this line) console.log(count); // 7 (now updated) // Postfix decrement example let num = 3; console.log(num--); // 3 (num becomes 2 after this line) console.log(num); // 2
Bitwise Operators
Bitwise operators work at the binary level. JavaScript converts numbers to 32-bit signed integers, operates on their binary form, and then converts back.
- `&` AND
- `|` OR
- `^` XOR
- `~` NOT
- `<<` Left shift
- `>>` Right shift (sign-propagating)
- `>>>` Zero-fill right shift
// Example: Bitwise AND let x = 5; // 0101 in binary let y = 3; // 0011 in binary console.log(x & y); // 0001 → 1 // Bitwise OR console.log(x | y); // 0111 → 7 // Bitwise XOR console.log(x ^ y); // 0110 → 6 // Bitwise NOT console.log(~x); // -(x+1) → -6 // Left Shift console.log(x << 1); // 1010 → 10 // Right Shift console.log(x >> 1); // 0010 → 2 // Zero-fill Right Shift console.log(x >>> 1); // 0010 → 2
Comma Operator
The comma `,` evaluates multiple expressions and returns the result of the last one.
let result = (1 + 2, 3 + 4); console.log(result); // 7
Comparison Operators
- `>` greater than
- `<` less than
- `>=` greater than or equal
- `<=` less than or equal
- `==` equal (loose, type converts)
- `===` strict equal
- `!=` not equal (loose)
- `!==` strict not equal
console.log(5 == '5'); // true (type conversion) console.log(5 === '5'); // false (different type)
Logical Operators
Logical operators work with boolean values but can also return non-boolean results.
- `&&` AND
- `||` OR
- `!` NOT
console.log(true && false); // false console.log(true || false); // true console.log(!true); // false
Conditional (Ternary) Operator
The ternary operator `? :` chooses between two values based on a condition.
let age = 18; let message = (age >= 18) ? 'Adult' : 'Minor'; console.log(message); // Adult
JavaScript Operators — Quick Summary
- An operator is a symbol that performs an action on values (operands).
- Operands are the values on which operators work, e.g., in 5 + 3, '5' and '3' are operands and '+' is the operator.
- Operators can be unary (work with one operand) or binary (work with two operands).
- Mathematical operators include +, -, *, /, %, ** for arithmetic operations.
- String concatenation (+) joins strings together; the unary + can convert strings to numbers.
- Operator precedence decides the order in which operations are performed.
- Assignment (=) stores a value in a variable; compound assignments like +=, -=, *= modify in place.
- Increment (++), decrement (--) increase or decrease a number by 1 (prefix or postfix forms).
- Bitwise operators (&, |, ^, ~, <<, >>, >>>) work on the binary representation of numbers.
- The comma (,) operator evaluates multiple expressions and returns the last one.
- Comparison operators (==, ===, !=, !==, >, <, >=, <=) compare values and return a boolean.
- Logical operators (&&, ||, !) combine or invert boolean values.
- The conditional (ternary) operator condition ? value1 : value2 returns one of two values based on a condition.