JavaScript程序流程控制·

1.条件控制语句

（1）if语句

if(表达式1){
    语句1;
}else if(表达式2){
     语句2;   
}else{
    语句n;
}

例1

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>提示上下午</title>
    </head>
    <body>
        <script>
            var date=new Date();
            var Hours=date.getHours();
            console.log(Hours);
            if(6<Hours && Hours<8){
                alert("早上好");
            }else if(8<Hours && Hours<=12){
                alert("中午好");
            }else if(12<Hours && Hours<20){
                alert("下午好")
            }else{
                alert("晚上好");
            }
        </script>
    </body>
</html>

（2）switch语句

switch(表达式){
    case 常量表达式1：
        执行代码块1;
        break;         //跳出
    case 常量表达式2：
        执行代码块2;
        break;
    case 常量表达式3：
        执行代码块3;
        break;
    default:
        执行代码块 n+1;
}

例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>计算当前周几</title>
    </head>
    <body>
        <script>
            var date=new Date();
            var week=date.getDay();
            console.log(week);
            switch(week){
                case 0:
                    document.write("周日");
                    break; 
                case 1:
                    document.write("周一");
                    break; 
                case 2:
                    document.write("周二");
                    break; 
                case 3:
                    document.write("周三");
                    break; 
                case 4:
                    document.write("周四");
                    break;
                case 5:
                    document.write("周五");
                    break; 
                case 6:
                    document.write("周六");
                    break; 

            }

            
        </script>
    </body>
</html>

2.循环语句

（1）for循环

for(变量=初始值;变量<=结束值;变量=变量加步长){
    循环语句;
}

例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>动态创建表格</title>
    </head>
    <body>
        <form>
            <caption>动态创建表格</caption>
            请输入行数：<input type="text" id="row" placeholder="请输入行数："><br>
            请输入列数：<input type="text" id="col" placeholder="请输入列数"><br>
            <input type="button" onclick="createTable()" value="创建表格">
        </form>
        <div id="d1"></div>
    <script>
        function createTable(){
            var row=document.getElementById("row").value;
            var col =document.getElementById("col").value;
            var d1=document.getElementById("d1");
            var str="<table border='1' collspan='0' cellspacing='0' cellpaddding='0'>"
        for(var  i=0;i<row;i++){
            str +="<tr>";
            for(var j=0;j<col;j++){
                str +="<td>"+(j+1)+" </td>"; 
            }
            str +="</tr>";
        }
        d1.innerHTML=str+"</table>"
        }
    </script>
    </body>
</html>

（2）while循环

while(条件){
    循环体语句；
}

（3）do·····while循环

// 先循环后判断
do{

}while(条件)

（4）for ·· in

for(变量 in 对象){

}

例数组的遍历

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>JavaScript数组的遍历</title>
    </head>
    <body>
    <script type="text/javascript">
        var x;
        var mycars=new Array();
        mycars["Saab"]=10;
        mycars["Volvo"]=30;
        mycars["BMW"]=20;
        for( x in mycars ){
            document.write(x+"的价格为： " +mycars[x]+"万元<br>");
        }
    </script>
    </body>
</html>

（5）break与continue

break：跳出循环
continue：终止本次循环

例判断数组中的数小于7的数

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>JavaScript数组的遍历</title>
    </head>
    <body>
    <script type="text/javascript">
        var arrnum=new Array(2,45,23,21,6,4,9,10);
        var iLlenght=arrnum.length;
        var ipos=0;
        var x=0;
        document.write("数组元素有：");
        for( x in arrnum){
            document.write(arrnum[x]+" ");
        }
        document.write("<br >小于10的数有：");
        for( x in arrnum){
            if(arrnum[x]<10){
                document.write(arrnum[x]+" ");
            }
            continue;
        }
        
    </script>
    </body>
</html>

2.异常处理语句

（1）try····catch····finally语句

try{
      可能会出现异常机制

}catch(exception){
    出现异常要执行的语句
    
}
finally{
    最后要执行的语句
}

例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>JavaScript数组的遍历</title>
    </head>
    <body>
    <script type="text/javascript">
        var num1=12,num2;
        try{
            num2=num1.toString(90); //进制转换 范围在2~36之间
        }catch(oe){
            document.write("错误类型："+oe.name+"<br>");
            document.write("错误代码："+oe.number+"<br>");
            document.write("错误信息："+oe.message+"<br>");
        }finally{
            document.write("num2="+num2);
        }
    </script>
    </body>
</html>

（2）throw语句

throw exception

在JavaScript中使用Error对象保存有关错误的信息

var newErrorObj =new Error();

var newErrorObj =new Error(number);

var newErrorObj =new Error(number,description);

例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>JavaScript throw的使用</title>
    </head>
    <body>
    <script type="text/javascript">
        var num1=100,num2=0,num3;
        try{
            if(num2==0){
                throw new Error(1234,"除数为零");
            }
            num3=num1/num2;
        }catch(oException ){
            document.writeln("错误代码："+oException +"<br>");
        }finally{
            document.write("num3="+num3);
        }
    </script>
    </body>
</html>

JavaScript程序流程控制·

猜你喜欢