ARTICLE · INTELLIGENCE

战地情报 · 详情页

来自尧图项目组的一线实战观察与深度解析

现代 JavaScript 教程:if/switch 判断与 while/for 循环完全指南,写出更健壮的代码

现代 JavaScript 教程:if/switch 判断与 while/for 循环完全指南,写出更健壮的代码 现代 JavaScript 教程if/switch 判断与 while/for 循环完全指南写出更健壮的代码【免费下载链接】zh.javascript.info现代 JavaScript 教程The Modern JavaScript Tutorial以最新的 ECMAScript 规范为基准通过简单但足够详细的内容为你讲解从基础到高阶的 JavaScript 相关知识。项目地址: https://gitcode.com/gh_mirrors/zh/zh.javascript.info本教程基于《现代 JavaScript 教程》The Modern JavaScript Tutorial官方中文资料面向新手讲解 JavaScript 中最重要的两类基础语法if/switch 条件判断与while/for 循环。掌握这两个主题你就拥有了编写健壮代码的第一块基石——本文提供一份简洁、易懂的完全指南。一分钟搞懂 if 条件判断if语句是最基本的条件分支把表达式放在括号里结果为真值就执行代码块。let age prompt(你多大了, ); if (age 18) { alert(欢迎来到现代 JavaScript 世界); }几个新手必须记住的规则真值与假值数字0、空字符串、null、undefined、NaN会转成false假值其余值都是true真值。else与else if条件不成立时走else多个条件依次判断就用else if链。永远写大括号{}即使代码块只有一行也建议加上大括号可读性和安全性都会更好。三元运算符?条件 ? 值1 : 值2适合根据条件取值但不要用它替代if来执行代码分支——可读性更差。 详细讲解见官方章节条件分支 if 和 问号运算符switch 多分支选择比一长串 else if 更清晰当你要对同一个变量的多个值做判断时switch比一长串if/else if更直观switch (fruits) { case Apple: alert(Apple 很甜); break; case Mango: alert(芒果季真香); break; default: alert(没听过这种水果); }使用switch的三大关键技巧每个分支记得break漏掉break会穿透到下一个 case 继续执行这是新手最经典的 bug 来源。严格相等匹配switch用的是严格相等类型不一致就匹配不上字符串3不等于数字3。case 分组多个值执行相同逻辑时可以连续书写多个case共享一段代码。 完整语法与示例switch 语句while / for 循环重复执行的正确姿势循环loop让代码可以重复运行。JavaScript 提供三种基础形式循环类型特点适用场景while (条件)每次迭代前检查条件不知道要循环几次do..while先执行一次再检查条件必须至少执行一次for (开始; 条件; 步长)结构最完整、最常用已知循环次数最典型的for循环长这样for (let i 0; i 3; i) { alert(i); // 依次输出 0、1、2 }执行顺序是开始执行一次 → 检查条件→ 执行循环体 → 执行步长如此反复直到条件为假。⚠️死循环警示如果循环体内忘了写i步长条件永远为真循环就永远不会结束——这就是无限循环网页会直接卡死。这也是为什么健壮的循环代码必须保证每次迭代都在向终止条件靠近。 三种循环的完整讲解与练习循环 while 和 forbreak 与 continue随时安全退出循环循环中还有两个控制开关让你写出更灵活的代码break立即终止整个循环。经典用法是while (true)无限循环 中间任意位置break适合用户随时可能取消的交互场景比如连续输入数字求和用户按取消就停止。continue跳过本次迭代直接进入下一次循环。例如只输出奇数遇到偶数就continue。进阶技巧嵌套循环中想一次性跳出所有外层循环可以给循环起个标签然后用break 标签名跳出到那一层。 标签与跳出循环的细节跳出循环break/continue 标签用开发者工具调试你的循环代码写得再仔细运行时也可能出错。现代 JavaScript 教程强烈建议善用浏览器开发者工具按F12打开控制台Console可以直接执行 JavaScript 语句、查看报错信息再配合源代码面板的断点可以一行一行地观察循环每轮迭代时变量的变化——调试 while/for 循环时尤其有用。Chrome 开发者工具界面示意Safari 用户也可以打开开发菜单使用类似的控制台 更多使用方法见调试代码Chrome 开发者工具写出健壮代码的 5 个实用建议if 永远加大括号避免后续追加语句时漏进/漏出条件块。switch 每个 case 配 break或 default防止意外穿透。循环前想清楚终止条件写循环前先问自己什么情况下它一定会停能回答才动手写。用for (let i 0; ...)声明内联变量计数变量只存在于循环内不会污染外部作用域。优先用continue减少嵌套先处理跳过的分支主逻辑平铺直叙比层层if更可读。延伸学习路径想继续深入这本现代 JavaScript 教程建议按以下章节顺序练习条件分支入门1-js/02-first-steps/10-ifelse/article.mdswitch 多分支选择1-js/02-first-steps/14-switch/article.mdwhile / do..while / for 循环1-js/02-first-steps/13-while-for/article.md逻辑运算符配合条件判断1-js/02-first-steps/11-logical-operators/article.md练习题与答案目录1-js/02-first-steps/把 if/switch 与 while/for 练熟你后续学习函数、数组遍历、异步编程时会轻松很多。祝你编码愉快【免费下载链接】zh.javascript.info现代 JavaScript 教程The Modern JavaScript Tutorial以最新的 ECMAScript 规范为基准通过简单但足够详细的内容为你讲解从基础到高阶的 JavaScript 相关知识。项目地址: https://gitcode.com/gh_mirrors/zh/zh.javascript.info创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED READING

延伸阅读

更多一线实战笔记与深度复盘,助您持续精进