search
HomeWeb Front-endJS TutorialOrganize Javascript flow control statement study notes_javascript skills

1. Make a judgment (if statement)
The if statement is a statement used to execute the corresponding code based on the condition being met.
Syntax:

 if(条件){
   条件成立时执行代码
 }

Example: Suppose you apply for a web front-end technology development position. If you know HTML technology and you succeed in the interview, you are welcome to join the company.

<script type="text/javascript">
   var mycarrer = "HTML";
   if (mycarrer == "HTML"){
     document.write("你面试成功,欢迎加入公司。");
   }
 </script>

2. Choose one of the two (if...else statement)

The if...else statement is the code that executes when the specified condition is true, and the code after else is executed when the condition is not true.
Grammar:

 if(条件){
   条件成立时执行的代码
 }else{
   条件不成立时执行的代码
 }

Example: Suppose you apply for a web front-end technology development position. If you know HTML technology and you succeed in the interview, you are welcome to join the company. Otherwise, you fail in the interview and cannot join the company.

<script type="text/javascript">
   var mycarrer = "HTML"; //mycarrer变量存储技能
   if (mycarrer == "HTML"){
     document.write("你面试成功,欢迎加入公司。"); 
   }else{
     //否则,技能不是HTML
     document.write("你面试不成功,不能加入公司。");
   }
 </script>

3. Multiple judgments (if...else nested statements)
To select one group of multiple groups of statements to execute, use if..else nested statements.
Syntax:

 if(条件1)
 { 条件1成立时执行的代码}
 else if(条件2)
 { 条件2成立时执行的代码}
 ...
 else if(条件n)
 { 条件n成立时执行的代码}
 else
 { 条件1、2至n不成立时执行的代码}

Example: According to the age classification standards of the United Nations World Health Organization, those under 44 years old are young people; those between 45 and 59 years old are middle-aged people. The elderly are those between 60 and 89 years old; the longevity elderly are those over 90 years old. Zhao Hong is 99 years old this year. Which age group does she belong to?

<script type="text/JavaScript">
   var myage =99;//赵红的年龄为99
   if(myage<=44){
     document.write("青年");
   }else if(myage<=59) {
     document.write("中年人");
   }else if (myage<=89){
     document.write("老年人");
   }else {
     document.write("长寿老年人");
   }
 </script>

4. Multiple choices (Switch statement)
When there are many options, switch is more convenient to use than if else.

 switch(表达式)
 {
 case值1:
 执行代码块 1
 break;
 case值2:
 执行代码块 2
 break;
 ...
 case值n:
 执行代码块 n
 break;
 default:
 与 case值1 、 case值2...case值n 不同时执行的代码
 }

Grammar description:
Switch must be assigned an initial value, and the value matches each case value. Satisfy all statements after executing the case, and use the break statement to prevent the next case from running. If all case values ​​do not match, the statement after default is executed.
Example: Let’s make a weekly plan, study concepts and knowledge on Monday and Tuesday, practice in the company on Wednesday and Thursday, summarize experience on Friday, rest and have fun on Saturday and Sunday.

 <script type="text/JavaScript">
   var myweek =3;//myweek表示星期几变量
   switch(myweek){
     case 1:
     case 2:
     document.write("学习理念知识");
     break;
     case 3:
     case 4:
     document.write("到企业实践");
     break;
     case 5:
     document.write("总结经验");
     break;
     default:
     document.write("周六、日休息和娱乐");
   }
 </script>

5. Repeat (for loop)
Many things are not just done once, but done repeatedly. For example, print 10 copies of the test paper, one at a time, and repeat this action until the printing is completed. We use loop statements to accomplish these things. Loop statements are to repeatedly execute a piece of code.
for statement structure:

 for(初始化变量;循环条件;循环迭代)
 { 
   循环语句 
 }

Example: If there are 6 balls in a box, we take one at a time and repeatedly take out the balls from the box until all the balls are taken.

 <script type="text/javascript">
   var num=1;
   for (num=1;num<=6;num++){ //初始化值;循环条件;循环后条件值更新
     document.write("取出第"+num+"个球<br />");
   }
 </script>

We have money of different denominations 1, 2, 3...10. Use the for statement to complete the total and see how much money we have in total?

 <script type="text/JavaScript">
   var mymoney,sum=0;//mymoney变量存放不同面值,sum总计
   for(mymoney=1;mymoney<=10;mymoney++){ 
     sum= sum + mymoney;
   }
   document.write("sum合计:"+sum);
 </script>

6. Repeatedly (while loop)
The while loop has the same function as the for loop. The while loop repeatedly executes a section of code until a certain condition is no longer met.
while statement structure:

 while(判断条件)
 {
   循环语句
 }

Use a while loop to complete the action of taking balls from the box, one at a time, for a total of 6 balls.

<script type="text/javascript">
   var num=0; //初始化值
   while (num<=6){ //条件判断
     document.write("取出第"+num+"个球<br />");
     num=num+1; //条件值更新
   }
 </script> 

7. Back and forth (Do...while loop)
The basic principle of the do while structure is basically the same as that of the while structure, but it ensures that the loop body is executed at least once. Because it executes the code first, then judges the condition. If the condition is true, the loop continues.
do...while statement structure:

 do
 {
   循环语句
 }
 while(判断条件)

Try to output 5 numbers.

<script type="text/javascript">
   num= 1;
   do{
     document.write("数值为:" + num+"<br />");
    num++; //更新条件
   }
   while (num<=5)
 </script>

Use do...while statement to output 6 numbers.

<script type="text/javascript">
   var mynum =6;//mynum初值化数值为6
   do{
     document.write("数字:"+mynum+"<br/>");
     mynum=mynum-1;
   }
  while(mynum>=1);
 </script>

8. Exit the loop break
Use the break statement in while, for, do...while, while loops to exit the current loop and directly execute the following code.
The format is as follows:

 for(初始条件;判断条件;循环后条件值更新){
   if(特殊情况)
   {break;}
   循环代码
 }

Output the test scores. If the score is passed, continue to output the next score. If the score is failed, exit and subsequent scores will not be output.

 <script type="text/JavaScript">
   var mynum =new Array(70,80,66,90,50,100,89);//定义数组mynum并赋值
   var i=0;
   while(i<mynum.length){
     if(mynum[i]<60){
     document.write("成绩"+mynum[i]+"不及格,不用循环了"+"<br>");
     break;
     }
     document.write("成绩:"+mynum[i]+"及格,继续循环"+"<br>");
     i=i+1;
   }
 </script>

9. Continue the loop
Statement structure:

 for(初始条件;判断条件;循环后条件值更新){
   if(特殊情况){
     continue;
   }
   循环代码
 }

In the above loop, when a special situation occurs, this loop will be skipped, and subsequent loops will not be affected.
Example: Output test scores. If the score is passed, the next score will be output. If the score is failed, the score will not be output.

<script type="text/JavaScript">
   var mynum =new Array(70,80,66,90,50,100,89);//定义数组mynum并赋值
   var i;
   for(i=0;i<mynum.length;i++){
     if(mynum[i]<60){
       document.write("成绩不及格,不输出!"+"<br>");
       continue;
     }
     document.write("成绩:"+mynum[i]+"及格,输出!"+"<br>");
   }
 </script>

在一个大学的编程选修课班里,我们得到了一组参加该班级的学生数据,分别是姓名、性别、年龄和年级,接下来呢,我们要利用JavaScript的知识挑出其中所有是大一的女生的的名字哦。

学生信息如下:

    ('小A','女',21,'大一'),  ('小B','男',23,'大三'),

    ('小C','男',24,'大四'),  ('小D','女',21,'大一'),

    ('小E','女',22,'大四'),  ('小F','男',21,'大一'),

    ('小G','女',22,'大二'),  ('小H','女',20,'大三'),

    ('小I','女',20,'大一'),  ('小J','男',20,'大三')

<script type="text/javascript">
  //第一步把之前的数据写成一个数组的形式,定义变量为 infos
  var infos = [
    ['小A','女',21,'大一'],
    ['小B','男',23,'大三'],
    ['小C','男',24,'大四'],
    ['小D','女',21,'大一'],
    ['小E','女',22,'大四'],
    ['小F','男',21,'大一'],
    ['小G','女',22,'大二'],
    ['小H','女',20,'大三'],
    ['小I','女',20,'大一'],
    ['小J','男',20,'大三']
  ];
  //第一次筛选,找出都是大一的信息
  var arr1 = [];
  var n = 0;
  for(var i=0;i<infos.length;i++){ 
    if( infos[i][3] == "大一" ){ 
       arr1[n] = infos[i];
       document.write(arr1[n]+"<br/>");
       n=n+1;
    } 
  }
  document.write("大一人数: "+arr1.length+"<br/>"); 
  //第二次筛选,找出都是女生的信息
  for(var i=0;i<arr1.length;i++){ 
  //这里可以用switch 
    if(arr1[i][1]=='女'){
      document.write(arr1[i][0]+"<br/>");
    }
  }
</script>

以上就是关于Javascript流程控制语句的实例解析,希望对大家的学习有所帮助。

Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
es6数组怎么去掉重复并且重新排序es6数组怎么去掉重复并且重新排序May 05, 2022 pm 07:08 PM

去掉重复并排序的方法:1、使用“Array.from(new Set(arr))”或者“[…new Set(arr)]”语句,去掉数组中的重复元素,返回去重后的新数组;2、利用sort()对去重数组进行排序,语法“去重数组.sort()”。

JavaScript的Symbol类型、隐藏属性及全局注册表详解JavaScript的Symbol类型、隐藏属性及全局注册表详解Jun 02, 2022 am 11:50 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于Symbol类型、隐藏属性及全局注册表的相关问题,包括了Symbol类型的描述、Symbol不会隐式转字符串等问题,下面一起来看一下,希望对大家有帮助。

原来利用纯CSS也能实现文字轮播与图片轮播!原来利用纯CSS也能实现文字轮播与图片轮播!Jun 10, 2022 pm 01:00 PM

怎么制作文字轮播与图片轮播?大家第一想到的是不是利用js,其实利用纯CSS也能实现文字轮播与图片轮播,下面来看看实现方法,希望对大家有所帮助!

JavaScript对象的构造函数和new操作符(实例详解)JavaScript对象的构造函数和new操作符(实例详解)May 10, 2022 pm 06:16 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于对象的构造函数和new操作符,构造函数是所有对象的成员方法中,最早被调用的那个,下面一起来看一下吧,希望对大家有帮助。

JavaScript面向对象详细解析之属性描述符JavaScript面向对象详细解析之属性描述符May 27, 2022 pm 05:29 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于面向对象的相关问题,包括了属性描述符、数据描述符、存取描述符等等内容,下面一起来看一下,希望对大家有帮助。

javascript怎么移除元素点击事件javascript怎么移除元素点击事件Apr 11, 2022 pm 04:51 PM

方法:1、利用“点击元素对象.unbind("click");”方法,该方法可以移除被选元素的事件处理程序;2、利用“点击元素对象.off("click");”方法,该方法可以移除通过on()方法添加的事件处理程序。

整理总结JavaScript常见的BOM操作整理总结JavaScript常见的BOM操作Jun 01, 2022 am 11:43 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于BOM操作的相关问题,包括了window对象的常见事件、JavaScript执行机制等等相关内容,下面一起来看一下,希望对大家有帮助。

foreach是es6里的吗foreach是es6里的吗May 05, 2022 pm 05:59 PM

foreach不是es6的方法。foreach是es3中一个遍历数组的方法,可以调用数组的每个元素,并将元素传给回调函数进行处理,语法“array.forEach(function(当前元素,索引,数组){...})”;该方法不处理空数组。

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Repo: How To Revive Teammates
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
4 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SecLists

SecLists

SecLists is the ultimate security tester's companion. It is a collection of various types of lists that are frequently used during security assessments, all in one place. SecLists helps make security testing more efficient and productive by conveniently providing all the lists a security tester might need. List types include usernames, passwords, URLs, fuzzing payloads, sensitive data patterns, web shells, and more. The tester can simply pull this repository onto a new test machine and he will have access to every type of list he needs.

MantisBT

MantisBT

Mantis is an easy-to-deploy web-based defect tracking tool designed to aid in product defect tracking. It requires PHP, MySQL and a web server. Check out our demo and hosting services.

mPDF

mPDF

mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Powerful PHP integrated development environment