红宝书第三讲:JavaScript 操作符与流程控制详解

红宝书第三讲:JavaScript 操作符与流程控制详解

资料取自《JavaScript高级程序设计(第5版)》。 查看所有教程:红宝书学习大纲


一、常用操作符

操作符用于对数据进行计算和比较:^1^

  1. 算数操作符

    • +(加)、-(减)、*(乘)、**(幂)、/(除)

      javascript 复制代码
      const sum = 10 + 5;   // 结果为15
      const power = 2 ** 3; // 2的3次方,结果为8
  2. 比较操作符

    • >(大于)、<(小于)、==(相等,会转换类型)、===(严格相等,类型和值都相同) )^1^

      javascript 复制代码
      5 == "5";   // true(数值转换后相等)
      5 === "5";  // false(类型不同
  3. 逻辑操作符

    • &&(逻辑与)、||(逻辑或)、!(逻辑非) ^2^

      javascript 复制代码
      if (age > 18 && loggedIn) { 
          // 年龄大于18且已登录才执行
      } else if (isVIP || isAdmin) {
          // VIP或管理员满足其一即可
      }
  4. 空值合并操作符(??

    • 当左侧是 nullundefined 时返回右侧值: ^1^

      javascript 复制代码
      const username = inputName ?? "Guest"; // 若inputName为空,则用"Guest"

二、条件语句

根据条件执行不同代码块:

  1. if / else if / else

    • 基本条件判断: ^2^

      javascript 复制代码
      if (score >= 90) {
          console.log("优秀");
      } else if (score >= 60) {
          console.log("及格");
      } else {
          console.log("不及格");
      }
  2. switch 语句

    • 适用于多分支判断(必须有 break 退出): ^1^

      javascript 复制代码
      switch (day) {
          case 1:
              console.log("周一");
              break;
          case 2:
              console.log("周二");
              break;
          default:
              console.log("其他日期");
      }

三、循环语句

重复执行代码段:

  1. for 循环

    • 常用于确定次数的重复: ^1^

      javascript 复制代码
      let total = 0;
      for (let i = 1; i <= 10; i++) {
          total += i; // 计算1到10的总和
      }
  2. for-of 循环

    • 遍历数组和可迭代对象: ^3^

      javascript 复制代码
      const fruits = ["苹果", "香蕉", "橘子"];
      for (const fruit of fruits) {
          console.log(fruit); // 依次输出每个水果名称
      }
  3. while / do-while 循环 ^2^

    • while:先判断条件后执行

    • do-while:至少执行一次再判断条件:

      javascript 复制代码
      let count = 0;
      while (count < 5) {    
          console.log(count);
          count++;
      } // 输出0到4
      
      let num = 10;
      do {
          console.log(num); // 输出10,即使条件不成立
      } while (num < 5);

四、流程控制关键字

  1. break :立即退出整个循环或 switch 语句

    javascript 复制代码
    for (let i = 0; i < 10; i++) {
        if (i === 5) break; // 当i=5时结束循环
    }
  2. continue :跳过当前循环的剩余代码,进入下一次循环 ^1^

    javascript 复制代码
    for (let i = 0; i < 10; i++) {
        if (i % 2 === 0) continue; // 跳过偶数
        console.log(i); // 输出奇数
    }

目录:总目录 上篇文章:第二讲:JavaScript变量声明:varletconst详解

Footnotes

  1. 条件判断、switch、循环语法,《JavaScript高级程序设计(第5版)》 第3章 2 3 4 5 6

  2. if 多分支与 do-while 示例,《JavaScript高级程序设计(第5版)》 第3章 2 3

  3. for-of 遍历数组的用法,《JavaScript高级程序设计(第5版)》 第3章

相关推荐
桂月二二16 分钟前
Vue3服务端渲染深度实战:SSR架构优化与企业级应用
前端·vue.js·架构
萌萌哒草头将军16 分钟前
🚀🚀🚀 这六个事半功倍的 Pinia 库,你一定要知道!
前端·javascript·vue.js
_一条咸鱼_17 分钟前
深入剖析 Vue 状态管理模块原理(七)
前端·javascript·面试
rocky19127 分钟前
谷歌浏览器插件 录制动态 DOM 元素
前端
谁还不是一个打工人30 分钟前
css解决边框四个角有颜色
前端·css
海晨忆1 小时前
【Vue】v-if和v-show的区别
前端·javascript·vue.js·v-show·v-if
JiangJiang2 小时前
🚀 Vue人看React useRef:它不只是替代 ref
javascript·react.js·面试
1024小神2 小时前
在GitHub action中使用添加项目中配置文件的值为环境变量
前端·javascript
龙骑utr2 小时前
qiankun微应用动态设置静态资源访问路径
javascript
Jasmin Tin Wei2 小时前
css易混淆的知识点
开发语言·javascript·ecmascript