整理Javascript流程控制语句学习笔记


Posted in Javascript onNovember 29, 2015

1、做判断(if语句)
if语句是基于条件成立才执行相应代码时使用的语句。
语法:

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

例子:假设你应聘web前端技术开发岗位,如果你会HTML技术,你面试成功,欢迎加入公司。

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

2、二选一(if...else语句)

if...else语句是在指定的条件成立时执行代码,在条件不成立时执行else后的代码。
语法:

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

例子:假设你应聘web前端技术开发岗位,如果你会HTML技术,你面试成功,欢迎加入公司,否则你面试不成功,不能加入公司。
 

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

 3、多重判断(if...else嵌套语句)
要在多组语句中选择一组来执行,使用if..else嵌套语句。
语法:

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

例:联合国世界卫生组织对年龄的划分标准, 44岁以下为青年;45岁至59·岁为中年人。60岁至89岁为老年人;90岁以上为长寿老年人。赵红今年99岁了,她属于哪个年龄阶段的。
 

<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、多种选择(Switch语句)
当有很多种选项的时候,switch比if else使用更方便。

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

语法说明:
Switch必须赋初始值,值与每个case值匹配。满足执行该 case 后的所有语句,并用break语句来阻止运行下一个case。如所有case值都不匹配,执行default后的语句。
例子:我们来做个周计划,周一、二学习理念知识,周三、四到企业实践,周五总结经验,周六、日休息和娱乐。

<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、重复重复(for循环)
很多事情不只是做一次,要重复做。如打印10份试卷,每次打印一份,重复这个动作,直到打印完成。这些事情,我们使用循环语句来完成,循环语句,就是重复执行一段代码。
for语句结构:

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

例子:假如,一个盒子里有6个球,我们每次取一个,重复从盒中取出球,直到球取完为止。

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

我们有1,2,3...10不同面值的钱,使用for语句完成合计,看看我们一共有多少钱?

<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、反反复复(while循环)
和for循环有相同功能的还有while循环, while循环重复执行一段代码,直到某个条件不再满足。
while语句结构:

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

使用while循环,完成从盒子里取球的动作,每次取一个,共6个球。

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

7、来来回回(Do...while循环)
do while结构的基本原理和while结构是基本相同的,但是它保证循环体至少被执行一次。因为它是先执行代码,后判断条件,如果条件为真,继续循环。
do...while语句结构:

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

试着输出5个数字。

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

使用do...while语句,输出6个数字。

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

 8、退出循环break
在while、for、do...while、while循环中使用break语句退出当前循环,直接执行后面的代码。
格式如下:

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

考试成绩输出,如果成绩及格继续输出下个成绩,如果成绩不及格,退出并且后面成绩不输出.

<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
语句结构:

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

上面的循环中,当特殊情况发生的时候,本次循环将被跳过,而后续的循环则不会受到影响。
例子:考试成绩输出,如果成绩及格继续输出下个成绩,如果成绩不及格,则不输出该成绩。

<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流程控制语句的实例解析,希望对大家的学习有所帮助。

Javascript 相关文章推荐
DOM基础教程之事件类型
Jan 20 Javascript
实现无刷新联动例子汇总
May 20 Javascript
jQuery Mobile框架中的表单组件基础使用教程
May 17 Javascript
老生常谈原生JS执行环境与作用域
Nov 22 Javascript
JavaScript基于activexobject连接远程数据库SQL Server 2014的方法
Jul 12 Javascript
Vue组件通信之Bus的具体使用
Dec 28 Javascript
基于express中路由规则及获取请求参数的方法
Mar 12 Javascript
Node.js 使用AngularJS的方法示例
May 11 Javascript
puppeteer库入门初探
Jan 09 Javascript
微信小程序实现拍照画布指定区域生成图片
Jul 18 Javascript
jQuery zTree如何改变指定节点文本样式
Oct 16 jQuery
element中Steps步骤条和Tabs标签页关联的解决
Dec 08 Javascript
基于javascript代码实现通过点击图片显示原图片
Nov 29 #Javascript
整理Javascript数组学习笔记
Nov 29 #Javascript
Bootstrap每天必学之缩略图与警示窗
Nov 29 #Javascript
分享我的jquery实现下拉菜单心的
Nov 29 #Javascript
jQuery随手笔记之常用的jQuery操作DOM事件
Nov 29 #Javascript
整理Javascript基础语法学习笔记
Nov 29 #Javascript
Jquery操作Ajax方法小结
Nov 29 #Javascript
You might like
用PHP调用数据库的存贮过程!
2006/10/09 PHP
国外十大最流行的PHP框架排名
2013/07/04 PHP
php过滤XSS攻击的函数
2013/11/12 PHP
PHP变量内存分配问题记录整理
2013/11/27 PHP
php获取网卡的MAC地址支持WIN/LINUX系统
2014/04/30 PHP
PH P5.2至5.5、5.6的新增功能详解
2014/07/14 PHP
PHP 二维array转换json的实例讲解
2018/08/21 PHP
javascript编程起步(第二课)
2007/02/27 Javascript
Jquery 动态循环输出表格具体方法
2013/11/23 Javascript
jQuery之选项卡的简单实现
2014/02/28 Javascript
多个$(document).ready()的执行顺序实例分析
2014/07/26 Javascript
node.js中的path.isAbsolute方法使用说明
2014/12/08 Javascript
javascript中局部变量和全局变量的区别详解
2015/02/27 Javascript
easyui Droppable组件实现放置特效
2015/08/19 Javascript
angular内置provider之$compileProvider详解
2017/09/27 Javascript
vue中使用vue-router切换页面时滚动条自动滚动到顶部的方法
2017/11/28 Javascript
vue组件开发之用户无限添加自定义填写表单的方法
2018/08/28 Javascript
微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现
2020/08/19 Javascript
python实现字符串和日期相互转换的方法
2015/05/13 Python
在arcgis使用python脚本进行字段计算时是如何解决中文问题的
2015/10/18 Python
python使用psutil模块获取系统状态
2016/08/27 Python
Python实现一个Git日志统计分析的小工具
2017/12/14 Python
python将每个单词按空格分开并保存到文件中
2018/03/19 Python
Python面向对象程序设计OOP深入分析【构造函数,组合类,工具类等】
2019/01/05 Python
Jupyter 无法下载文件夹如何实现曲线救国
2020/04/22 Python
Django mysqlclient安装和使用详解
2020/09/17 Python
HTML5新标签兼容——&gt; 的两种方法
2018/09/12 HTML / CSS
贝玲妃英国官网:Benefit英国
2018/02/03 全球购物
写一个函数,求一个字符串的长度。在main函数中输入字符串,并输出其长度
2015/11/18 面试题
化学相关工作求职信
2013/10/02 职场文书
财务会计专业个人求职信范本
2014/01/08 职场文书
医务工作者先进事迹材料
2014/01/26 职场文书
树转促学习心得体会
2014/09/10 职场文书
办公室主任岗位职责范本
2015/03/31 职场文书
小学大队长竞选稿
2015/11/20 职场文书
Java Spring 控制反转(IOC)容器详解
2021/10/05 Java/Android