JavaScript013,for循环和for in循环

DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>JavaScript 循环title>
    head>
    <body>
        <h3>for循环 和 for/in循环(circulate:循环)h3>
        <p style="color: red;">用for循环输出99乘法表(用到了循环嵌套)p>
        <button type="button" onclick="myFor()">点我button>
        
        <p>----------------------------------p>
        
        <p style="color: red;">for/in循环遍历对象属性和数组p>
        <button type="button" onclick="myForIn()">点我button>
        br>
        对象属性:<p id="demo">p>
        数组:<p id="demo1">p>
        
        <script type="text/javascript">
            function myFor(){
                //定义三个变量用来存放乘数 被乘数 积
                var a,b,num;
                
                /* 1.首先初始化变量a,
                 * 2.a<=9满足条件,进入循环;*/
                for(a = 1; a <= 9; a++){/* 9.回来计算a++,得到a=2,判断a<=9条件满足,执行第4步(此时b的值为2)依次循环直至结束 */
                    
                    /* 3.初始化变量b;
                     * 4.b<=a(a的值由外循环带进来,初始为1),条件满足;*/
                    for(b = 1; b <= a; b++){/* 7.返回来计算b++(等同于b+1),得到b=2,然后再判断b<=a;条件不成立,跳出内循环 */
                        
                        /* 5.执行计算公式计算结果 */
                        num = b *  a;
                        
                        /* 6.输出计算结果 */
                        document.write("" + b + " * " + a + " = " +num + " | " + "");
                    }
                    /* 8.内循环跳出后到这里执行换行标签,然后执行9 */
                    document.write("
"); } } function myForIn(){ var prt = "";//存放输出结果 var prt1 = "";//存放输出结果 var dog = {/* 创建一个对象 dog 并赋予属性 */ dName:"金毛", dGender:"", dAge:2 }; var arr = [1,2,3,5,4];/* 创建一个数组 */ for(var x in dog){//用for in去遍历对象中的每一个属性并输出 prt = prt + dog[x] + " ";//遍历第一次把dName的值赋给prt, //第二次拿到dGender的值,prt此时等于"金毛",再加上"公", //第三次把dAge也拿到; 注意:此时的+号是用作字符串连接符,而不是运算符 document.getElementById("demo").innerHTML = prt;//最后输出prt; } for(var y in arr){ prt1 = prt1 + arr[y] + " ";/* 遍历数组也是一样的道理,挨个遍历一遍,然后输出 */ document.getElementById("demo1").innerHTML = prt1; } } /* 遗留问题:for in是每遍历一个属性值就重头循环一次,还是只需要进入循环一次就输出结果? */ script> body> html>

你可能感兴趣的:(JavaScript013,for循环和for in循环)