前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >JavaScript入门之流程控制语句

JavaScript入门之流程控制语句

作者头像
方才编程_公众号同名
发布2024-10-23 14:23:11
780
发布2024-10-23 14:23:11
举报
文章被收录于专栏:方才编程

文章转载至:https://fangcaicoding.cn/article/52

JavaScript入门-流程控制语句

流程控制语句是编程语言非常重要的内容,复杂功能的实现,本质就是单个简单功能、按不同条件或不同顺序进行组合而成。编程是需要有流程的思维的。

流程控制语句用于根据条件执行不同的代码块,或多次重复执行某个代码块。

条件语句

if语句

if根据条件表达式的结果,确定是否执行某个代码块。代码示例:

代码语言:javascript
复制
let age = 16;

if (age < 18) {
    console.log("年轻真好!");
} 
console.log("快乐就好!");

输出:

代码语言:javascript
复制
年轻真好!
快乐就好!

看流程图:

if/else 语句

if/else 语句根据表达式的结果(truefalse)来决定执行哪个代码块。

代码语言:javascript
复制
let age = 20;

if (age < 18) {
    console.log("年轻真好!");
} else {
    console.log("长大了也挺幸福!");
}
 console.log("活着就好!");

输出:

代码语言:javascript
复制
长大了也挺幸福!
活着就好!

结合流程图理解:

if-else-if 语句

当有多个条件时,可以使用 else if 来进行多级判断。

代码语言:javascript
复制
let score = 85;

if (score >= 90) {
    console.log("优秀");
}  else if (score >= 80) {
    console.log("良好");
}  else if (score >= 60) {
    console.log("及格");
}  else {
    console.log("不及格");
}

输出:

代码语言:javascript
复制
良好

流程示例:

switch 语句

switch 语句用于针对多个可能的值执行不同的代码块。相比 if/else,它可以在多个可能的值之间进行选择。

代码语言:javascript
复制
let fruit = "香蕉";

switch (fruit) {
    case "苹果":
        console.log("你选择了苹果");
        break;
    case "香蕉":
        console.log("你选择了香蕉");
        break;
    default:
        console.log("未知的水果");
}

输出:

代码语言:javascript
复制
你选择了香蕉

流程图示例:

注意:每个 case 语句的代码块,都建议加上break关键字,若没有break关键字,会执行匹配成功的代码块和之后的所有代码块。

代码语言:javascript
复制
let fruit = "苹果";

switch (fruit) {
    case "苹果":
        console.log("你选择了苹果");
    case "香蕉":
        console.log("你选择了香蕉");
    default:
        console.log("未知的水果");
}

输出:

代码语言:javascript
复制
你选择了苹果
你选择了香蕉
未知的水果

流程图就会变成这样:

循环与迭代

for 循环

for 循环是一种常用的迭代方式,它允许你指定初始值、条件表达式和变量运算(一般是自增或自减)操作。语法规则:

代码语言:javascript
复制
for(初始变量;条件表达式;变量运算){  
// 循环体
}

示例:

代码语言:javascript
复制
for (let i = 0; i < 5; i++) {
    console.log("当前计数:" + i);
}
或 
for (let i = 0; i < 5; i = i+1) {
    console.log("当前计数:" + i);
}

输出:

代码语言:javascript
复制
当前计数:0
当前计数:1
当前计数:2
当前计数:3
当前计数:4

whiledo...while 循环

流程上和 for循环是一样的,只是在语法上有所区别。

while 循环在条件为 true 时会不断执行循环体代码。

代码语言:javascript
复制
let count = 0;

while (count < 3) {
    console.log("循环次数:" + count);
    count++;
}

do...while 循环则会先执行一次代码块,然后再判断条件是否继续循环。

代码语言:javascript
复制
let count = 0;

do {
    console.log("循环次数:" + count);
    count++;
} while (count < 3);

for...infor...of 循环

  • for...in:遍历对象的属性。
  • for...of:遍历数组或可迭代对象的值。
代码语言:javascript
复制
let person = { name: "Alice", age: 25 };

for (let key in person) {
    console.log(key + ": " + person[key]); // 遍历对象属性
}

let numbers = [1, 2, 3];

for (let num of numbers) {
    console.log(num); // 遍历数组元素
}

breakcontinuereturn

在编写 JavaScript 程序时,控制代码的执行流程非常重要。breakcontinuereturn 是三个常见的关键字,它们用于改变循环或函数的默认行为。下面我们将详细解释这三个关键字的用法:

  • break 用于退出循环或 switch 语句,立即终止循环执行。
  • continue 用于跳过当前循环的剩余部分,继续下一次迭代
  • return 用于在函数中返回值,并终止函数的执行。

break 关键字:

break 关键字用于立即退出当前的循环或 switch 语句,不再继续执行剩下的循环或判断。通常在需要提前终止循环或跳出多重判断时使用。

  • 使用场景 1:跳出循环
代码语言:javascript
复制
for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break;  // 当 i 等于 5 时,立即跳出循环
  }
  console.log(i);  // 输出 0, 1, 2, 3, 4
}

在上面的示例中,当 i 等于 5 时,break 会停止整个循环,不再执行后面的迭代。

  • 使用场景 2:用于 switch 语句

break 还用于 switch 语句中的每个 case,以防止执行落入下一个 case 中。

代码语言:javascript
复制
let day = 3;
switch (day) {
  case 1:
    console.log("Monday");
    break;
  case 2:
    console.log("Tuesday");
    break;
  case 3:
    console.log("Wednesday");
    break;  // 遇到 break 立即结束,避免执行后面的 case
  default:
    console.log("Invalid day");
}

continue 关键字

continue 关键字用于跳过当前循环的剩余代码,立即进入下一次迭代。break 不同的是,continue 不会退出循环,只是跳过本次循环中的后续代码。

  • 使用场景 :跳过某些迭代
代码语言:javascript
复制
for (let i = 0; i < 5; i++) {
  if (i === 2) {
    continue;  // 跳过 i 等于 2 的这一轮
  }
  console.log(i);  // 输出 0, 1, 3, 4
}

在上面的示例中,当 i 等于 2 时,continue 会跳过当前迭代,因此不会输出 2,而是直接进入下一次迭代。

return 关键字

return 关键字用于在函数中返回一个值,并立即停止函数的执行。return 是函数中结束函数执行的方式。

  • 使用场景 :返回值并结束函数
代码语言:javascript
复制
function sum(a, b) {
  return a + b;  // 返回两个参数相加的结果
}

let result = sum(3, 5);
console.log(result);  // 输出 8

在这个示例中,returna + b 的结果返回给调用该函数的地方,并停止执行函数。

  • 使用场景 2:提前结束函数
代码语言:javascript
复制
function checkAge(age) {
  if (age < 18) {
    return "Not allowed";  // 如果条件满足,函数立即返回并停止
  }
  return "Welcome";  // 如果条件不满足,执行这行
}

console.log(checkAge(16));  // 输出 "Not allowed"
console.log(checkAge(21));  // 输出 "Welcome"

return 也可以用于提前结束函数执行,如上例中如果 age 小于 18,函数会立即返回 "Not allowed",不再执行后面的代码。

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2024-10-22,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 方才编程 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • JavaScript入门-流程控制语句
    • 条件语句
      • if语句
      • if/else 语句
      • if-else-if 语句
      • switch 语句
    • 循环与迭代
      • for 循环
      • while 和 do...while 循环
      • for...in 和 for...of 循环
    • break、continue 和 return
      • break 关键字:
      • continue 关键字
      • return 关键字
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档