JavaScript学习笔记三——查阅MDN、日期对象

目录

一、学会查阅MDN文档

1.1 MDN

1.2如何学习对象中的方法

二、Math对象

2.1math对象

2.2利用对象封装自己的数学对象

2.3随机数方法

三、日期对象

3/1、日期格式化

3.2、获取时间戳

---

一、学会查阅MDN文档

1.1 MDN

学习一个内置对象的使用，只要学会其常用成员的使用即可，我们可以通过查文档学习，可以通过MDN/W3C来查询。
Mozilla开发者网络(MDN)提供了有关开放网络技术(Open Web )的信息，包括HTML、CSS和万维网及HTML5应用的API。
MDN: /zh-CN/
点击这个链接打开的网页如下：、

1.2如何学习对象中的方法

1．查阅该方法的功能
2．查看里面参数的意义和类型

3．查看返回值的意义和类型

4．通过demo进行测试

二、Math对象
 

2.1math对象

math数学对象不是一个构造函数，所以我们不需要new来调用而是直接使用里面的属性和方法即可

三个取整方法：

()  //向下取整

() //向上取整

(）//四舍五入 5往大了取

        console.log(Math)



        console.log(Math.PI)//π圆周率




        console.log(Math.abs(-1))//绝对值




        console.log(Math.ceil(11.46))//向上取整




        console.log(Math.floor(11.46))//向下取整




        // //四舍五入




        console.log(Math.round(11.46))



        console.log(Math.round(11.56))



        console.log(Math.round(11.01))



        console.log(Math.max(2, 10, 99, 5))//取最大值




        console.log(Math.max(2, 10, 99, 5, 'test'))//NaN




        console.log(Math.min(2, 10, 99, 5))//取最小值




        console.log(Math.pow(2, 3))//第一个为底数，第二个为指数


'

运行
运行

浏览器控制台输出结果图：

2.2利用对象封装自己的数学对象

 //2-利用对象封装自己的数学对象 里面有PI的最大值和最小值




        var myMath = {



            PI: 3.141592653,



            max: function () {



                var max = arguments[0];



                for (var i = 0; i < arguments.length; i++) {



                    if (arguments[i] > max) {



                        max = arguments[i];



                    }



                }



                return max;



            },



            min: function () {



                var min = arguments[0];



                for (var i = 0; i < arguments.length; i++) {



                    if (arguments[i] < min) {



                        min = arguments[i];



                    }



                }



                return min;



            }



        }



        console.log(myMath.PI);



        console.log(myMath.max(1, 9, 9));



        console.log(myMath.min(1, 3, 9));

'

运行
运行

---

2.3随机数方法

1、random() 返回一个随机的小数 0=<x<1

2、此方法里面不限制参数

3、取两个数之间的随机整数且包含这2个整数：

        (()*(max-min+1))+min

    function getRandom(min, max) {



            return Math.floor(Math.random() * (max - min + 1) + min);



        }



        console.log(getRandom(0, 41));



        //[0,41)




        for (i = 0; i < 50; i++) {



            console.log(Math.floor(Math.random() * 42))



 



        }



    //5-随机点名




        var arr = ['张三', '王二', '李四', '唐微微', '伍键']



        console.log(arr[getRandom(0, 5)]);



 



      //案列-猜数字游戏




        var random = getRandom(1, 10);



        while (true) {



            var num = prompt('你猜？输入1-10之间的一个数字')



            if (num > random) {



                alert('sorry！，你猜大了')



            } else if (num < random) {



                alert('还差一点点呢，有点小了！')



            } else {



                alert('恭喜你，猜对了！')



                break;



            }



        }

math对象_随机点名

三、日期对象

1、Date() 日期对象，是一个构造函数，必须使用new开调用

2、日期格式化

3、获取时间戳

3/1、日期格式化

 //没有参数返回当前系统的当前时间




        var date = new Date();//面向对象写法




        console.log(date)



        var date1 = new Date('2019.10.1')



        var date2 = new Date(2019, 10, 1)



        console.log(date1);



        console.log(date2);//11月




       



 



        var YY = date.getFullYear();//返回当前日期的年




        var MM = date.getMonth() + 1;//月份是0开始，真正月份需要加1




        var day = date.getDay();//星期二，礼拜几




        var DD = date.getDate();//返回天




        var hh = date.getHours();//返回时




        var mm = date.getMinutes();



        var ss = date.getSeconds();



        var ms = date.getMilliseconds();//返回毫秒




 



        var arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']



        console.log('今天是：' + YY + '年' + MM + '月' + DD + '日' + arr[day]);



 



 



  function getTime() {



            var time = new Date();



            var h = time.getHours();



            h = h < 10 ? '0' + h : h;



            var m = time.getMinutes();



            m = m < 10 ? '0' + m : m;



            var s = time.getSeconds();



            s = s < 10 ? '0' + s : s;



            return h + ':' + m + ':' + s;



        }



        console.log(getTime());

'

运行
运行

---

日期格式化

方法名	说明
getFullYear()	返回当前年
getMonth()	返回当前月
getDate()	返回当天日期
getDay()	返回当前星期几
getHours()	返回当前小时
getMinutes()	返回当前分钟
getSeconds()	返回当前秒钟
getMilliseconds()	返回当前毫秒

3.2、获取时间戳

1、可以通过valueof和getTime()获取

2、可以通过简单的写法（常用写法）

        +new Date

//返回距离1970年1月1日 00:00:00到此刻过了多少毫秒



        var Time = date.getTime();



        console.log(Time)



        console.log(date.valueOf());



 



 var time = +new Date();



        console.log(time);



 



        console.log(Date.now());

---

倒计时案列展示：

 

<!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>倒计时</title>




    <style>




        * {



            padding: 0;



            margin: 0;



        }



 



        #time {



            width: 500px;



            height: 200px;



            margin: 100px auto;



            border: 1px solid black;



 



        }



    </style>




</head>



 



<body>



    <div id="time">




        距离国庆还有：



        <p>165天21时09分31秒</p>




    </div>




    <script>




        var Time = document.getElementById('time');



        var p = document.getElementsByTagName('p')[0];



        var guoqin = new Date('2022/10/1');



 



        function fn() {



            var date = guoqin - new Date();



            // (date);//得到毫秒值




            /*




            将毫秒值进行转换：



            1s=>1000ms



            1m=60s



            1h=60m



            1day=24h



                天：



                时：



                分：



                秒：date/1000



            */



            var DD = Math.floor(date / 1000 / 60 / 60 / 24);//天




            var hh = Math.floor(date / 1000 / 60 / 60) % 24;//小时




            var mm = Math.floor(date / 1000 / 60) % 60;//分钟




            var ss = Math.floor(date / 1000) % 60;//秒




            // (DD);




            // (hh);




            p.innerHTML = DD + '天' + addZore(hh) + '小时' + addZore(mm) + '分钟' + addZore(ss) + '秒'




        }



        fn()



        setInterval(fn, 1000)



        function addZore(n) {



            return n < 10 ? '0' + n : n;



        }



 



   </script>




</body>



 



</html>

---