A Beginner’s Guide to Operators and Expressions in JavaScript

JavaScript is built on the foundation of operators and expressions, which allow you to perform calculations, compare values, assign data, and more. Mastering operators is crucial for writing clean, effective code. In this guide, we’ll explore arithmetic, comparison, logical, and assignment operators, along with the important concepts of precedence and associativity.

Arithmetic Operators in JavaScript

Arithmetic operators are used for performing basic mathematical operations.

Common Arithmetic Operators

Operator	Description	Example	Result
+	Addition	5 + 3	8
-	Subtraction	10 - 4	6
*	Multiplication	6 * 2	12
/	Division	10 / 2	5
%	Modulus (remainder)	10 % 3	1
**	Exponentiation (ES6)	2 ** 3	8

Example

let a = 10;  
let b = 5;  
console.log(a + b); // 15  
console.log(a % b); // 0  

Comparison Operators

Comparison operators compare two values and return a boolean (true or false).

Common Comparison Operators

Operator	Description	Example	Result
==	Equal to (loose equality)	5 == "5"	true
===	Equal to (strict equality)	5 === "5"	false
!=	Not equal (loose inequality)	5 != "6"	true
!==	Not equal (strict inequality)	5 !== "5"	true
<	Less than	3 < 5	true
>	Greater than	7 > 5	true
<=	Less than or equal to	5 <= 5	true
>=	Greater than or equal to	6 >= 8	false

Logical Operators

Logical operators combine or invert boolean expressions.

Operator	Description	Example	Result
&&	Logical AND	true && false	false
`		`	Logical OR
!	Logical NOT	!true	false

Example

let x = 10;  
let y = 20;  
console.log(x > 5 && y > 15); // true  
console.log(x < 5 || y > 15); // true  

---

Assignment Operators

Assignment operators assign or reassign values to variables.

Common Assignment Operators

Operator	Description	Example	Result
=	Assignment	x = 10	x = 10
+=	Addition assignment	x += 5	x = 15
-=	Subtraction assignment	x -= 3	x = 7
*=	Multiplication assign.	x *= 2	x = 20
/=	Division assignment	x /= 5	x = 2

Operator Precedence and Associativity

What is Precedence?

Operator precedence determines the order in which operations are performed. Operators with higher precedence are executed first.

Precedence	Operator	Description
Highest	()	Parentheses
High	*, /, %	Multiplication/Division
Low	+, -	Addition/Subtraction

What is Associativity?

When two operators have the same precedence, associativity determines the order of evaluation (left-to-right or right-to-left).

Example

let result = 10 + 5 * 2;  
console.log(result); // 20 (Multiplication first)  

Working with Expressions

An expression is a combination of values, variables, and operators that evaluates to a value.

Example

let a = 5;  
let b = 10;  
let sum = a + b * 2;  
console.log(sum); // 25  

Key Takeaways

1. Understand the differences between arithmetic, comparison, logical, and assignment operators.
2. Operator precedence and associativity are crucial for evaluating complex expressions.
3. Practice writing and evaluating expressions to build confidence in JavaScript.

FAQs

Q1: What is the difference between == and ===?
== checks for value equality, while === checks for both value and type equality.

Q2: How does operator precedence affect expressions?
Operators with higher precedence are evaluated first, making parentheses essential for clarity.

With a solid grasp of operators and expressions, you’ll be ready to tackle more advanced JavaScript concepts. Keep practicing, and happy coding!