目录
4.计算当前时间 距离 春节：2022年2月1日 00:00 倒计时
一、什么是时间对象
存储记录时间数据
二、时间对象的创建语法
通过 构造函数创建时间对象
没有参数 默认创建当前时间的时间对象
var 变量 = new Date();设定参数 创建指定时间的时间对象
var 变量 = new Date(参数);//当前时间的时间对象 var time = new Date(); console.log(time); //指定时间的时间对象 //数字必须符合 时间数值范围 //参数语法形式1 //参数语法 年-月-日 时:分:秒 var time2 = new Date('2022-1-9 19:53:34'); console.log(time2); //参数语法 年 月 日 时:分:秒 var time3 = new Date('2022 1 9 19:53:34'); console.log(time3); //参数语法 年/月/日 时:分:秒 var time3 = new Date('2022/1/9 19:53:34'); console.log(time3); //参数语法 年-月-日 时:分:秒 var time4 = new Date('2022,1,9 19:53:34'); console.log(time4); //参数语法形式2 6个数字 //月份设定的数字是 0 - 11 对应 1 - 12 月 //数字格式 可以超出正常值范围 //会自动向前一个时间单位进位 var time5 = new Date(2022,0,9,19,53,34); console.log(time5); //设定月份是15 对应的是 1年4个月 //向 年份单位进1 月份显示 4月 var time6 = new Date(2022,15,9,19,53,34); console.log(time6);执行结果：
三、时间对象的函数方法
获取 时间对象.get...()
通过 JavaScript程序提供的函数方法，获取时间对象中存储的具体的时间数据
1. 时间对象.getFullYear()
获取 四位 年份
2. 时间对象.getMonth()
获取 月份
获取的结果是 0 ~ 11 的数字
对应的是 1 ~ 12 的月份
3. 时间对象get.Date()
获取 日期
4. 时间对象.getDay()
获取 星期
获取的结果是 0 ~ 6 的数字
对应的是 星期日 ~ 星期六
5. 时间对象.getHours()
获取 小时
6. 时间对象.getMinutes()
获取 分钟
7. 时间对象.getSeconds()
获取 秒
8.案例：获取当前的时间
//创建时间对象 var currentTime = new Date(); //向控制台输出 数据 console.log(currentTime); //向控制台输出 属性属性值 console.dir(currentTime); //获取 时间对象中的具体的时间数据 //获取4 位年份 var year = currentTime.getFullYear(); console.log(year); //获取月份 //获取的是0 ~ 11，进行+1操作，输出1~12 var month = (currentTime.getMonth() + 1) < 10 ? '0' + (currentTime.getMonth() + 1) : currentTime.getMonth() + 1; console.log(month); //获取日期 var day = currentTime.getDate() < 10 ? '0' + currentTime.getDate() : currentTime.getDate(); //获取星期 //获取结果0~6 //可以设定一个星期的数组 var weekArr = [ '星期日' , '星期一' , ' 星期二' , '星期三' , '星期四' , '星期五' , '星期六' ] ; var week = weekArr[currentTime.getDay()]; console.log(week); //获取小时 //获取的是对应小时 本地时间 var hour = currentTime.getHours() < 10 ? '0' + currentTime.getHours() : currentTime.getHours(); console.log(hour); //获取的是对应的小时 世界标准时间 //var hour = currentTime.getUTCHours(); //获取分钟 var minute = currentTime.getMinutes() < 10 ? '0' + currentTime.getMinutes() : currentTime.getMinutes(); console.log(minute); //获取秒 var seconds = currentTime.getSeconds() < 10 ? '0' + currentTime.getSeconds() : currentTime.getSeconds(); console.log(seconds);执行结果：
四、时间戳
1.时间戳的理解：
距离 1970年1月1日 0点0分0秒 的 时间差
JavaScript中 时间戳的单位是 毫秒
1秒 = 1000毫秒
2.时间戳的用途：
一般使用时间戳 计算 时间差
之后将时间差转化为对应的 天 小时 分钟 秒
3.获取时间戳
//创建时间对象 var time = newDate(); //获取时间戳 var td = time.getTime();4.计算当前时间 距离 春节：2022年2月1日 00:00 倒计时
4.1 创建时间对象
起始时间 --- 当前时间
结束时间 --- 设定的时间
4.2 计算时间差
结束时间的时间戳 - 起始时间的时间戳
换算为 秒
4.3 将 时间差(秒) 换算为 天 小时 分钟 秒
//创建当前时间的时间对象 var startTime = new Date(); var endTime = new Date('2022/2/1 00:00:00'); //计算时间差 var td = parseInt((endTime.getTime() - startTime.getTime()) / 1000); //换算为 天 小时 分钟 秒 前导补零 // 天 var day = parseInt( td / (24*60*60) ); // 小时 var hour = parseInt( td % (24*60*60) / (60*60) ); // 分钟 var minute = parseInt( td % (60*60) / 60 ); // 秒 var seconds = td % 60 ; //页面输出 document.write(`距离春节还剩下${day < 10 ? '0' + day : day}天${hour < 10 ? '0' + hour : hour}小时${minute < 10 ? '0' + minute : minute}分钟${seconds < 10 ? '0' + seconds : seconds}秒`);执行结果：
五、定时器延时器
1.定时器
按照设定的时间间隔 每间隔设定的时间 执行一次程序
时间间隔的单位是 毫秒
也就是 按照间隔时间 一直重复执行程序
语法
setInterval(参数1，参数2)；
参数1 执行的函数程序
参数2 时间间隔
//定时器 //每间隔3000毫秒也就是3秒 执行一次 匿名函数中定义的程序 //语法形式1 setInterval(function() {console.log('正在努力写博客')},3000); //语法形式2 setInterval(fn,3000); function fn() { console.log('正在努力写博客') }2.延时器
按照间隔时间 延迟执行 一次程序
也就是按照设定的时间间隔 延迟执行程序
语法
setTimeout(参数1，参数2);
参数1 执行的函数程序
参数2 时间间隔
//延时器 //间隔3秒，只会触发一次 //语法形式1 setTimeout(function() {console.log('正在努力写博客')},3000); //语法形式2 setTimeout(fn,3000); function fn() { console.log('正在努力写博客'); }
六、清除 定时器 延时器
语法
clearInterval(参数)
clearTimeout(参数)
这两个函数 都是 既可以清除定时器 也可以清除延时器
参数是 定时器 或者 延时器 的 序号编号
// 定时器 延时器的执行效果 是 按照间隔的时间 触发 参数1 设定的函数程序 // 它们执行结果返回值 是 定时器 延时器函数内部定义的return的数值 // 也就意味着 变量中 存储的是 定时器延时器函数中 return 返回的数据数值 // 也就是 定时器延时器的编号序号 var num1 = setTimeout( function(){console.log(111)} , 1000 ); var num2 = setTimeout( function(){console.log(222)} , 2000 ); var num3 = setTimeout( function(){console.log(333)} , 3000 ); var num4 = setTimeout( function(){console.log(444)} , 4000 ); var num5 = setInterval( function(){console.log(555)} , 1000 ); console.log(num1); // 执行结果 1 console.log(num2); // 执行结果 2 console.log(num3); // 执行结果 3 console.log(num4); // 执行结果 4 console.log(num5); // 执行结果 5 // 清除的参数是 定时器 延时器 的 序号编号 // 可以直接定义数字,但是我们一般不这样做 //因为在实际项目中，有很多行代码，我们手动计算序号，很难操作 clearInterval(1); // 可以 使用变量 存储 定时器延时器的执行结果返回值 clearInterval(num2);