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 相关文章推荐
javascript 浏览器检测代码精简版
Mar 04 Javascript
IE下Ajax缓存问题的快速解决方法(get方式)
Jan 09 Javascript
Summernote实现图片上传功能的简单方法
Jul 11 Javascript
js实现常用排序算法
Aug 09 Javascript
JQuery.validationEngine表单验证插件(推荐)
Dec 10 Javascript
在JS中a标签加入单击事件屏蔽href跳转页面
Dec 16 Javascript
VUE JS 使用组件实现双向绑定的示例代码
Jan 10 Javascript
脚本div实现拖放功能(两种)
Feb 13 Javascript
详解JavaScript栈内存与堆内存
Apr 04 Javascript
微信小程序实现Session功能及无法获取session问题的解决方法
May 07 Javascript
使用微信SDK自定义分享的方法
Jul 03 Javascript
express中static中间件的具体使用方法
Oct 17 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
php实现指定字符串中查找子字符串的方法
2015/03/17 PHP
Yii框架实现邮箱激活的方法【数字签名】
2016/10/18 PHP
php基于dom实现读取图书xml格式数据的方法
2017/02/03 PHP
php 输出缓冲 Output Control用法实例详解
2020/03/03 PHP
表头固定(利用jquery实现原理介绍)
2012/11/08 Javascript
理运用命名空间让js不产生冲突避免全局变量的泛滥
2014/06/15 Javascript
javascript 获取HTML DOM父、子、临近节点
2014/06/16 Javascript
javascript使用smipleChart实现简单图表
2015/01/02 Javascript
基于jQuery和CSS3制作响应式水平时间轴附源码下载
2015/12/20 Javascript
手机端转换rem适应
2017/04/01 Javascript
JS设计模式之访问者模式定义与用法分析
2018/02/05 Javascript
Vue常见面试题整理【值得收藏】
2018/09/20 Javascript
vue自定义指令实现仅支持输入数字和浮点型的示例
2019/10/30 Javascript
vue-router为激活的路由设置样式操作
2020/07/18 Javascript
解决vue prop传值default属性如何使用,为何不生效的问题
2020/09/21 Javascript
[04:19]完美世界携手游戏风云打造 卡尔工作室模型介绍篇
2013/04/24 DOTA
socket + select 完成伪并发操作的实例
2017/08/15 Python
Centos7 Python3下安装scrapy的详细步骤
2018/03/15 Python
python3+PyQt5泛型委托详解
2018/04/24 Python
基于python OpenCV实现动态人脸检测
2018/05/25 Python
python判断列表的连续数字范围并分块的方法
2018/11/16 Python
python pandas cumsum求累计次数的用法
2019/07/29 Python
python如何实现不可变字典inmutabledict
2020/01/08 Python
Python 中@property的用法详解
2020/01/15 Python
Django设置Postgresql的操作
2020/05/14 Python
Windows下PyCharm配置Anaconda环境(超详细教程)
2020/07/31 Python
html5实现的便签特效(实战分享)
2013/11/29 HTML / CSS
新西兰领先的鞋类和靴子网上商城:Merchant 1948
2017/09/08 全球购物
2013英文求职信模板范文
2013/11/15 职场文书
创业计划书中包含的9个方面
2013/12/26 职场文书
饭店工作计划书
2014/01/10 职场文书
小学生春游活动方案
2014/08/20 职场文书
酒店工程部主管岗位职责
2015/04/16 职场文书
学习十八大的感悟
2015/08/11 职场文书
GitHub上77.9K的Axios项目有哪些值得借鉴的地方详析
2021/06/15 Javascript
Python机器学习实战之k-近邻算法的实现
2021/11/27 Python