【前端学习笔记】12-JavaScript内置对象（上）

内置对象

• JavaScript中的对象分为三种：自定义对象，内置对象，浏览器对象
• 前两种对象是JS基础内容，属于ECMAscript；第三个浏览器对象属于JS独有的，在JS API讲解
• 内置对象是指JS语言自带的一些对象，这些对象提供了一些最基本和必要的功能（属性和方法）
• 内置对象的优点就是帮助开发者快速开发
• JS提供了多个内置对象，如Math，Date，Array，String等

查文档

• JS中有许多内置对象且每个内置对象中有许多属性和方法，难以长时间记忆，学会查阅文档是每个开发者必不可少的技能；可以通过MDN/W3C（）来查询（MDN官网链接）
• 如何学习对象中的方法：

Math对象

Math概述

Math对象不是构造函数，它是具有数学常数和函数的属性和方法。跟数学相关的运算（求绝对值，最大值，取整等）可以使用Math中的成员

PI圆周率属性和max最大值方法使用示例

Math绝对值和三个取整方法

• 注意点：Math.round()四舍五入时.5往大的取

Math随机数方法

• Math.random() 函数返回一个浮点数， 伪随机数在 0<= x <1;
• 得到两个数之间的随机整数并包含这两个整数：

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

• 实现随机点名：

math案例

• Math案例及案例代码
• 若全部复制使用时，需注意每个案例分开运行，避免某些变量被重复定义

 // Math案例1：封装自己的数学对象，里面有PI，最大值，最小值
        var myMath = {
            PI:3.141592653,
            max:function(){
                var max = arguments[0];
                for(i=1;i<arguments.length;i++){
                    if(arguments[i]>max){
                        max = arguments[i]; 
                    }
                }
                return max;
            },
            min:function(){
                var min = arguments[0];
                for(i=1;i<arguments.length;i++){
                    if(arguments[i]<min){
                        min = arguments[i]; 
                    }
                }
                return min;
            }
        }
console.log(myMath.max(1,5,6));//6
console.log(myMath.min(6,4,2));//2

        // Math案例2：猜数字游戏
        function getRandom(min,max){
            return Math.floor(Math.random() * (max - min + 1)) + min; 
        }
        var random = getRandom(1,10);
       
        while(true){
            var num = prompt('你来猜？请你输入一个1-10的数字');
            if(num>random){
                alert('你猜大了');
            }else if(num<random){
                alert('你猜小了');
            }else{
                alert('恭喜你猜对了')
                break;
            }
        }

日期对象

Date概述

Date()方法的使用

• 参数monthIndex 是从“0”开始计算的，这就意味着一月份为“0”，十二月份为“11”。
• 使用方法代码示例：

日期格式化

• 概念：格式化日期表示将日期/时间格式转换为预先定义的日期/时间格式，例如将日期“Sat Jul 16 2022 15:06:24 GMT+0800” ，格式转换为 “2022-7-16 15:06:24 星期五”的格式。

• 格式化日期：年月日

    //   格式化日期 年月日
    var date = new Date();
    console.log(date.getFullYear());//返回当前日期的年 2022
    console.log(date.getMonth()+1);//返回的月份小一个月，记得加1
    console.log(date.getDate());//  返回的是几号    
    console.log(date.getDay());//6 周一返回的是1，周六返回的是6；但周日返回的是0

    // 写一个2022年7月16日 星期六
    var year = date.getFullYear();
    var month = date.getMonth()+1;
    var dates = date.getDate();
    var day = date.getDay();
    var arr = ['星期天','星期一','星期二','星期三','星期四','星期五','星期六'];
    console.log('今天是'+year+'年'+month+'月'+dates+'日'+arr[day]);

• 格式化日期：时分秒

  // 格式化日期 时分秒
    var date = new Date();
    console.log(date.getHours());
    console.log(date.getMinutes());
    console.log(date.getSeconds());
    // 要求封装一个函数，返回当前的时分秒 格式08:08:08
    function getTime(){
        var hours = date.getHours();
        hours = hours<10? hours = '0'+hours:hours; 
        var minu = date.getMinutes();
        minu = minu<10? minu = '0'+minu:minu; 
        var sec = date.getSeconds();
       sec = sec<10? sec = '0'+sec:sec; 
       return hours+':'+minu+':'+sec;
    }
    console.log(getTime());

Date总的毫秒数（时间戳）

• 日期总的毫秒数（时间戳）：自 1970 年 1 月 1 日起经过的毫秒数
• 获取Date总毫秒数的三种方法

Date案例

        // 倒计时案例
        function countDown(time) {

            var nowTime = +new Date(); //返回的是当前时间总的毫秒数
            var inputTime = +new Date(time);
            times = (inputTime -nowTime)/1000;//用户输入的时间总毫秒数
            var d = parseInt(times / 60 / 60 / 24)//天
            d =  d<10? d = '0'+d : d;
            var h = parseInt(times / 60 / 60 % 24);//时
            h =  h<10? h = '0'+h : h;
            var m = parseInt(times / 60 % 60); //分
            m =  m<10? m = '0'+m : m;
            var s = parseInt(times % 60); //当前的秒   
            s =  s<10? s = '0'+s : s;
            return d + '天' + h + '分' + s + '秒';
        }

        console.log(countDown('2022-7-16 18:00:00'));