【JavaScript】 Date 日期对象的创建及相关方法

一. 日期对象的创建

Date 日期对象是一个构造函数，必须使用new来调用创建对象。

其创建方式类似于数组和对象的创建方式：

var arr = new Array();// 创建一个数组对象
var obj = new Object();// 创建了一个实例对象

使用Date 如果没有参数，返回当前系统的当前时间

var date = new Date();
console.log(date);

二. 日期对象的相关方法

var date = new Date();

方法名	说明	使用
getFullYear()	获取当年	date.getFullYear()
getMonth()	获取当月（0-11）	date.getMonth()
getDate()	获取当天日期	date.getDate()
getDay()	获取星期几（周日(0)到周六(6)）	date.getDay()
getHours()	获取当前小时	date.getHours()
getMinutes()	获取当前分钟	date.getMinutes()
getSeconds()	获取当前秒钟	date.getSeconds()
setFullYear()	设置年份	date.setFullYear()
setMonth()	设置月份	date.setMonth()
setDate()	设置日期	date.setDate()
setHours()	设置小时	date.setHours()
setMinutes()	设置分钟	date.setMinutes()
setSeconds()	设置秒钟	date.setSeconds()

三. 时间戳

从 格林威治时间 到现在的毫秒数

获取1970年01月01日00时00分00秒至现在的总毫秒数

var date = new Date();
console.log(date.getTime()); // 1672320018445
// 设置
date.setTime(1000);
console.log(date); // Thu Jan 01 1970 08:00:01 GMT+0800 (香港标准时间)

案例

案例1：在页面上展示一个时钟，隔1s更新一次

<div id="box"></div>

// 封装一个函数，当数字是一位数的时候，前面补0
function format(num) {
    return num >= 10 ? num : "0" + num;
}
function dateStr() {
    // 定义一个空字符串
    var str = "";
    // 获取终端的日期
    var date = new Date();
    // 获取年份
    var year = date.getFullYear();
    // 获取月份，从0开始所以需要+1
    var month = date.getMonth() + 1;
    // 获取日期
    var day = date.getDate();
    // 获取星期
    var week = date.getDay();
    var weekStr = "日一二三四五六";
    week = "星期" + weekStr[week];
    // 获取小时
    var h = date.getHours();
    // 获取分钟
    var m = date.getMinutes();
    // 获取秒数
    var s = date.getSeconds();
    // 进行拼接
    str = `${year}年${month}月${day}日 ${week}  ${format(h)}:${format(
        m
    )}:${format(s)}`;
    return str;
}
// 显示在页面上
box.innerHTML = dateStr();
// 利用间隔定时器，进行每隔一秒数字变化
setInterval(function() {
    box.innerHTML = dateStr();
}, 1000);

效果图：

案例2：距离除夕倒计时

<h4>距离除夕倒计时：</h4>
<div id="box"></div>

function countDay() {
    // 定义一个空字符串
    var str = "";
    // 设置倒计时的最终日期
    var futureTime = new Date("2023/1/21");
    // 获取当前终端的时间
    var currentTime = new Date();
    // 计算当前到最终时间的间隔
    var time = parseInt((futureTime - currentTime) / 1000);
    // 计算剩余的时间
    var day = parseInt(time / (24 * 60 * 60));
    var h = parseInt((time % (24 * 60 * 60)) / (60 * 60));
    var m = parseInt((time % (60 * 60)) / 60);
    var s = time % 60;
    // 进行拼接
    str = `${day}天${h}时${m}分${s}秒`;
    return str;
}
// 展示到页面
box.innerHTML = countDay();
// 利用间隔定时器，进行每隔一秒数字变化
setInterval(function() {
    box.innerHTML = countDay();
}, 1000);

效果图：