zoukankan      html  css  js  c++  java
  • JavaScript基础视频教程总结(041-050章)

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <title>041-050章总结</title>
    </head>
    <body>
        
    <pre>
    041. 嵌套的for循环
    </pre>
    <script type="text/javascript">
        console.log("第041");
        //这个for循环执行几次,图形的高度就是多少
        for (var i=0;i<5;i++) {
            // 在循环的内部再创建一个循环,用来控制图形的宽度
            for (var j=0;j<5-i;j++) {
                document.write("* ")
            }
            document.write("<br>")
        }
    </script>
    
    <pre>
    042. 练习
    </pre>
    <script type="text/javascript">
        console.log("第042");
        /*
         * 1.打印99乘法表
         *   1*1=1
         *   1*2=2 2*2=4
         *   1*3=3 2*3=6 3*3=9
         *   1*4=4 2*4=8 3*4=12 4*4=16  
         *                      ....9*9=81
         */
        for (var i=1;i<=9;i++) {
            for (var j=1;j<=i;j++) {
                document.write( j +"*"+ i + "= " + i*j +" ,");
            }
            document.write("<br>")
        }
    </script>
    
    <pre>
    043. for循环练习
    </pre>
    <script type="text/javascript">
        console.log("第043");
        // 打印出1-100之间所有的质数
        for (var i=2;i<=100;i++) {
            //创建一个布尔值,用来保存结果,默认i是质数
            var flag=true;
            //判断i是否是质数
            //获取到2-i之间的所有的数
            for (var j=2;j<i;j++) {
                if( i%j==0 ){
                    flag =false;
                    break;
                }
            }
            //如果是质数,则打印i的值
            if(flag){
                console.log(i);
            }
        }
    </script>
    
    <pre>
    044. break和continue
    </pre>
    <script type="text/javascript">
        console.log("第044");
        /*
         * break关键字可以用来退出switch或循环语句。
         * 不能在if语句中使用break和continue,循环内的if内可以使用。
         * break关键字,会立即终止离他最近的那个循环语句。
         */
        for(var i=0 ; i<5 ; i++){
            if(i == 2){
                break;
            }
            console.log(i); //0 1
        }
        for(var i=0 ; i<5 ; i++){
            console.log("@外层循环"+i)
            for(var j=0 ; j<5; j++){
                break;
                console.log("内层循环:"+j);
            }
        }
        /*
         * 可以为循环语句创建一个label,来标识当前的循环
         * label:循环语句
         * 使用break语句时,可以在break后跟着一个label,
         *  这样break将会结束指定的循环,而不是最近的
         */
        outer1:
        for(var i=0 ; i<5 ; i++){
            console.log("@外层循环"+i);
            inner1:
            for(var j=0 ; j<5; j++){
                break outer1; // 外层循环终止了,内侧也终止。
                console.log("内层循环:"+j);
            }
        }
        /*
         * continue关键字可以用来跳过当次循环
         *  同样continue也是默认只会对离他最近的循环循环起作用
         */
        /*for(var i=0 ; i<5 ; i++){
            if(i==2){
                continue;
            }
            console.log(i);
        }*/
        outer2:
        for(var i=0 ; i<5 ; i++){
            //console.log("@--->"+i);
            for(var j=0 ; j<5 ; j++){
                if(j==3){
                    continue outer2;
                }
                //continue outer2;
                console.log("-->"+j);
            }
            console.log("@--->"+i);
        }
    </script>
    
    <pre>
    045. 质数练习的改进
    </pre>
    <script type="text/javascript">
        console.log("第045");
        //测试如下的程序的性能
        //在程序执行前,开启计时器
        //console.time("计时器的名字")可以用来开启一个计时器
        //它需要一个字符串作为参数,这个字符串将会作为计时器的标识
        console.time("test");
        for ( var i=2; i<=10000; i++ ) {
            //console.log(zhi);
            var flag = true;
            for ( var j=2; j<Math.sqrt(i); j++ ) {  // 可以通过Math.sqrt()对一个数进行开方11.4ms
                if( i%j==0 ){
                    // 如果进入判断则证明i不是质数,修改flag值为false
                    flag = false;
                    // 一旦进入判断,则证明i不可能是质数了,此时循环再执行已经没有任何意义了,使用break来结束循环
                    break;// 不加221ms,加上break为24ms
                }
            }
            if(flag){
                //console.log(i);
            }
        }
        //终止计时器
        //console.timeEnd()用来停止一个计时器,需要一个计时器的名字作为参数
        console.timeEnd("test");
    </script>
    
    <pre>
    046. 对象的简介
    如果使用基本数据类型的数据,我们所创建的变量都是独立,不能成为一个整体。
    对象属于一种复合的数据类型,在对象中可以保存多个不同数据类型的属性。
    对象的分类:
    1.内建对象
    - 由ES标准中定义的对象,在任何的ES的实现中都可以使用
    - 比如:Math String Number Boolean Function Object....
    2.宿主对象
    - 由JS的运行环境提供的对象,目前来讲主要指由浏览器提供的对象
    - 比如 BOM DOM
    3.自定义对象
        - 由开发人员自己创建的对象
    </pre>
    <script type="text/javascript">
        console.log("第046");
        //创建对象
        /*
         * 使用new关键字调用的函数,是构造函数constructor
         * 构造函数是专门用来创建对象的函数
         * 使用typeof检查一个对象时,会返回object
         */
        var obj1 = new Object();
        console.log(obj1)
        console.log(Object)
    </script>
    
    <pre>
    047. 对象的基本操作
    </pre>
    <script type="text/javascript">
        console.log("第047");
        //在对象中保存的值称为属性
        // 向对象添加属性 语法:对象.属性名 = 属性值;
        var obj2 = new Object()
        obj2.name = "孙悟空";
        obj2.gender = "";
        obj2.age = 18;
        //读取对象中的属性 语法:对象.属性名
        //如果读取对象中没有的属性,不会报错而是会返回undefined
        console.log(obj2.gender);
        console.log(obj2.hello); //undefined
        //修改对象的属性值语法:对象.属性名 = 新值
        obj2.name = "tom";
        // 删除对象的属性 语法:delete 对象.属性名
        delete obj2.name;
        console.log(obj2.name);
        console.log(obj2.age);
    </script>
    
    <pre>
    048. 属性名和属性值
    </pre>
    <script type="text/javascript">
        console.log("第048");
        var obj3 = new Object();
        /*
         * 属性名:
         *  - 对象的属性名不强制要求遵守标识符的规范,什么乱七八糟的名字都可以使用
         *  - 但是我们使用是还是尽量按照标识符的规范去做
         */
        obj3.name = "孙悟空";
        obj3.var = "var";
        console.log(obj3.var)
        /*
         * 如果要使用特殊的属性名,不能采用.的方式来操作
         *  需要使用另一种方式:语法:对象["属性名"] = 属性值
         *  读取时也需要采用这种方式
         * 使用[]这种形式去操作属性,更加的灵活,
         * 在[]中可以直接传递一个变量,这样变量值是多少就会读取那个属性
         */
        obj3["123"] = 789;
        obj3["nihao"] = "你好";
        var n = "nihao";
        console.log(obj3[n]);
        //属性值 JS对象的属性值,可以是任意的数据类型 甚至也可以是一个对象
        obj3.test = true;
        obj3.test = null;
        obj3.test = undefined;
        //创建一个对象
        var obj4 = new Object();
        obj4.name = "猪八戒";
        //将obj4设置为obj3的属性
        obj3.test = obj4;
        console.log(obj3.test.name);
        console.log(obj3);
        /*
         * in 运算符
         *  - 通过该运算符可以检查一个对象中是否含有指定的属性 如果有则返回true,没有则返回false
         *  - 语法:"属性名" in 对象
         */
        console.log(obj3.test2); // undefined
        //检查obj3中是否含有test2属性
        console.log("test2" in obj3);
        console.log("test" in obj3);
        console.log("name" in obj4);
    </script>
    
    <pre>
    049. 基本数据类型和引用数据类型
    基本数据类型
    String Number Boolean Null Undefined
    引用数据类型
    Object
    JS中的变量都是保存到栈内存中的,
    基本数据类型的值直接在栈内存中存储,
    值与值之间是独立存在,修改一个变量不会影响其他的变量
    对象是保存到堆内存中的,每创建一个新的对象,就会在堆内存中开辟出一个新的空间,
    而变量保存的是对象的内存地址(对象的引用),如果两个变量保存的是同一个对象引用,
    当一个通过一个变量修改属性时,另一个也会受到影响.
    </pre>
    <script type="text/javascript">
        console.log("第049");
        var a = 123;
        var b = a;
        a++;
        console.log("a = "+a); //124
        console.log("b = "+b); //123
        var obj5 = new Object();
        obj5.name = "孙悟空";
        var obj6 = obj5;
        //修改obj的name属性
        obj5.name = "猪八戒";
        console.log(obj5.name); // 猪八戒
        console.log(obj6.name); // 猪八戒
        //设置obj6为null
        obj6 = null;
        console.log(obj5);
        console.log(obj6);
        var c = 10;
        var d = 10;
        //console.log(c == d);
        var obj7 = new Object();
        var obj8 = new Object();
        obj7.name = "沙和尚";
        obj8.name = "沙和尚";
        console.log(obj7);
        console.log(obj8);
        /*
         * 当比较两个基本数据类型的值时,就是比较值。
         * 而比较两个引用数据类型时,它是比较的对象的内存地址,
         * 如果两个对象是一摸一样的,但是地址不同,它也会返回false
         */
        console.log(obj7 == obj8); //false
    </script>
    
    <pre>
    050. 对象字面量
    使用对象字面量,可以在创建对象时,直接指定对象中的属性
    语法:{属性名:属性值,属性名:属性值....}
    对象字面量的属性名可以加引号也可以不加,建议不加,
    如果要使用一些特殊的名字,则必须加引号
    属性名和属性值是一组一组的名值对结构,
    名和值之间使用:连接,多个名值对之间使用,隔开
    如果一个属性之后没有其他的属性了,就不要写.
    </pre>
    <script type="text/javascript">
        console.log("第050");
        // 使用对象字面量来创建一个对象
        var obj9 = {};
        obj9.name = "孙悟空";
        var obj10 = {
            name:"猪八戒",
            age:13,
            gender:"",
            test:{name:"沙僧"},
            conprint: function(){
                console.log(this.age)
                }
        };
        console.log(obj10.test);
        console.log(obj10.conprint());
    </script>
    
    </body>
    </html>

    所有基础课程链接:


     1.JavaScript基础视频教程总结(001-010章)           2.JavaScript基础视频教程总结(011-020章)          3. JavaScript基础视频教程总结(021-030章)        4. JavaScript基础视频教程总结(031-040章)

    5. JavaScript基础视频教程总结(041-050章)           6. JavaScript基础视频教程总结(051-060章)         7. JavaScript基础视频教程总结(061-070章)        8. JavaScript基础视频教程总结(071-080章)

    9. JavaScript基础视频教程总结(081-090章)          10. JavaScript基础视频教程总结(091-100章)        11. JavaScript基础视频教程总结(101-110章)      12. JavaScript基础视频教程总结(111-120章)

    13. JavaScript基础视频教程总结(121-130章)        14. JavaScript基础视频教程总结(131-140章)


     另外,欢迎关注我的新浪微博

  • 相关阅读:
    DFS 算法总结
    拆分Cocos2dx渲染部分代码
    [OpenGL]纹理贴图实现 总结
    [LeetCode] Minimum Size Subarray Sum 最短子数组之和
    LRU Cache 题解
    Substring with Concatenation of All Words 题解
    multimap和multiset 认知和使用
    OpenGL ES 3.0 基础知识
    Cocos2dx坐标转换
    视图
  • 原文地址:https://www.cnblogs.com/iflygofy/p/10112834.html
Copyright © 2011-2022 走看看