2021.12.13周一二阶段 day_06 js笔记_math.random()*(10000-1000)+1000-CSDN博客

本文链接：https://blog.csdn.net/WyHHZKA/article/details/121912254

一、知识点回顾

         // js作用

// 操作 html + css

// 动态渲染数据

// 数据类型：number / string / boolean / null / undefined

// 判断数据类型 typeof

// 转换

// 转字符串 String() +

// 转数字 Number() +/-/*///% Math.round() Math.floor() Math.ceil()

// parseInt() 把小数转为整数的时候 == Math.floor()

// 还可以取出字符串里面的小数（字符串里面的第一位数字开始，到第一个非数字结束）

//   parseFloat() 取小数

// 判断

//   if switch

// 循环

//         嵌套

//         while for

// break, continue

// 死循环

// 函数

//         系统函数，自定义函数

//         封装性，复用性，调用性

// 函数的封装

//         语法 function name(形参1,形参2,....){}

//           提取形参

//         是否需要返回值

//         注释！！！！！！！！！！

//           调用

// 形参(函数声明)，实参(函数调用)

// return

        var obj = document.getElementById('id');
        console.log(obj);    // null 因为是空对象

        var obj2 ;
        console.log(obj2);   // undefined  因为没有赋值
        obj.value = '666';   // 报错 空值
        obj.onclick = function(){}


        var a = Math.round('124');
        console.log(a);   // 124

        var n = Math.round('24px');
        console.log(n);   // NaN

        //  提取到第一个非数字为止的整数
        var m = parseInt('.24.5px2');
        console.log(m);   // NaN

        var m = parseInt('0.24.5px2');
        console.log(m);   // 0

        var m = parseInt('24.5px2');
        console.log(m);   // 24

        var m = parseInt(24.5);
        console.log(m);   // 24

        var m = parseFloat('24.5px');
        console.log(m);   // 24.5

     for(var i = 0 ; i < 10 ; i++){
            for(var j = 0 ; j <= i ; j++){
                document.write('*');
                if(j === 3){
                    break;
                }
            }    
            document.write('<br>')
        }
    console.log(i ,j);   // 10   3

二、关于参数的问题

        // 函数在调用的时候,必须按照要求传参

        // 实参和形参不对等   --- 不报错
        //     实参多了或者少了  函数不报错

        // 说明书 
        //   功能
        //   参数
        //   返回值
        function calc(a,b,c,d){
            switch(a){
                case '+' : return b + c ;
                case '-' : return b - c ;
            }
        }

        // 传参有问题
        var res = calc('+',1,2);
        console.log(res);

三、关于return

        //    return
        //    给函数一个返回值
        //    会提前结束整个函数

        // 判断一个数是不是质数
        // 思考：
        //    参数和返回值
        //    参数：给我一个数
        //    返回值：我告诉你是不是

        function isZhi(n){
            for(var i = 2 ; i < n ; i++){
                if (n % i == 0){
                    return false;
                }
            }
            return true ;

        }

四、判断闰年

 // 输入框判断是不是闰年

        function isRun(inpId , btnId) {  
            var oInp = document.getElementById(inpId);
            var oBtn = document.getElementById(btnId) ;
            oBtn.onclick = function () {  
                var y = oInp.value ;
                // if(y % 4 === 0 && y % 100 !== 0 || y % 400 === 0) {
                //     // alert(y + '是闰年')
                //     return true
                // } else {
                //     return false
                // }

                // if(y % 4 === 0 && y % 100 !== 0 || y % 400 === 0) {
                //     return true
                // } 
                // return false


                // 报错  return 只能返回一个值
                // (y % 4 === 0 && y % 100 !== 0 || y % 400 === 0) ? return true : return false ;

                return y % 4 === 0 && y % 100 !== 0 || y % 400 === 0 ?  true : false ;
                
            }
        }

        isRun('inp1' , 'btn1')

  function isRun(y) {  
            return y % 4 === 0 && y % 100 !== 0 || y % 400 === 0 ?  true : false ;
        }





        var oInp = document.getElementById('inp1');
        var oBtn = document.getElementById('btn1') ;
        oBtn.onclick = function () {  
            var y = oInp.value ;
            var res = isRun(y) ;
            if(res) {
                alert('不是')
            }
            else {
                alert('是')
            }
        }

    //随机生成一个四位数，并判断是不是闰年
    var n = parseInt(Math.random()*(10000-1000))+1000;
    console.log(n);
    var res = isRun(n);
    console.log(res);

五、年月日的判断

        //封装闰年函数
        function runNian(y) {
            // if(y % 4 === 0 && y % 100 !== 0 || y % 400 === 0){
            //     return true;
            // }
            // return false;

            return  y % 4 === 0 && y % 100 !== 0 || y % 400 === 0 ? true : false ;   // 三目运算符


        }


        
        // 封装日期函数
        // 判断年月日是否合法
        // 思考：参数，返回值

        // function isDate(y ,m, d){

        //     //判断年
        //     if(y >= 1000 && y <= 2000 && y % 1 === 0) {
        //         //判断月                       
        //         if( m >= 1 && m <= 12 && m % 1 === 0){
        //             // 日期
        //             var maxDay = 31 ;
        //             if(m == 4 || m == 6 || m == 9 || m == 11){
        //                 maxDay = 30;
        //             }
        //             else if( m == 2){
        //                 if(runNian(y)){
        //                     maxDay = 29;
        //                 }
        //                 else{
        //                     maxDay = 28 ;
        //                 }
        //             }
        
        //             if( d >= 1 && d <= maxDay && d % 1 === 0){
        //                 return true
        //             }
        //             return '日期必须在1-' +maxDay +'之间'               
        //         }
        //      return '月必须在1-12之间'                     
        //     }
        //     return '年必须在1000-2000之间'   
        // }



        // var res = isDate(2000,32,30);
        // document.write(res);

        // 字符串拼接
        function isDate(y , m , d) {
            var res = '';
        //     //判断年份
            if(y >= 1000 && y <= 2000 && y % 1 === 0){
                res += "年份正确"    
            }
            else {
               res += "年份错误"
            }

        //     //判断月份
            if( m >= 1 && m <= 12 && m % 1 === 0){
                res +="月份正确"
            }
            else {
               res += "月份错误"
            }


        //     //判断日期
            var maxDay = 31 ;
            if(m == 4 || m == 6 || m == 9 || m == 11){
                 maxDay = 30;
             }
            else if( m == 2){
                 if(runNian(y)){
                     maxDay = 29;
                     } else{
                     maxDay = 28 ;                     
                     }    
             }    
        
              
            if( d >= 1 && d <= maxDay && d % 1 === 0){
                res+= "日期正确"
                }
            else {
              res += "日期错误"
            }     
               return res            
        }


        // 年对 ，月不对，日期对
        var res = isDate(1999,2,30);
        document.write(res);

        // // 判断是flase 
        //条件取反

        // true/ false

            function isDate(y , m , d) {
        
            if (y < 1000 || y > 2000 || y % 1 !== 0 ){
                return false
            }  

            if (m < 1  || m > 12 ||  m % 1 !== 0){
                return false
            }

            //日期
            var maxDay = 31 ;
            if(m == 4 || m == 6 || m == 9 || m == 11){
                    maxDay = 30;
                }
            else if( m == 2){
                    if(runNian(y)){
                        maxDay = 29;
                    } else{
                        maxDay = 28 ;                     
                    }    
            }    
            if( d < 1 || d > maxDay || d % 1 !== 0){
                return "输入错误"
                }
          
            return "输入正确"

        }

        var res = isDate(1999,2,28);
        document.write(res);

六、练习

        // 随机四位数字验证码

// 编写一个函数sum(n)

        // 当传入n为偶数时，调用函数求1/2 + 1/4 + ... + 1/n

          // 当传入n为奇数时，调用函数求1 + 1/3 + ... + 1/n

// 求两个数的最大公约数

七、随机数字验证码

        //方法一 ：四个数分别求 然后字符串拼接
        // function yZm() {
        //     var a = rand(0,10);
        //     var b = rand(0,10);
        //     var c = rand(0,10);
        //     var d = rand(0,10);
        //     return '' + a + b + c + d
        // }
        // var oInp1 = get('inp1') 
        // var oBtn = get('btn');  

        // var res = yZm() ; //接收验证码

        // oInp1.value = res //把验证码放进框里     

        // // 绑定点击事件
        // oBtn.onclick = function(){

        //     var res = yZm() ; //接收验证码

        //     oInp1.value = res //把验证码放进框里

        // }

       // var res = '';
       // for(var i = 0 ; i < 4 ; i++){
       //     var n = rand(0,10);
       //     res += n ;
       // }
       // console.log(res);


        // 参数，返回值
        function randCode(x){
            x = x || 4 ;
            var res = '' ;
            for(var i = 0 ; i < x ; i++){
                var n = rand(0,10);
                res += n ;
            }
            // console.log(res);
            return res;
        }    

        //页面打开的时候，就要显示验证码
        // var result = randCode(8);
        // get('inp1').value = result;
        get('inp1').value = randCode(8);


        //绑定点击事件
        get('btn').onclick = function(){
            // var result = randCode(8);
            // get('inp1').value = result;

            get('inp1').value = randCode();//不传参 最少就是4位验证码

        }

八、短路赋值


        //  或  见真即真
        //  与  见假即假


        //  短路赋值

        var n = 1 || 2;     //  n = (1 || 2)  // n = 1
        console.log(n);

        var n = 0 || 3;     //  n = (0 || 3)  // n = 3
        console.log(n);

        var n = 1 && 2;     //  n = (1 && 2)  // n = 2
        
        var n = 0 && 3;     //  n = (0 && 3)  // n = 0


        // n = 0 || n = 3


        // m = 5;
        // if(m = 2){
        //     alert(2)
        // }
        // else if(m = 3){
        //     alert(3)
        // }

        // console.log(m);  // 2  赋值

        function sum(a,b){
            a = a || 0 ;
            b = b || 0 ;
            console.log(a,b);
            return a + b
        }

        var res = sum(1);
        console.log(res); // 1+0=1

九、求和

            // 编写一个函数sum(n)
            // 当传入n为偶数时，调用函数求1/2 + 1/4 + ... + 1/n
            // 当传入n为奇数时，调用函数求1 + 1/3 + ... + 1/n


        
        function sum(n){
            //判断奇数
            if(n % 2){
                var res = 0 ;
                for(var i = 1 ; i <= n ; i += 2){
                    res += 1 / i 
                }
                return res
            }

            //判断偶数
           else{
               var res2 = 0 ;
               for(var j = 2 ; j <= n ; j += 2){
                   res2 += 1 / j;
               }
               return res2
           }

        }
        // 分析代码如上,发现奇数或者偶数的求和就是初始值不一样

        function sum(n){
            // var k = n % 2 ? 1 : 2;
            var k = 2 ;
            if (n % 2) k = 1 

            var res = 0 ;
            for(var i = k ; i <= n ; i += 2){
                res += 1 / i ;
            }
            return res

        }


        var r = sum(4)
        console.log(r);

十、最大公约数

        // 8   12 
        // 8 % 2   12 % 2   2
        // 8 % 3   不是
        // 8 % 4   12 % 4   4

        // var max = 0 ;
        // for(var i = 1 ; i <= 8 ; i++) {
        //     if(8 % i === 0 && 12 % i === 0){
        //         max = i ;
        //     }
        // }
        // console.log(max);


        // function gcd(a , b){

        //     var max = 0 ;
        //     // 取a和b之间小的  作为i<=的最大值 
        //     // for(var i = 1 ; i < a > b ? b : a ; i++)
        //     for(var i = 1 ; i <= Math.min(a , b) ; i++){
        //         if(a % i === 0 && b % i === 0){
        //             max = i ;
        //         }
        //      }
        //      console.log(max);

        // }
        // gcd(60,24)


        //  8   12
        //  8 %  8   12 % 8   
        //  8 %  7
        //  8 %  6
        //  8 %  5 
        //  8 %  4   12 % 4   4 

        // 反过来 求
        function gcd(a,b){
            var max = 0;
            for(var i = Math.min(a , b) ; i >= 1 ; i-- ){
                if(a % i === 0 && b % i === 0 ){
                    // return i 
                    max = i;
                    break;
                }
            }  
            console.log(max);
        }
        gcd(60,24)

十一、作用域

        // 变量是有作用域
        //   全局作用域 -- 全局变量
        //      在函数外面声明的变量
        //      没有var 的变量
        //   局部作用域 -- 局部变量
        //       在函数内部声明的变量


        //  变量可以重复的声明
        //  变量可以不声明，直接赋值
        //  当函数内部的变量名和外部的变量相同时，优先使用自己

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

        var a = 5 ;  // 5

        b = 6 ;
        console.log(b);



        function fn(){
            //  变量是在函数内部声明的，只能在函数内部使用
            var c = 9 ;
            console.log(c);            
            // 没有var, 此变量默认为全局变量
            d = 10 ;
            var b = 20;
            console.log(b); // 20
        }
        

        fn()

        
        // console.log(c);  // 报错  c是局部变量 

        console.log(d); // 10

        console.log(b); // 6

十二、形参

        var a ; 
        console.log(a); // undefined  变量已经声明，但是没有赋值


        // 形参
        //   本质上就是一个局部变量
        function fn(a){
            console.log(a);  // 2
        }

        
        // fn()
        fn(2)
        console.log(a); //undefined

十三、函数嵌套函数

        // 变量的作用域
        //    优先找自己的，自己找不到就找向上一级查找，一直找到script为止，一直找不到就报错




        var a = 20 ;


        function fn3() {  
            console.log(a);
        }
       

        function fn() {  
            // 属于fn的局部变量
            var a = 10 ;

            
            // fn2也属于fn的一部分 , 找到最近的变量
            function fn2() {  
                var a = 5 ;
                // fn2可以访问到fn的变量
                console.log(a);    // 5
            }
            
            fn2()
        }


        fn()

十四、js预编译

        // js代码的执行分为两个阶段
        //   预编译阶段
        //       首先会找到所有的var声明的变量
        //       找到所有的具名函数
        //   代码执行阶段


        // 你看到的代码
        // console.log(a);  // undefined

        // var a = 10 ;

        // console.log(a);  //  10



        // 实际上js的解析
        // var a ; 
        // console.log(a);
        // a = 10 ;
        // console.log(a);


        // 你看到的
        // fn();

        // function fn(){
        //     console.log(666);
        // }


        // 实际上的js解析
        // function fn(){
        //     console.log(666);
        // }
        // fn()

十五、面试题


        // 你看到的代码
        // console.log(a);
        // var a = 10 ; 
        // a()
        // function a(){
        //         console.log(3);
        //         var b = 4 ;
        // }
        // console.log(b);
        // var b = 5 ;
        // console.log(b); 
        // console.log(a);


        //实际的代码
        // var a ; 
        // var b ;
        // function a(){
        //     //在函数内部也有预编译
        //     var b ;
        //     console.log(3);
        //     b = 4 ;
        // }
        // console.log(a);   // f
        // a = 10 ;
        // a(); // a is not a function ; 因为a此时是10 ; 下面代码也不执行,如果执行，则
        // console.log(b); //undefined
        // b = 5 ;            
        // console.log(b); // 5
        // console.log(a); // 10



    //   --------------------------------------  


        //你看到的代码 
        // function a(){
        //     console.log(3);
        // }

        // console.log(a);
        // a = 1 ;
        // console.log(a);
        // function a(){
        //     console.log(2);
        // }
        // console.log(a);
        // a = 3
        // console.log(a);
        // function a(){
        //     console.log(3);
        // }
        // console.log(a);

      
        // 1 找var
        // 2 找函数
        //实际代码
        function a(){
            console.log(3);
        }
        console.log(a);
        a = 1 ;
        console.log(a);
        console.log(a);
        a = 3
        console.log(a);
        console.log(a);
        //覆盖率 3在之后  覆盖之前所有

十六、声明函数的方法

        //  函数的声明方式
        //     具名函数 --- 有名字  存在预编译的问题
        //     赋值式函数     不存在预编译的问题

        //  变量
        //     数据类型：基本数据类型(5) + 引用数据类型()

        fn()

        fn2()   //  报错

        function fn() {
            console.log(666);
        }

        // 赋值式函数
        var fn2 = function () {
            console.log(777);
        }
        fn2()
        console.log(typeof fn2); // function



        var fn2 ; 

        function fn(){
            console.log(666);
        }
        fn() // 具名函数 --- 有名字  存在预编译的问题


        fn2() //报错了  赋值式函数     不存在预编译的问题
        fn2 = function(){
            console.log(777);
        }
        fn2()

十七、匿名函数

     // 匿名函数的自调用   -- 一次性的函数
        ~function (n) {  
            console.log(n);
        }(666)

十八、系统函数

        // alert()  //没有返回值

        //有输入框的弹窗
        var res = prompt('请输入你的名字');
        console.log(res);


        //确定弹窗
        var res = confirm('确定要删除我吗');// 返回布尔值
        console.log(res);


        console.log(1 + 2); //3

        console.log(1 + '2');// 12

        console.log('1' + '2');// 12


        // eval() 能计算的时候,就计算,不能计算时,直接报错
        // console.log(eval('1+2a'));
        
        function calc(a,b,f) {
            return (a + f + b)
        }

        var res = calc(1,2,'+');
        console.log(res);   //1+2

十九、递归函数


        // 递归：传递与回归，自己调用自己

        // function fn(){
        //     fn()
        // }
        // fn()         // 死递归


        // 1+2+3+4+...+100;
        // 方法1 循环求和
        // 1+2=3
        // 3+3=6
        // 6+4=10

        // 1+2+3+4+...+100 ;
        // 100 + (前面99个数的和)
        //       99         + (前面98个数的和)
        //                      98 +  
        // ...

        //   2 + (前面一个数的求和)

        function sum(n){

            if(n == 1){
                return 1
            }
            return n + sum(n - 1)

        }
        
        sum(5)
        //   5 + sum(4)
        //        4 + sum(3)
        //            3 + sum(2)
        //                 2 + sum(1)
        //                      1

        // 1*2*3*4*....*10
        // 10*jc(9)
        //     9*jc(8)

        function jc(n){

            if(n == 1){
                return 1
            }
            return n * jc(n - 1)
        }

二十、斐波那契数列

        // 斐波那契数列

        // 1 1 2 3 5 8 13 21 34 ....

        // 求第n个数是多少 (n - 1) + (n - 2)

        function fb(n){
            // if(n == 1){
            //     return 1
            // }
            // if(n == 2){
            //     return 1
            // }
            if(n == 1 ||n == 2){
                return 1
            }
            return fb(n-1) + fb(n-2)
        }

        console.log(fb(5));

二一、递归求和

        // 编写一个函数 sum(n)
                // 当传入n为偶数时，调用函数求1/2+ 1/4 +... + 1/n 
                // 当传入n为奇数时，调用函数求1 + 1/3 +... + 1/n


        //    不管奇数偶数，计算都是1/n+第n-2个数的和     
        //    1/n + sum(n-2)

            function sum(n){
                if(n == 1){
                    return 1
                }
                if( n == 2){
                    return 1/2
                }
                return 1/n + sum(n - 2)
            }

            console.log(sum(5));