Home > Web Front-end > JS Tutorial > body text

Organize Javascript flow control statement study notes_javascript skills

WBOY
Release: 2016-05-16 15:29:12
Original
1445 people have browsed it

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(条件){
   条件成立时执行代码
 }
Copy after login

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>
Copy after login

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{
   条件不成立时执行的代码
 }
Copy after login

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>
Copy after login

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不成立时执行的代码}
Copy after login

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>
Copy after login

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 不同时执行的代码
 }
Copy after login

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>
Copy after login

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(初始化变量;循环条件;循环迭代)
 { 
   循环语句 
 }
Copy after login

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>
Copy after login

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>
Copy after login

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(判断条件)
 {
   循环语句
 }
Copy after login

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> 
Copy after login

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(判断条件)
Copy after login

Try to output 5 numbers.

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

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>
Copy after login

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;}
   循环代码
 }
Copy after login

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>
Copy after login

9. Continue the loop
Statement structure:

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

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>
Copy after login

在一个大学的编程选修课班里,我们得到了一组参加该班级的学生数据,分别是姓名、性别、年龄和年级,接下来呢,我们要利用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>
Copy after login

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

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template