Chapter IV · Operators & Expressions

Assignment Operators

Assignment operators store values into variables. Compound operators (+=, -=, *=) fold an operation and an assignment into one step, and logical assignment operators (||=, &&=, ??=) assign only when a condition on the current value holds.

01 What Are Assignment Operators?

= is the basic assignment operator: evaluate the right side, store it in the variable on the left. Compound operators like += exist purely as shorthand — score += 5 means exactly score = score + 5, just shorter and harder to typo.

Logical assignment operators are newer (ES2021) and solve a specific, common pattern: "set this variable, but only if it doesn't already have a usable value."

02 Simple Example

Compound and logical assignment side by side.

assignment.js

let score = 10;
score += 5; // score = score + 5 -> 15

let userConfig = { theme: null };
userConfig.theme ??= 'dark'; // only assigns because theme is null
console.log(userConfig.theme); // 'dark'

03 How It Works

Compound operators read-modify-write: fetch the current value, apply the operator, write the result back — one expression, two memory operations. Logical assignment operators add a truth check before the write: ||= assigns only if the current value is falsy, &&= only if it's truthy, and ??= only if it's null or undefined. If the condition fails, the right-hand side is never even evaluated — this matters if it has side effects.

Assignment rebinds a variable to point at a new value.

04 Production Example

Applying a default theme only when the user hasn't set one, and tracking a running cart total.

user-settings.js

function applyDefaultSettings(userSettings) {
  userSettings.theme ??= 'light';       // only if null/undefined
  userSettings.notifications ??= true;
  return userSettings;
}

let cartTotal = 0;
cartTotal += 19.99; // add an item
cartTotal += 8.5;   // add another

05 Mental Model

"A labeled storage box: = replaces what's inside; += opens the box, adds to what's there, and closes it again."

06 Comparison

Operator	Assigns when...	Typical use
`\|\|=`	current value is falsy	fallback for any "empty" value (0, '', null...)
`&&=`	current value is truthy	conditionally update only if something already exists
`??=`	current value is null/undefined	safe defaults that shouldn't overwrite 0 or ''

07 Interview Questions

Q: What's the difference between ||= and ??=?

||= assigns when the current value is falsy (0, '', false, etc. included); ??= assigns only when it's null or undefined, leaving other falsy values untouched.

Q: Does a += b always evaluate a twice?

Conceptually it reads a once, computes the new value, and writes it back once — a single read-modify-write, not a re-evaluation of a as a separate expression each time.

Key Takeaway

Compound assignment is shorthand for read-modify-write; logical assignment operators add a truth check so the right-hand side only runs when it's actually needed.