Operators in JavaScript
Operators are special symbols that are used to perform operations on variables and values. JavaScript offers a wide range of operators that allow you to perform calculations, comparisons, and logical manipulations. In this article, we will explore the main types of operators in JavaScript and how to use them effectively.
1. Arithmetic Operators
Arithmetic operators are used to perform basic mathematical operations.
- Addition (+): 5 + 3 // 8
- Subtraction (-): 10 - 4 // 6
- Multiplication (_): 3 _ 4 // 12
- Division (/): 20 / 5 // 4
- Modulo (%): 17 % 5 // 2 (returns the remainder of the division)
- Exponentiation (**): 2 ** 3 // 8 (2 raised to the 3)
- Increment (++): let a = 5; a++; // a is now 6
- Decrement (—): let b = 8; b—; // b is now 7
2. Assignment Operators
These operators assign values to variables.
- Simple assignment (=): let x = 5;
- Sum assignment (+=): x += 3; // equivalent to x = x + 3
- Subtraction assignment (-=): x -= 2;
- Assignment with multiplication (_=): x _= 4;
- Division assignment (/=): x /= 2;
- Modulo assignment (%=): x %= 3;
3. Comparison Operators
They are used to compare values and return a boolean value.
- Equal (==): 5 == “5” // true (compares value, not type)
- Strictly equal (===): 5 === “5” // false (compares value and type)
- Not equal (!=): 5 != “6” // true
- Strictly not equal (!==): 5 !== “5” // true
- Greater than (>): 7 > 5 // true
- Less than (<): 3 < 2 // false
- Greater than or equal to (>=): 5 >= 5 // true
- Less than or equal to (<=): 4 <= 4 // true
4. Logical Operators
These operators work with boolean values.
- Logical AND (&&): true && false // false
- Logical OR (||): true || false // true
- Logical NOT (!): !true // false
5. Type Operators
- typeof operator: typeof 42 // “number”
- Instanceof operator: [] instanceof Array // true
6. Ternary Operator
It is a conditional operator that takes three operands.
let edad = 20;
let mensaje = edad >= 18 ? 'Eres mayor de edad' : 'Eres menor de edad';
console.log(mensaje); // "Eres mayor de edad"
7. Bitwise Operators
These operators perform bit-level operations on integer numbers.
- AND bit by bit (&): 5 & 3 // 1
- OR bit by bit (|): 5 | 3 // 7
- Bit by bit XOR (^): 5 ^ 3 // 6
- NOT bit a bit (~): ~5 // -6
- Left shift (<<): 5 << 1 // 10
- Right shift (>>): 5 >> 1 // 2
- Unsigned right shift (>>>): -5 >>> 1 // 2147483645
8. Optional Chaining Operator
Introduced in ECMAScript 2020, this operator allows reading the value of a property located within a chain of objects without having to explicitly validate that each reference in the chain is valid.
let obj = {
nested: {
prop: 'value',
},
};
console.log(obj?.nested?.prop); // 'value'
console.log(obj?.nonexistent?.prop); // undefined
9. Null Coalescing Operator
Also introduced in ECMAScript 2020, this operator (??) returns the right-hand operand when the left-hand operand is null or undefined, and otherwise returns the left-hand operand.
let nombre = null;
console.log(nombre ?? 'Anónimo'); // "Anónimo"
let edad = 0;
console.log(edad ?? 18); // 0
10. Spread Operator
This operator (…) allows expanding an iterable (like an array or an object) in places where zero or more arguments or elements are expected.
let arr1 = [1, 2, 3];
let arr2 = [...arr1, 4, 5]; // [1, 2, 3, 4, 5]
let obj1 = { a: 1, b: 2 };
let obj2 = { ...obj1, c: 3 }; // { a: 1, b: 2, c: 3 }
Conclusion
Operators in JavaScript are powerful tools that allow performing a wide range of operations, from simple mathematical calculations to complex data manipulations. Understanding how these operators work and when to use them is fundamental for writing efficient and effective JavaScript code.
It is important to remember that some operators can have unexpected behaviors, especially when working with different types of data. Therefore, it is always good practice to test your code and be aware of possible implicit type conversions.
Mastering the use of operators will allow you to write cleaner, more efficient, and more expressive code, improving your ability to solve problems and create robust applications in JavaScript.