
Conditionals branch execution based on whether an expression is truthy or falsy.

<ExamplePair>
<ExampleProse>

`if/else` is the fundamental branch. The `else if` chain handles multiple cases.

</ExampleProse>
<ExampleCode>

```js
const score = 72;

if (score >= 90) {
  console.log("A");
} else if (score >= 80) {
  console.log("B");
} else {
  console.log("C or below");
}
// C or below
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

The ternary operator `condition ? a : b` is a compact inline branch - appropriate for simple value selection, not for nesting logic.

</ExampleProse>
<ExampleCode>

```js
const age = 20;
const label = age >= 18 ? "adult" : "minor";
console.log(label); // adult
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

`||` returns the first truthy operand (or the last value if all are falsy); `&&` returns the first falsy operand (or the last value if all are truthy). `??` (nullish coalescing) returns the right side only when the left is `null` or `undefined` - unlike `||`, it does not treat `0` or `""` as missing.

</ExampleProse>
<ExampleCode>

```js
const requestedLimit = 0;

const withOr  = requestedLimit || 100;  // 100 - wrong! 0 is falsy
const withNull = requestedLimit ?? 100; // 0   - correct

console.log(withOr);   // 100
console.log(withNull); // 0
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

`switch` matches by strict equality. Without a `break`, execution falls through into the next case - a common source of bugs.

</ExampleProse>
<ExampleCode>

```js
const status = "pending";

switch (status) {
  case "pending":
    console.log("queued");
    // no break - falls through to "active"!
  case "active":
    console.log("running");
    break;
  case "done":
    console.log("finished");
    break;
  default:
    console.log("unknown");
}
// queued
// running
```

</ExampleCode>
</ExamplePair>

<InProduction>
The `||` defaulting pattern - `const host = config.host || "localhost"` - silently swallows legitimate falsy values like `0`, `""`, and `false`. This bites feature-flag evaluations, counter initializations, and port numbers. Default to `??` for optional config and only reach for `||` when you genuinely want to treat all falsy inputs as absent.
</InProduction>


if/else, ternary, logical operators as control flow, and switch's non-obvious fallthrough.

Conditionals


JavaScript offers several loop constructs. Picking the right one matters for correctness, readability, and async behavior.

<ExamplePair>
<ExampleProse>

A classic `for` loop gives full control over the index - useful when you need the position, not just the value.

</ExampleProse>
<ExampleCode>

```js
const items = ["a", "b", "c"];

for (let i = 0; i < items.length; i++) {
  console.log(i, items[i]);
}
// 0 a
// 1 b
// 2 c
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

`for-of` iterates over the _values_ of any iterable - arrays, strings, Sets, Maps, and generators. It's the modern default for sequential iteration.

</ExampleProse>
<ExampleCode>

```js
const colors = ["red", "green", "blue"];

for (const color of colors) {
  console.log(color);
}
// red
// green
// blue
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

`for-in` iterates over the _keys_ of an object - including enumerable inherited properties. Avoid it on arrays; it can surface unexpected prototype keys and the order is not guaranteed.

</ExampleProse>
<ExampleCode>

```js
const user = { name: "Ana", role: "admin" };

for (const key in user) {
  console.log(key, user[key]);
}
// name Ana
// role admin
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

`.forEach` passes each value to a callback but cannot be `break`-ed out of and cannot be awaited. `for-of` is safer in both situations.

</ExampleProse>
<ExampleCode>

```js
const ids = [1, 2, 3];

// WRONG - forEach does not await the async callback
ids.forEach(async (id) => {
  await saveToDb(id); // runs fire-and-forget
});

// CORRECT - sequential async iteration
for (const id of ids) {
  await saveToDb(id);
}

// CORRECT - parallel with bounded result collection
await Promise.all(ids.map((id) => saveToDb(id)));
```

</ExampleCode>
</ExamplePair>

<InProduction>
The `forEach` + `async` trap is one of the most common async bugs in Node.js codebases: the function returns immediately while the callbacks run in the background, so callers believe the work is done before it is. Use `for-of` with `await` for serial processing, or `Promise.all` with `.map` for parallel - and be explicit about which concurrency model you want. Unbounded `Promise.all` across 500 records can saturate a database connection pool just as effectively as a bug.
</InProduction>


for, for-of, for-in, forEach - which to use and why forEach can't be awaited.

Loops


JavaScript strings are sequences of UTF-16 code units, not characters. For most ASCII text this distinction is invisible, but it surfaces immediately when you handle emoji, accented letters, or any character outside the Basic Multilingual Plane.

<ExamplePair>
<ExampleProse>

Template literals use backticks and `${expression}` interpolation. They support multi-line strings and embed any expression - no concatenation required.

</ExampleProse>
<ExampleCode>

```js
const name = "world";
const greeting = `Hello, ${name}!`;
console.log(greeting); // Hello, world!

const multiline = `Line one
Line two`;
console.log(multiline);
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

An emoji like `"😀"` is encoded as a surrogate pair - two UTF-16 code units. The `.length` property counts code units, not visible characters, so it returns `2` for a single emoji.

</ExampleProse>
<ExampleCode>

```js
const emoji = "😀";
console.log(emoji.length); // 2 - two UTF-16 code units

// Spread iterates code points, not code units
console.log([...emoji].length); // 1 - one code point
```

</ExampleCode>
</ExamplePair>

<ExamplePair>
<ExampleProse>

`String.prototype.normalize` converts between Unicode normalization forms (NFC, NFD, NFKC, NFKD). Two strings that look identical can compare unequal if one uses a precomposed character and the other uses a base + combining mark.

</ExampleProse>
<ExampleCode>

```js
const a = "é"; // é - precomposed
const b = "é"; // é - e + combining acute accent

console.log(a === b); // false
console.log(a.normalize() === b.normalize()); // true
```

</ExampleCode>
</ExamplePair>

<InProduction>
Any string you truncate for a UI label, store in a database with a character-limit column, or split on "characters" needs [`Intl.Segmenter`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Segmenter) or a grapheme-cluster library. A naive `.slice(0, 10)` on a user's display name can cut a surrogate pair in half, writing a lone surrogate to the database and producing mojibake on read-back. Family emoji (`👨‍👩‍👧`) can be 8+ code units - `.length` will not tell you what you think.
</InProduction>


JavaScript strings are sequences of UTF-16 code units - template literals, surrogate pairs, and grapheme clusters each have important implications.