JavaScript 学习笔记之语句


Posted in Javascript onJanuary 14, 2015

一、条件分支语句:if

基本格式:

if (<表达式1>){
    <语句组1>
}else if (<表达式2>){
    <语句组2>
}else{
    <语句组3>
}

执行流程:

JavaScript 学习笔记之语句

二、循环语句

2.1前测试循环语句:在循环体内的代码被执行之前就对出口条件求值。

2.1.1while语句

基本格式:

do {
    <语句组>
} while (<表达式>)

执行流程:

JavaScript 学习笔记之语句 2.1.2 for语句

基本格式:
for (<初始表达式>;<条件表达式>;<变动量表达式>){
    <语句组>
}

执行流程:
 JavaScript 学习笔记之语句

2.2后测试循环语句:在循环体中的代码被执行之后才会测试出口条件。

2.2.1、do-while语句

基本格式:

do {
    <语句组>
} while (<表达式>) ;

执行流程:

JavaScript 学习笔记之语句

三、精准的迭代语句:for-in

基本格式:
for ( 属性 in 对象 ){
    <语句组>
}

作用:重复执行指定对象的所有属性,可以用来枚举对象的属性。

 例子:

<html>

<body>

<p>点击下面的按钮,循环遍历对象 "person" 的属性。</p>

<button onclick="myFunction()">点击这里</button>

<p id="demo"></p>

<script>

function myFunction()

{

var x;

var txt="";

var person={fname:"Bill",lname:"Gates",age:56}; 

for (x in person)

{

txt=txt + person[x];

}

document.getElementById("demo").innerHTML=txt;

}

</script>

</body>

</html>

如果要表示的对象为null或者undefined,循环体将不再执行,或者抛出错误,因此,在执行for-in循环时,应该先检测改对象的属性值是不是null或者undefined。

四、Lable语句

基本语法:

Label: <语句组>

如: begin: for (var i = 0; i < 10 ; i++ ){
                         alert(i);
                   }
举例说明lable语句的作用:
未加lable:

var num = 0;

        for (var i = 0 ; i < 10 ; i++){

             for (var j = 0 ; j < 10 ; j++){

                  if( i == 5 && j == 5 ){

                        break;

                  }

             num++;

             }

        }

        alert(num);//95

加入lable:

var num = 0;

    outPoint:

    for (var i = 0 ; i < 10 ; i++){

         for (var j = 0 ; j < 10 ; j++){

              if( i == 5 && j == 5 ){

                    break outPoint;

              }

         num++;

         }

    }

    alert(num); //55

第一个例子输出95不难理解,第二个例子为什么输出55呢,是因为执行到break outpoint时,直接跳出到putpoint层,执行alert语句。

如果把第二个例子改成下面这样:

                var num = 0;

                 for (var i = 0 ; i < 10 ; i++){

                     outPoint: 

                     for (var j = 0 ; j < 10 ; j++){

                         if( i == 5 && j == 5 ){

                             break  outPoint;

                         }

                         num++;

                     }

                 };

         alert(num);//95

这个结果和第一个例子的结果是一致的。

五、break和continue语句

5.1break语句:

       var num = 0;

        for (var i = 1 ; i < 10 ; i++){

            if(i%5==0){

                break;

            }

            num++;

        };

        alert(num);//4

break语句执行后跳到alert语句

5.2continue语句:

  var num = 0;

  for (var i = 1 ; i < 10 ; i++){

     if(i%5==0){

        continue;

     }

       num++;

   };

   alert(num);//8

continue语句执行后跳到for()循环,继续执行循环,直到循环条件不成立。

六、with语句

基本语法:

with (object) {
    statements
}
举例说明:
不使用with的写法:

var qs = location.search.substring(1);

var hostName = location.hostname;      

var url = location.href;

 alert(qs);

 alert(hostName);

 alert(url);

使用with的写法:

  with(location){

             var qs = search.substring(1);

             var hostName = hostname;      

             var url = href;

         }

         alert(qs);

         alert(hostName);

         alert(url);

从上面例子可以看出:with语句的作用是将代码的作用域设置到一个特定的对象中、减少的重复输入。

但是js的解释器需要检查with块中的变量是否属于with包含的对象,这将使with语句执行速度大大下降,并且导致js语句很难被优化。

因此并不建议大规模使用with语句。

七、swith语句

基本语法:
switch (<表达式>) {
    case <数值1>:<语句组1>
                 break;
    case <数值2>:<语句组2>
                 break;
    ...
    default <语句组>
}

执行流程:

JavaScript 学习笔记之语句

switch语句可以是任何数据类型,每个case的值也不一定是常量,也可以是变量、表达式等,例如:

  switch ("hello world") {

             case "hello" + " world": 

                 alert("Greeting was found.");

                 break;

             case "goodbye": 

                 alert("Closing was found.");

                 break;

             default: 

                 alert("Unexpected message was found.");

         }
         var num = 25;

         switch (true) {

             case num < 0: 

                 alert("Less than 0.");

                 break;

             case num >= 0 && num <= 10: 

                 alert("Between 0 and 10.");

                 break;

             case num > 10 && num <= 20: 

                 alert("Between 10 and 20.");

                 break;

             default: 

                 alert("More than 20.");

         }

switch语句在比较时使用的是全等操作符比较,因此不会发生类型转换。

练习:

 <script type="text/javascript">

         var count = 10;

         for (var i=0; i < count; i++){

             alert(i);

         }

         alert(i);   //输出什么?

     </script>

for(;;){
    alert("2");//输出多少次2?
}

以上就是本文的全部内容了,希望对小伙伴们能够有所帮助。

Javascript 相关文章推荐
通过遮罩层实现浮层DIV登录的js代码
Feb 07 Javascript
jQuery实现二级下拉菜单效果
Jan 05 Javascript
JS采用绝对定位实现回到顶部效果完整实例
Jun 20 Javascript
js手动播放图片实现图片轮播效果
Sep 17 Javascript
完全深入学习Bootstrap表单
Nov 28 Javascript
JS去掉字符串中所有的逗号
Oct 18 Javascript
vue 中滚动条始终定位在底部的方法
Sep 03 Javascript
在vue中安装使用vux的教程详解
Sep 16 Javascript
js实现类似iphone的网页滑屏解锁功能示例【附源码下载】
Jun 10 Javascript
微信小程序动态添加和删除组件的现实
Feb 28 Javascript
使用React-Router实现前端路由鉴权的示例代码
Jul 26 Javascript
Nest.js环境变量配置与序列化详解
Feb 21 Javascript
JavaScript 学习笔记之操作符(续)
Jan 14 #Javascript
JavaScript 学习笔记之操作符
Jan 14 #Javascript
Node.js的包详细介绍
Jan 14 #Javascript
JavaScript 学习笔记之数据类型
Jan 14 #Javascript
ExpressJS入门实例
Jan 14 #Javascript
jquery加载图片时以淡入方式显示的方法
Jan 14 #Javascript
JavaScript 学习笔记之变量及其作用域
Jan 14 #Javascript
You might like
zen cart新进商品的随机排序修改方法
2010/09/10 PHP
php错误、异常处理机制(补充)
2012/05/07 PHP
PHP加密解密字符串汇总
2015/04/26 PHP
执行iframe中的javascript方法
2008/10/07 Javascript
Mootools 1.2教程(2) DOM选择器
2009/09/14 Javascript
javascript 操作Word和Excel的实现代码
2009/10/26 Javascript
自己动手制作jquery插件之自动添加删除行功能介绍
2011/10/14 Javascript
js中return false(阻止)的用法
2013/08/14 Javascript
js实现的倒计时按钮实例
2015/06/24 Javascript
动态加载jQuery的两种方法实例分析
2015/07/17 Javascript
多种js图片预加载实现方式分享
2016/02/19 Javascript
SWFUpload多文件上传及文件个数限制的方法
2016/05/31 Javascript
Angular.JS实现无限级的联动菜单(使用demo)
2017/02/08 Javascript
使用原生的javascript来实现轮播图
2017/02/24 Javascript
Three.js获取鼠标点击的三维坐标示例代码
2017/03/24 Javascript
element ui 表格动态列显示空白bug 修复方法
2018/09/04 Javascript
你不知道的Vue技巧之--开发一个可以通过方法调用的组件(推荐)
2019/04/15 Javascript
如何提升vue.js中大型数据的性能
2019/06/21 Javascript
关于layui表单中按钮自动提交的解决方法
2019/09/09 Javascript
js实现带箭头的进度流程
2020/03/26 Javascript
javascript中闭包closure的深入讲解
2021/03/03 Javascript
python学习数据结构实例代码
2015/05/11 Python
python计算圆周率pi的方法
2015/07/11 Python
图文讲解选择排序算法的原理及在Python中的实现
2016/05/04 Python
Python备份目录及目录下的全部内容的实现方法
2016/06/12 Python
Python实现简易端口扫描器代码实例
2017/03/15 Python
删除DataFrame中值全为NaN或者包含有NaN的列或行方法
2018/11/06 Python
Django通过dwebsocket实现websocket的例子
2019/11/15 Python
Python使用QQ邮箱发送邮件实例与QQ邮箱设置详解
2020/02/18 Python
基于打开pycharm有带图片md文件卡死问题的解决
2020/04/24 Python
python 实现Requests发送带cookies的请求
2021/02/08 Python
英国排名第一的在线宠物用品商店:Monster Pet Supplies
2018/05/20 全球购物
研发工程师的岗位职责
2013/11/18 职场文书
高三学习决心书
2014/03/11 职场文书
2014年行政部工作总结
2014/11/19 职场文书
停电通知范文
2015/04/16 职场文书