一、要求

计算两个指定日期的时间差（2023年元旦到来的时间）

二、分析

1. 先获取到两个时间距离1970（格林尼时间）~~~毫秒数
2. 计算两个毫秒数的差值 ----> 得到了总毫秒数
3. 计算总毫秒数内, 有多少个完整的天
   • parseInt(总毫秒数 / 一天的毫秒数)
4. 用剩余不足一天的毫秒数去计算出时分秒

三、代码实现

    1秒   === 1000毫秒1分钟 === 1000*60毫秒1小时 === 1000*60*60毫秒1天   === 1000*60*60*24毫秒

1、代码实现

        /* 1. 获取当前的时间和指定时间 */// 当前时间var currentTime = new Date();// 指定时间var prevTime = new Date('2023-1-1 0:0:0');/* 2. 获取当前时间和指定时间到1970(格林尼时间)的毫秒差 */var currentTimeMilli = currentTime.getTime();var prevTimeMilli = prevTime.getTime();// 获取当前时间和指定时间的时间差var times = prevTimeMilli - currentTimeMilli;/* 4. 计算出 天 时 分 秒 *//*** 4.1 计算有多少完整的天*   计算公式：parseInt(总的毫秒数 / 一天的毫秒数)*            parseInt( times / (1000 * 60 * 60 * 24) )* * 4.2 计算剩余不足一天的毫秒数*   计算公式: 总毫秒 - (完整天数 * 一天的毫秒数)*/// 一天的毫秒数var oneDayMilli = 1000 * 60 * 60 * 24;// 有多少个完整的天var days = parseInt(times / oneDayMilli);// 减去完整天数的毫秒数leave1 = times - days * oneDayMilli;/*** 4.3 计算有多少完整的小时*   计算公式：parseInt(不足一天的毫秒数 / 一个小时的毫秒数)*            parseInt(leave1 / ( 1000 * 60 * 60 ) )* * 4.4  计算一下不足一小时的毫秒数*   计算公式: leave1 - (完整的小时 * 一小时的毫秒数)*/// 一小时的毫秒数var onHoursMilli = 1000 * 60 * 60;// 计算出有多少个完整的小时var hours = parseInt(leave1 / onHoursMilli);// 计算剩余不足一小时的毫秒数leave2 = leave1 - hours * onHoursMilli;/*** 4.5 计算有多少完整的分钟*   计算公式: parseInt(leave2 / 一分钟的毫秒数)* * 4.6 计算一下不足一分钟的毫秒数*   计算公式: leave2 - (完整分钟 * 一分钟的毫秒数)*/// 一分钟的毫秒数var oneMinutesMilli = 1000 * 60;// 计算出了有多少完整的分钟var minutes = parseInt(leave2 / oneMinutesMilli);// 计算不足一分钟的毫秒数leave3 = leave2 - minutes * oneMinutesMilli;/**  * 4.8 计算一下有多少完整的秒*   计算公式: parseInt(leave3 / 一秒钟的毫秒数)*/var seconds = parseInt(leave3 / 1000);document.write(`
距离2023元旦还相差${days}天${hours}小时${minutes}分钟${seconds}秒
`);

2、代码优化

        /* 1. 获取当前的时间和指定时间 */// 当前时间var currentTime = new Date();// 指定时间var prevTime = new Date('2023-1-1 0:0:0');/* 2. 获取当前时间和指定时间的时间差*/var times = prevTime.getTime() - currentTime.getTime();/* 3. 计算出 天 时 分 秒  */// 3.1 计算相差的天数 var days = parseInt(times / (1000 * 60 * 60 * 24));// 3.2 计算相差小时数// 计算天数后剩余的毫秒数var leave1 = times % (1000 * 60 * 60 * 24);var hours = parseInt(leave1 / (1000 * 60 * 60));// 3.3 计算相差分钟数// 计算小时后剩余的毫秒数var leave2 = leave1 % (1000 * 60 * 60);var minutes = parseInt(leave2 / (1000 * 60));// 3.4 计算相差的秒数// 计算分钟后剩余的毫秒数var leave3 = leave2 % (1000 * 60);var seconds = parseInt(leave3 / 1000);document.write(`
距离2023元旦还相差${days}天${hours}小时${minutes}分钟${seconds}秒
`)

三、函数封装

1、函数说明

• 实际项目中每一个自定义函数(程序员自己写的函数) 必须有函数说明
• 在实际项目中，函数说明会有具体的格式要求

函数说明的基本格式(内容)

1. 函数名称，基本作用
2. 说明参数：数据类型 参数名称 基本说明
3. 说明返回值：数据类型、返回值名称、基本说明
4. 函数的执行原理，参数要求，函数的基本说明，越详细越好

2、函数封装

        /*** myGetTimeDifference 获取时间差数据*     @param    string  endTime       结束时间字符串*     @param    string  startTime     起始时间字符串*     @return   object                返回时间差的结果的天 小时 分钟 秒*     如果没有输出起始时间，以当前时间作为起始时间*//*** 1分钟 === 60秒* 1小时 === 60 * 60秒* 1天   === 60 * 60 * 24秒*/function myGetTimeDifference(endTime, startTime){// 必须要有最终时间// 如果没有输入 返回一个报错信息if(endTime === undefined) return '您必须输入一个终止时间';// 创建终止时间// 如果开始时间 startTime 没有实参 当前时间作为起始时间var startTimeObj = startTime === undefined ? new Date() : new Date(startTime);// 计算时间差 转化为秒数var time = parseInt((endTimeObj.getTime() - startTimeObj.getTime) / 1000);// 总秒数转化为对应的天数var days = parseInt(time / (24 * 60 * 60));// 计算小时var hours = parseInt((time % (24 * 60 * 60)) / (60 * 60));// 计算分钟var minutes = parseInt((time % (60 * 60)) / 60);// 计算秒var seconds = time % 60;// 以对象的形式返回结果return {days, hours, minutes, seconds}}

3、函数调用

    
当前时间距离元旦放假还有XX天XX小时XX分钟XX秒

        // 通过DOM操作将字符串写入div中var oDiv = document.querySelector('div');// 通过函数获取时间差数据对象var time = myGetTimeDifference();// console.log(time);oDiv.innerHTML = `
距离2023元旦放假还相差${time.days}天${time.hours}小时${time.minutes}分钟${time.seconds}秒
`;// 通过定时器将程序每秒重复执行一次setInterval(function () {// 每次都要重新获取时间差数据var time = myGetTimeDifference('2023-1-1 0:0:0');console.log(time);// 将新的时间差数据写入div标签中oDiv.innerHTML = `
距离2023元旦放假还相差${time.days}天${time.hours}小时${time.minutes}分钟${time.seconds}秒
`;}, 1000)