条件与循环

这一课你将能做到

1. 写出清晰的 if / else，并用「提前 return」减少嵌套
2. 用 for 与 for...of 遍历数组，并知道为何别用 for...in 扫数组
3. 读懂简单的三元表达式 ? :，知道何时该改回 if

为什么要学

程序几乎都在做两件事：判断（够不够条件）和重复（列表每一项做一次）。
写得绕，自己下周也看不懂——所以我们强调「扁平、好读」。

评级、校验表单、渲染列表，全都是条件 + 循环的组合。
把分支写清楚，比背更多语法更重要。

先建立图像

如果（条件成立）→ 做 A
否则 → 做 B

重复：对列表里每一个 x → 做一件事

写法	适合
if / else if / else	多数业务分支
三元 ? :	很短的二选一赋值
for	需要下标、或经典计数循环
for...of	直接取数组元素（常用）
while	「不确定次数，直到某条件」

卫语句（提前 return）：
  先把「不合格」拦下并离开
  后面只写「开心路径」
  → 嵌套变浅，好读好改

跟着做

步骤 1：if 与提前离开

控制台或脚本：

function canEnter(age) {
  // 先拦无效 —— 卫语句
  if (!Number.isFinite(age)) {
    return "年龄无效";
  }
  if (age < 18) {
    return "未成年，不能进入";
  }
  // 开心路径：到这里说明合法且成年
  return "可以进入";
}

console.log(canEnter(20)); // 可以进入
console.log(canEnter(15)); // 未成年…
console.log(canEnter(NaN)); // 年龄无效

「提前 return」人话：不合格就马上结束，后面只写正常情况。比层层 else 好读。

步骤 2：三元（短判断）与何时别用

const age = 20;
const label = age >= 18 ? "成年" : "未成年";
console.log(label);

// 反例：套太多三元 → 难维护，请改 if
// const g = score >= 90 ? "A" : score >= 75 ? "B" : "C";

适合很短的二选一。逻辑一长，请改回 if。

步骤 3：经典 for 与 for...of

const lessons = ["HTML", "CSS", "JS"];

// 方式 A：需要下标时
for (let i = 0; i < lessons.length; i++) {
  console.log(i, lessons[i]);
}

// 方式 B：直接取元素（更常用）
for (const title of lessons) {
  console.log(title);
}

// 不推荐：用 for...in 遍历数组（会碰到非数字键、顺序坑）
// for (const k in lessons) { ... }

你应看到下标版打印 0 HTML 等，for...of 只打印标题。