js 重装第六天

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <script>
        // 编写函数,输入两个数字(传参),计算两个数字的 和 与 积

        function fn1(n1,n2){
            var he = n1 + n2;
            var ji = n1 * n2;
            console.log(n1+'与'+n2+'相加的和为'+he);
            console.log(n1+'与'+n2+'相乘的积为'+ji);
        }

        fn1(10,20);
        fn1(3,8);




        // 编写函数,输入三个数字(传参),输出 三个数字按照从小到大的顺序
            // 输入  n1 = 45      n2 = 12      n3 = 14
            // 输出  n1 = 12      n2 = 14      n3 = 45

        function fn2(n1,n2,n3){
            if(n1>n2){
                var x = n1;
                n1 = n2;
                n2 = x;
            }

            if(n2>n3){
                var x = n2;
                n2 = n3;
                n3 = x;
            }

            if(n1>n2){
                var x = n1;
                n1 = n2;
                n2 = x;
            }

            return n1+'<'+n2+'<'+n3
        }

        console.log(fn2(11,5,3));
        console.log(fn2(2,50,33));
            

        // 编写函数,传参 计算一个数字的阶乘返回
        // 假设输入 5    1*2*3*4*5
        // 返回值为 阶乘的结果
        function fn3(n){
            var sum = 1;

            for(var i=1;i<=n;i++){
                sum*=i;
            }

            return sum;
        }

        console.log(fn3(5));
        console.log(fn3(3));




        // 某个公司采用公用电话传递数据,数据是四位的整数,在传递过程中是加密的,加密规则如下:
        //     每位数字都加上5,然后用除以10的余数代替该数字,再将第一位和第四位交换,第二位和第三位交换,
        // 请编写一个函数,传入原文,返回密文。
        // 返回值是 密文

        function fn4(num){
            var q = (parseInt(num/1000)+5)%10;
            var b = (parseInt(num/100)%10+5)%10;
            var s = (parseInt(num/10)%10+5)%10;
            var g = (num%10+5)%10;

            // 交换位置
            var x = q;
            q = g;
            g = x;
            x = b;
            b = s;
            s =x;

            // 组成新的数字
            var nn = ''+q+b+s+g;

            return nn;
        }


        console.log(fn4(1234));
        console.log(fn4(4937));




        // 求  1! + 2!+ 3! + 4! + 5! + 6! + ...... + 20! 的值
        // 编写函数,可以通过 传入参数 计算 任何值,参数为一个数字
        // 返回值为 计算的结果

        function fn5(n){
            var sum = 0;

            // 外层循环 循环几 就是 要计算几的阶乘
            for(var i=1;i<=n;i++){
                // 接收阶乘的结果
                var num = 1;
                // 实现 计算 当前 外层循环的值 的阶乘
                for(var j=1;j<=i;j++){
                    num *= j;
                }

                // 将 每个数字的阶乘 结果 相加 
                sum += num;
            }

            return sum;
        }

        console.log(fn5(3));  // 9
        console.log(fn5(20));  // 2561327494111820300


        function fn6(n){
            // 接收 所有 值继承的 相加之和
            var sum = 0;

            // 用来计算阶乘的,因为任何值的阶乘都是从1开始乘到这个数字的
            var num = 1;

            // 执行计算阶乘
            for(var i=1;i<=n;i++){
                num *= i;  // 1*1*2*3*4
                
                sum += num;
            }

            return sum;
        }

        console.log(fn6(3));  // 9
        console.log(fn6(20));  // 2561327494111820300
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <script>
        // 输入一个日期,判断这个日期是这一年的第几天  (区分平年和闰年)
        // 例如:20220211   最终计算出结果为 42
        // 使用 switch(考虑switch的穿透) 和 if 的结合成

        var yearMonthDay = prompt("请输入一个需要查看的日期,例如:20220211")
        console.log(yearMonthDay);

        var year = parseInt(yearMonthDay/10000);
        var month = parseInt(yearMonthDay/100)%100;
        var day = yearMonthDay%100;
        console.log(year);
        console.log(month);
        console.log(day);

        var sum = 0;

        switch(month){
            case 12:
                sum += 30;
            case 11:
                sum += 31;
            case 10:
                sum += 30;
            case 9:
                sum += 31;
            case 8:
                sum += 31;
            case 7:
                sum += 30;
            case 6:
                sum += 31;
            case 5:
                sum += 30;
            case 4:
                sum += 31;
            case 3:
                if(year%4===0&&year%100!=0 || year%400===0){
                    sum += 29;
                }else{
                    sum += 28;
                }
            case 2:
                sum += 31;
            case 1:
                sum += day;
                break;
        }

        alert(year+'年'+month+'月'+day+'日是'+year+'年的第'+sum+'天');


        // switch(month){
        //     case 1:
        //         sum += day;
        //         break;
        //     case 2: 
        //         sum += 31+day;
        //     case 3: 
        //         if(year%4===0&&year%100!=0 || year%400===0){
        //             sum += 31+29+day;
        //         }else{
        //             sum += 31+28+day;
        //         }
        //         break;
        //     case 4: 
        //         if(year%4===0&&year%100!=0 || year%400===0){
        //             sum += 31+29+31+day;
        //         }else{
        //             sum += 31+28+31+day;
        //         }
        //         break;
        //     ......
        // }


    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <script>
        // ƒ fn1(n){console.log(n+'fn函数被调用了');}
        // var num1;
        // var num2;
        console.log(num1);  // undefined
        console.log(fn1);  // ƒ fn1(n){console.log(n+'fn函数被调用了');}
        console.log(fn2);  // undefined
        fn1(1);
        // fn2();  // fn2 is not a function

        // JS运行的代码分为三个阶段
            // 预编译:
                // 浏览器帮我们做,所做的事情就是基本的语法检查,
                // 除了给我们报错时,看不见摸不着
            // 预解析:
                // 也是浏览器做,虽然已经能够看得见了,
                // 对我们程序中使用var和function定义的变量和函数进行预解析工作。
            // 执行代码:
                // 从上往下执行,逐行
                    // - 当执行函数时才会进入函数内部
                    // - 再次逐行执行代码
        // 导致变量num值为undefined的原因就是第二步预解析问题。
        // JS语言中所有的变量名和函数名都会被执行提升操作。


        // js对变量的提升
            // 在 预解析阶段,浏览器会把 所有用 var声明的变量 全部 提升到 当前作用域下的最顶端
            // 提升的过程 只会针对 变量的 声明部分 进行提升,对变量的 赋值部分是不会进行提升操作的
            // 因为 声明一个变量不复制结果就是undefined,所以在变量赋值之前 访问这个变量结果是undefined
        console.log(num1);  // undefined
        var num1 = 10;
        console.log(num1);  // 10


        // console.log(num2);  // Error: num2 is not defined
        // 对变量的提升 是针对 用var声明的变量 才会提升,如果声明变量没有var是不会进行提升操作的,会报错
        num2 = 20;
        console.log(num2);  // 20;



        // js对函数的提升
            // js提升函数和变量不一样,提升函数是针对整个函数全部提升到当前作用域的最顶部
            // 所以相当于 函数是写在 最上面的,我们就可以在 任意位置调用函数
            // 赋值函数 是按照 变量的提升规则来执行的,所以在 将函数赋值给 变量之前 变量都是undefined
            // 所以无法在 赋值式函数 赋值给这个变量之前 调用函数,因为它是undefined

        // 声明式函数 是将整个函数进行提升到 当前作用域下的最顶部
        function fn1(n){
            console.log(n+'fn函数被调用了');
        }
        fn1(2);

         // 赋值式函数 是按照变量的规则提升的,在这之前这个变量的结果是 undefined
        var fn2 = function(){
            console.log('fn2函数被调用');
        }
        fn2();
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <script>
        console.log(abc);  // ƒ abc(){console.log(1234);}

        abc();

        // 变量 和 函数 都会 执行 提升操作
        // 但是如果 变量名 和 函数名 重名
        // 在 提升阶段 函数优先:
            // 如果变量名和函数名重名,在 变量和函数定义之前,访问这个名字得到的结果都是 函数
        // 在 执行阶段 变量优先:
            // 一旦 代码执行到 给 这个名字的变量赋值 这一句后,
            // 这个名字 就是 变量了,不会再是 函数

        // 注:如果 变量名 和 函数名 重名,如何区分 这个名字 是变量 还是函数
            // 在 给这个变量赋值之前 这个名字都是 函数
            // 在 给这个变量赋值之后 这个名字都是 变量


        console.log(abc);  // ƒ abc(){console.log('1234');}
        abc();

        var abc = 100;

        console.log(abc);  // 100
        // abc();  // Error: abc is not a function

        function abc(){
            console.log('abc函数被调用了');
        }

        console.log(abc);  // 100
        // abc();  // Error: abc is not a function

        function abc(){
            console.log(1234);
        }

        console.log(abc);  // 100

        // 这里的 abc 是 变量名 不是函数名
        var abc = function(){
            console.log('6699');
        }

        console.log(abc);  // function(){console.log('6699');}
        abc();
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <script>
        // 变量的作用域 就是 指变量能够起作用的范围。
            // 变量的作用域决定了变量将来可以被访问的区域,
            // 而变量被限制的区域也决定了该变量是 全局变量 还是 局部变量。


        // 全局变量 --- 全局作用域
            // 在 函数外部 声明的变量 就是 全局变量
            // 全局变量 可以在 页面的 任意位置 访问使用 --- 全局变量的作用域是全局
        console.log(num1);  // undefined
        var num1 = 11;
        console.log(num1);  // 11

        var n1 = 100;
        console.log(n1);  // 100



        // 局部变量 --- 局部作用域
            // 在 函数内部 声明的变量 就是 局部变量
            // 局部变量 只能在 当前函数内部访问时使用,如果在函数外部访问使用就会报错 --- 局部变量的作用域是局部(函数内部)
            // 函数的 形参 其实也是一个 局部变量
            // 局部变量 在函数内部 也会 进行 变量的提升操作 --- 会将 函数内部的局部变量 提升到 函数的最顶部

        function fn1(abc){
            // var num2;

            console.log(abc);  // 33

            console.log(num1);  // 11

            console.log(num2);  // undefined
            var num2 = 22;
            console.log(num2);  // 22

            console.log(n1);  // 100
            n1 = 150;
            console.log(n1);  // 150
        }
        fn1(33);

        // console.log(abc);  // Error: abc is not defined

        // console.log(num2);  // Error: num2 is not defined

        console.log(n1);  // 150


        function fn2(){
            console.log(n1);  // 150
            console.log(num1);  // 11
            // console.log(num2);  // Error: num2 is not defined
        }
        fn2();

        console.log(num1);

        var x = 222;

        function fn3(a,b){  // var a=66; var b;
            console.log(a);  // 66
            console.log(b);  // undefined
            console.log(c);  // undefined

            var a = 88;
            console.log(a);  // 88

            console.log(b);  // undefined
            var b = 77;
            console.log(b);  // 77

            var c = 99;
            console.log(c);  // 99

            console.log(x);  // 222
        }
        fn3(66)

        // console.log(a);  // Error: a is not defined
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <script>

        // 当 全局变量 和 局部变量 重名时 
            // 在 函数外 使用的是 全局变量
            // 在 函数内 使用的是 局部变量
                // 在函数内部 如果 存在 和 全局变量 重名的 局部变量,函数内部优先使用 局部变量
                // 如果 函数内部 不存在 重名的 局部变量,在函数内部 才会使用 这个名字的 全局变量

        console.log(n1);  // undefined
        var n1 = 22;
        console.log(n1);  // 22

        console.log(n2);  // undefined
        var n2 = 4;
        console.log(n2);  // 4

        console.log(n3);  // undefined
        var n3 = 78;
        console.log(n3);  // 78

        function fn1(n1){
            console.log(n1);  // 33

            console.log(n2);  // undefined
            var n2 = 9;
            console.log(n2);  // 9

            console.log(n3);  // 78
        }

        fn1(33);


        console.log(n1);  // 22
        console.log(n2);  // 4
        console.log(n3);  // 78


        var a = 12;
        var b = 13;
        var c = 14

        // console.log(d);  // Error: d is not defined

        function fn2(a,b){
            console.log(a);  // 3
            var a = 9;
            console.log(a);  // 9

            console.log(b);  // undefined

            console.log(c);  // 14
            c = 22;

            // console.log(d);  // Error: d is not defined
            d = 100;
            console.log(d);  // 100
        }
        fn2(3);

        console.log(a);  // 12
        console.log(b);  // 13
        console.log(c);  // 22
        console.log(d);  // 100

        // 注意:在 函数中 如果 使用一个变量 没有 加var关键字
            // 如果 函数中 有这个名字的 局部变量 就是 对这个 局部变量的修改
            // 如果 函数中 没有有这个名字的 局部变量 就是 对全局的这个名字的变量的修改

            // 如果 函数中没有这个名字的局部变量,全局中也没有这个名字的 全局变量
                // 这个 名字的变量 相当于 是一个全局变量
                // 会在 全局中 添加一个这个名字的变量
                // 但是这个变量 只能在 添加后访问使用,在添加之前访问都是报错

                // 如果声明变量没有加var,则声明的变量是一个全局变量
                // 全局有这个名称的变量就修改,如果没有就是创建
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    


    <script>
        var num1 = 11;
        console.log(num1);  // 11

        var n1 = 33;

        function fn111(num1){
            console.log(num1);  // 12

            var num2 = 90;
            console.log(num2);  // 90

            function fn222(){
                console.log(num2);  // 90
                console.log(num1);  // 12
                console.log(n1);  // 33
                var num4 = 88;

                function fn333(){
                    
                    console.log(num4);  // undefined
                    var num4 = 678;
                    console.log(num4);  // 678

                    console.log(num1);  // 12
                    num1 = 77;
                    console.log(num1);  // 77

                    // console.log(num5);  // Error:num5 is not defined
                    num5 = 55;
                    console.log(num5);  // 55

                }
                fn333();
            }
            fn222();
        }
        fn111(12);

        console.log(num1);  // 11
        console.log(num5);  // 55


        // 在作用域链情况下:
            // > 当变量没加var时,会去在上一个作用域中找【同名&带var】
            // > 找到了 - 直接修改
            // > 找不到 - 在作用域链上找
            // > 一直找到顶级作用域
            // > 找到了 - 直接修改
            // > 找不到 - 自己创建修改
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
         .box{
            background-color: pink;
         }
        .box div{
            width: 100px;
            height: 40px;
            margin-top: 10px;
            line-height: 40px;
            color:aqua;
            text-align: center;
            border-radius: 20px;
            background-color: blueviolet;
            font-size: 20px;
            cursor: pointer;
            font-weight: 600;
        }
    </style>
  </head>
  <body>
    <!-- <div class="box">
          <div>1</div>
          <div>2</div>
          <div>3</div>
          <div>4</div>
    </div> -->
    <script>
        // 数组是应用数据类型
        // 复杂数据类型
        // 对象数据类型
    //    let cls = document.querySelector(".box");
    //    cls.addEventListener("click",function(e){
    //     if(e.target.tagName.toLowerCase() === "div"){
    //         console.log(e.target.innerHTML)
    //     }
          
    //    })

    //   var name="韩信";
    //   var user= {
    //     name:"诸葛",
    //     game:function(){
    //         var _this = this;
    //         setTimeout(function(){
    //             console.log(_this.name)
    //         })
    //     }
    //   }

    //   user.game()//this 永远指向调用者
      //在定时器里得this是指向全局环境得



      let timer = setTimeout(function(){
            console.log("卧底");
      },3000)

      clearTimeout(timer)
    </script>
  </body>
</html>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <!--
         数组是引用类型得数据类型
        数组是有序得数据集合
         数组得编号是数组得索引

      -->
    <script>
      var fibo_arr = [false,"hellow",true,1,999];
      //可以获取和设置数组得长度
    //   fibo_arr.length = 20;
     

      //数组得索引可以实现对数组得访问
      //对数组可以实现增删改查
      //数组
      let n = fibo_arr[4]
      console.log(n);
     
      //给数组增加长度
      //数组最的长度和数组的索引的关系??
      //  arr[max] = arr.length - 1;
      fibo_arr[fibo_arr.length] = 233;
      //数组的索引是从0 开始    所以在第六位会出现一个233
      console.log(fibo_arr)
    

      //改变  给数组存在数值索引就是给数组改变
      fibo_arr[0] = true;
      console.log(fibo_arr)


      /*数组的遍历就是对数组的访问
           遍历 :我们延着某条线索和路径 依次对集合都做一次访问

      */

    //   for(var i=0;i<fibo_arr.length;i++){
    //       console.log(fibo_arr[i])
    //   }
       //特地准被了 for(var i in  arr){} 
    //    var arr = ["韩信","公孙离",23,false,true,3344];
    //    for(var i in arr){
    //       console.log(arr[i])
    //    }

       //数组可以存任意类型的数据
       //数组的成员也可以是数组
       //数组的成员是数组形成二维数组

    //    var arr1 =[1,2,3,["我是数组","数组中包含数组"]];
       //如果数组一直嵌套就形成了多维数组
       var arr2 = [[1,2,3,["韩信",["李元芳"]]],[1,2,3],[1,2,3]];
       console.log(arr2[0][3][0]);

       //怎么实现二维数组的遍历呢?
       //循环嵌套就完事了?
       var arr3 = [[1,2,3],[1,2,3],[1,2,3]];
       for(var t=0;t<arr3.length;t++){
          for(var j=0;j<arr3[t].length;j++){
            console.log(arr3[t][j])
          }
       }
        
       console.log("华丽的分割线-------------------------")
       //如何检测一个是否为数组 Array.isArray("")
       var arr4 = [[1,3,4],[4,5,6],7,8,9,[5,5,5]];
       for(var k=0;k<arr4.length;k++){
        // console.log(arr4[k])
            if(Array.isArray(arr4[k])){
                   for(var l=0;l<arr4[k].length;l++){
                    console.log(arr4[k][l]);
                   }
            }else{
                console.log(arr4[k])
                
            }
       }
        
       console.log("华丽的分割线-------------------------")

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

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      //数组的方法
      //有关添加和删除的方法
      //push()给数组最后添加一个或多个成员

      var arr = [
        "涛哥真刷",
        "韩信s",
        9999,
        false,
        true,
        function num() {
          console.log("天肉");
        },
      ];
      var arr1 = ["韩信"];
      let opp = arr.push(arr1);
      arr.push(arr1);
      console.log(arr);
      //pop()删除数组的最后一个数据
      // arr.pop();
      //此方法的返回值是被删除的数据
      var arr2 = [1, 2, 3, 4, 5, 6];
      let res = arr2.pop();
      console.log(arr2); //
      console.log(res); //6

      console.log(
        "------------------------------------------优雅从不过时----------------------"
      );
      //unshift()
      //在数组的前面添加一个数据
      //返回值位数组的长度
      var arr3 = ["aa", "bb", 12, 34, false, true];
      let tt = arr3.unshift("kk");
      console.log(tt); //7
      console.log(arr3);

      console.log(
        "------------------------------------------优雅从不过时----------------------"
      );

      //shift()
      //此方式删除数组第一个值
      //删除之后会返回删除的值
      var arr4 = [4, 2, 3, 4];
      let resout = arr4.shift();
      console.log(resout); //4
      console.log(arr4); //2,3,4

      console.log(
        "------------------------------------------优雅从不过时----------------------"
      );
      //数组排序的方法
      //sort();
      //设置数组的排序问题
      //按照数字的第一个字符大小去排序的
      //字符串的排序规则
      //自定义比较规则 从小到大排序

      var arr5 = [3, 4, 5, 6, 4, 523, 52, 54, 25, 24, 5];
      let res0 = arr5.sort();
      console.log(arr5);
      console.log(res0);
      //自定义从大到小排序

      console.log(
        "------------------------------------------优雅从不过时----------------------"
      );
      //数组反转排列
      // reverse反转
      var arr6 = [1,2,3,4,5,6];
      let reverseone = arr6.reverse();
      console.log(reverseone);
      console.log(arr6);
    </script>
  </body>
</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值