javascript_day02

1.特殊的值

        null

        undefined

        NaN   --------> not a number 非数字的集和!

        NaN不会和任何相等 ,包括自己

        isNaN()

                isNaN() 是用于判断NaN

                !isNaN()用于判断数字

console.log(null === null);
console.log(undefined === undefined);

//两个等号判断的是值相等
console.log(null === undefined); //规定
//true转数字
console.log(2 == true);  //flase
console.log(NaN === NaN); //false

var x = 3;
console.log(typeof x);    //number
//
// isNaN()用于判断是NaN
console.log(isNaN(x));
//!isNaN()用于判断是数字
console.log(!isNaN(x));
//
//字符串和字符串比较的时候,比较ASCLL值,是一位一位的比
console.log('a'>'A');
//字符串的比较,是一位一位的比较
console.log('212'>'2');	//false
//字符串和数字比较的值	转数字进行比较
console.log('12' > 2);

2.Math对象

        Math.random() 产生的是0-1之间的随机数,包含0,不包含1

        Math.ceil() 取值向上取值

        Math.floor() 向下取值

        Math.round() 四舍五入取整

    var x = Math.random();
    console.log(x);
    
    //0-100之间的随机数
    // x = x *100 
    x *= 100;
    console.log(x);
    
    //取整数
    //向上	ceil
    // x = Math.ceil(x);
    // console.log(x);
    
    //向下 地板 floor
    // x = Math.floor(x);
    // console.log(x);
    
    //四舍五入取整
    
    x = Math.round(x);
    console.log(x);

10-20之间的随机整数????

    //0-1之间的随机数	最小值0  x
    //最小值需要变成10 	x+10	y
    
    var y = Math.random() ;	// 0-1
    // 0-10
    y = y * 10 ;
    y = y + 10 ;
    //y = Math.round(y); 可能值取到最大值20
    //y = Math.ceil(y) ; 可能值取到最大值20,取到大值得概率相对大一些
    // y = Math.floor(y) ;  取不到最大值,取到小值得概率大一些。
    
    
    console.log(y);

3.计算机的精度丢失

        精度丢失不止是js的问题,而是计算机的问题

        1.四舍五入 取整,取小数点 (0.1*10+0.2*10)/10

        2.小数化为整。

    	console.log(0.1+0.2);  // 0.30000000000000004
        console.log(0.2+0.2);
        console.log(9999999999999999 == 10000000000000000);  // true

4.随机取三位数

        其中需要使用到Math.random()----->获得0-1之间的随机数,在此基础之上变化得的需要的随机数。

    	var x = Math.random() ;
        // 100-1000之间,娶不到1000
        x *= 900 ;
        x += 100 ;
        x = Math.floor(x) ;
        console.log(x);
        var bai = x / 100 ;
        bai = Math.floor(bai)
        console.log(bai);
        // 取百位的余数
        var shi = x % 100 / 10 ;
        shi = Math.floor(shi) ;
        console.log(shi);
        var ge = x % 10 ;

5.随机数小结

        产生0-1之间的随机数   x

        产生0-任何值max之间的随机数   x * max

        产生min-max之间的随机数  x * (max - min) + min

        //随机一个五位数,去取它的各个位数。
        //10000-100000
        var i = Math.random();
        i = i *90000 + 10000;
        i = Math.round(i);
        console.log(i);
        //12345
        var m1 = Math.floor(i/10000);
        console.log(m1);
        //2345
        var m2 = Math.floor(i % 10000 /1000);
        console.log(m2);
        //345
        var m3 = Math.floor(i % 1000 / 100);
        console.log(m3);
        //45
        var m4 = Math.floor(i %100 / 10);
        console.log(m4);
        //5
        var m5 = Math.floor(i % 10);
        console.log(m5);


        //根据所给的秒数来计算它的时、分、秒
        //3682s  时间60进制计算
        var t = 3682 ;
        //秒
        console.log(t); 
        //剩余秒
        var t1 = Math.floor(t % 60 )  ;
        console.log(t1); 
        //分钟
        var t2 = Math.floor( t % 3600 /60 ) ;
        console.log(t2); 
        //小时
        var t3 = Math.floor( t / 3600 );
        console.log(t3); 

6.随机数简化

        // 产生min-max之间的随机数  x * (max - min) + min
        // var x = Math.random() ;
        // var y = x * (max - min) + min ;
        // y = Math.round(y)
        
        // var a = Math.round(Math.random() * (max - min) + min)


        
        var a = Math.round(Math.random() * (20 - 10) + 10) ;
        console.log(a);
        
        // a = (Math.random() * (max - min) + min)

7.最大值和最小值

    var min = Math.min(3 , 2 , 32 , 1 , 0);
    console.log(min);
    
    var max = Math.max(3 , 2 , 32 , 1 , 0);
    console.log(max);

8.操作标签对象

        认识对象: 属性 + 方法(函数)

        对象.姓名

        对象.性别

        对象.爱好

        对象.敲代码(‘hello world’)

        带括号的叫函数

                console.log()

                console.random()

                console.floor()

    // 首先找到这个对象	input
    
    //	在文档中 找到id为inp的元素
    var oInp = document.getElementById('inp') ;
    console.log(oInp);
    
    oInp.value = '666' ;
    oInp.style.color = 'red' ;
    
    var oP = document.getElementById('p') ;
    oP.style.color = 'green' ;

9.求和


    
    <input type="number" id="inp1">
    <span>+</span>
    <input type="text" id="inp2">
    <button id="btn">=</button>
    <input type="text" name="" id="result">
    
    <script>
        // 拿到相关的对象
        var oInp1 = document.getElementById('inp1')
        var oInp2 = document.getElementById('inp2')
        var oBtn = document.getElementById('btn')
        var oResult = document.getElementById('result') ;   
        console.log(oInp1 , oInp2 , oBtn , oResult);
        
        // 注意:如果出现null 表示对象没有拿到手 -- id写错了
        // var n1 = oInp1.value ;
        // console.log(n1);   // 拿不到数据   因为js在页面打开的时候,就执行完毕了
        // 当点击按钮的时候,用户就已经输入了两个数字
        // 绑定点击事件
        oBtn.onclick = function () {  
            // alert(666)
            // 拿到第一个输入框的值
            var n1 = oInp1.value ;
            console.log(n1); 
            // 拿第二个输入框的值
            var n2 = oInp2.value ;
            console.log(n2);
            // 发现页面上的数据都是字符串
            var sum = n1 * 1 + Number(n2) ;
            console.log(sum);
            // 计算的结果赋值给输入框
            oResult.value = sum;
        }
    </script>

10.判断语句

 程序的三大流程控制语句

           顺序结构  从上而下执行代码

            选择结构  判断

            循环结构  重复的做一件

   单分支语句:有条件的执行代码

         语法:

         if(条件) {

             条件满足时执行的代码

         }

   双分支:

          语法:

          if(条件) {

                条件满足执行的代码

           }

           else {

                条件不满足执行的代码

         }

    多分支:

          语法:

           if(条件) {

                条件满足执行的代码

           }

           else if(条件2) {

                条件不满足执行的代码

         }

           else if(条件3) {

                条件不满足执行的代码

         }

         ...

          else {

             以上条件都不满足就执行这里

         }

    	// var light = 'green' ;
        // 此处的每一条单分支语句都会执行判断
        // if(light === 'green') {
        //     alert('go');
        // }
        // if(light === 'red') {
        //     alert('stop');
        // }
        // if(light === 'yellow') {
        //     alert('wait');
        // }
        
        // var score = 66 ;
        // if(score >= 60) {
        //     alert('666')
        // }
        // else {
        //     alert('下个班见');
        // }
        
        // 这种不建议写,执行效率低,每一个判断都会执行一次
        // if(score >= 60) {
        //     alert(666)
        // }
        // if(score < 60) {
        //     alert('下个班见');
        // }
        
        var light = 'red' ;
        if(light === 'red') {
            alert('stop')
        }
        else if(light === 'green') {
            alert('go')
        }
        else if(light === 'yellow') {
            alert('wait')
        }
        // 底下的else可有可无
        else {
            alert('灯坏了')
        }

11.if的嵌套

if的嵌套:

      if() {

           if() {

           }

        }

12.判断是正数还是负数

    <input type="text" id="inp">
    <button id="btn">判断</button>
    
    <script>
        var oInp = document.getElementById('inp') ;
        var oBtn = document.getElementById('btn');
        oBtn.onclick = function () {  
            var n = oInp.value ;
            // if(n > 0) {
            //     alert(n + ' 是正数')
            // } 
            // else {
            //     alert(n + ' 是负数')
            // }
            // 判断有没有输入
            if(n === '') {
                alert('输入不能为空')
            } 
            // 不为空
            else {
                // 判断是不是数字
                if(isNaN(n)) {
                    alert('请输入一个数字')
                }
                // 是数字 
                else {
                    // alert('真棒')
                    if(n > 0) {
                        alert(n + ' 是正数')
                    } 
                    else {
                        alert(n + ' 是负数')
                    }
                }
            }
           
        }
    </script>

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
THE END
分享
二维码
< <上一篇
下一篇>>