← Back to JavaScript Course | Chapter 1: Basics & Syntax | Lesson 10 of 12

JS Operators

Think of a toolbox with different tools for different jobs, a hammer for nails, a wrench for bolts, a tape measure for checking size, each tool does one specific kind of work. JavaScript operators are those tools for working with values, arithmetic operators do math, comparison operators check how values relate to each other, and logical operators combine true and false results together. This chapter is a broad tour of the main operator families, each gets its own deeper chapter later, but seeing them together first helps when reading real code on sites like cookiescursor.com.

In this page:

  1. Arithmetic Operators
  2. Comparison Operators
  3. Logical Operators
  4. Assignment and Ternary Operators
  5. typeof and Spread Operators
Syntax
javascript 
result = operand1 operator operand2;

Arithmetic Operators

Arithmetic operators perform mathematical calculations on numbers, including addition, subtraction, multiplication, division, and more specialized operations like remainder and exponentiation.

Note: The + operator also works on strings to join them together, its behavior depends entirely on the types of values involved.
Warning: Dividing by zero in JavaScript does not throw an error, it returns Infinity or -Infinity instead, which can hide bugs if not checked for.

Example: Arithmetic Operators

javascript 
// Print `10 + 3` to the console
// Print `10 + 3` to the console
console.log(10 + 3);
// Print `10 % 3` to the console
// Print `10 % 3` to the console
console.log(10 % 3);
// Print `2 ** 3` to the console
// Print `2 ** 3` to the console
console.log(2 ** 3);

Comparison Operators

Comparison operators compare two values and produce a boolean result, true or false, including equal to, not equal to, greater than, and less than, with strict versions that also check type.

Note: Prefer the strict === and !== over == and != in almost all cases, they avoid surprising type conversion bugs.
Warning: == considers 5 (a string) and 5 (a number) equal after converting types, while === correctly treats them as different.

Example: Comparison Operators

javascript 
// Print `5 == "5"` to the console
// Print `5 == "5"` to the console
console.log(5 == "5");
// Print `5 === "5"` to the console
// Print `5 === "5"` to the console
console.log(5 === "5");
// Print `5 > 3` to the console
// Print `5 > 3` to the console
console.log(5 > 3);

Logical Operators

Logical operators combine or invert boolean values, && (and) requires both sides to be true, || (or) requires at least one side to be true, and ! (not) flips a boolean's value entirely.

Note: Logical operators are essential for combining multiple conditions in an if statement without nesting them separately.
Warning: && and || don't always return strict true or false, they return one of the original operand values, which matters in more advanced usage.

Example: Logical Operators

javascript 
// Print `true && false` to the console
// Print `true && false` to the console
console.log(true && false);
// Print `true || false` to the console
// Print `true || false` to the console
console.log(true || false);
// Print `!true` to the console
// Print `!true` to the console
console.log(!true);

Assignment and Ternary Operators

The assignment operator = stores a value in a variable, and JavaScript also offers a compact ternary operator, condition ? valueIfTrue : valueIfFalse, as a shorthand for a simple if/else that produces a value.

Note: Reach for the ternary operator when you need to pick between two simple values, but keep using full if/else for more complex logic.
Warning: Nesting multiple ternary operators together can quickly become difficult to read, prefer if/else once logic gets more complex.

Example: Assignment and Ternary Operators

javascript 
// Declare the variable `age`, set to `20`
// Declare the variable `age`, set to `20`
let age = 20;
// Declare the variable `status`, set to `age >= 18 ? "adult" : "minor"`
// Declare the variable `status`, set to `age >= 18 ? "adult" : "minor"`
let status = age >= 18 ? "adult" : "minor";
// Print `status` to the console
// Print `status` to the console
console.log(status);

typeof and Spread Operators

typeof returns a string describing a value's type, useful for checking what kind of data you're working with, while the spread operator ... expands an array or object's elements individually, commonly used for copying or combining collections.

Note: typeof is especially handy for quickly checking whether a value is a number, string, or something unexpected before processing it further.
Warning: typeof null famously returns object, a long-standing quirk in JavaScript that catches many developers off guard.

Example: typeof and Spread Operators

javascript 
// Print `typeof "hello"` to the console
// Print `typeof "hello"` to the console
console.log(typeof "hello");
// Print `typeof null` to the console
// Print `typeof null` to the console
console.log(typeof null);
// Declare the constant `nums`, set to `[1, 2, 3]`
// Declare the constant `nums`, set to `[1, 2, 3]`
const nums = [1, 2, 3];
// Print `[...nums, 4, 5]` to the console
// Print `[...nums, 4, 5]` to the console
console.log([...nums, 4, 5]);
Live Example
Related Topics

JS Bitwise Operators · JS Const · JS Comparisons · JS Let

{# common_mistakes/chapter_summary/browser_support: on Hindi pages the view already swaps in the hi_ translation fields (or blanks these out if untranslated), so this renders correctly for both languages without a lang_code check here. #}
Common Mistakes
  1. Confusing = (assignment) with == or === (comparison), a single equals sign always assigns, never compares.
  2. Using == instead of === for comparisons, which can produce unexpected results due to automatic type conversion.
  3. Forgetting operator precedence, like assuming addition always happens before multiplication in a mixed expression.
Chapter Summary
  • Arithmetic operators perform math, comparison operators test relationships, and logical operators combine boolean results.
  • The assignment operator = sets a value, while === strictly compares both value and type without conversion.
  • The ternary operator offers a compact one-line alternative to a simple if/else statement.
Browser Support

All core JavaScript operators, arithmetic, comparison, logical, assignment, ternary, typeof, and spread, are supported identically across every modern browser.

🔒

Chapter Quiz — Complete all 12 topics to unlock

0/12 topics done

Complete these topics first:

← Previous Lesson JS Const Next Lesson → JS Comparisons

Login to run this code

C/C++/Java/PHP execution requires a free account. Your code is saved — you'll land right back in the editor after logging in.