javascript中Date对象:格式化时间,时间戳、倒计时详解和setTime()方法

目录

  • 一、Date基本用法
    • 1、基本用法
    • 2、参数类型
    • 3、注意点
  • 二、日期格式化
    • 1、年月日星期格式化
    • 2、时分秒格式化
  • 三、时间的总毫秒(时间戳)
    • 1、通过valueOf()
    • 2、通过getTime()
    • 3、简单写法(最常用)
    • 4、H5新增方法
    • 5、时间戳为0
  • 四、倒计时
  • 五、Date对象的设置类函数
  • 六、setTime()方法
    • 定义
    • 理解
    • 用法
    • 参数
    • 案例

一、Date基本用法

javascript为我们提供了内置对象Date来进行时间和日期的计算。

Date() 日期对象是一个构造函数,因此必须使用new来调用创建我们的日期

1、基本用法

var date = new Date();
console.log(date); // 返回当前系统的时间
// 结果:Sun Oct 16 2022 13:20:00 GMT+0800 (中国标准时间)

2、参数类型

数字型格式:2022,10,16
字符串型格式(常用):'2022-10-16 8:8:8'/ '2022/10/16'

var date1 = new Date(2022,10,16);
console.log(date1);  // 返回月份为11月
// 结果:Wed Nov 16 2022 00:00:00 GMT+0800 (中国标准时间)

var date2 = new Date('2022-10-16 8:8:8');
console.log(date2);  // Sun Oct 16 2022 08:08:08 GMT+0800 (中国标准时间)

3、注意点

月份的整数值,从 0(1 月)到 11(12 月),也就是说数字0代表1月份,数字11代表12月份。

二、日期格式化

方法名 说明 代码
getFullYear() 获取当年 obj.getFullYear()
getMonth() 获取当月(值为0-11) obj.getMonth()
getDate() 获取当天 obj.getDate()
getDay() 获取星期几 obj.getDay()
getHours 获取当前小时 obj.getHours()
getMinutes() 获取当前分钟 obj.getMinutes()
getSeconds() 获取当前秒钟 obj.getSeconds()

1、年月日星期格式化

格式化:2022年10月16日 星期日

var date = new Date();

var year = date.getFullYear(); //年份
var month = date.getMonth()+1; // 月份
var dates = date.getDate(); // 日
var arr = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
var day =date.getDay(); // 星期几

console.log('今天是:'+ year +'年'+month +'月' + dates + '日 ' + arr[day]);

// 结果:今天是:2022年10月16日 星期日

2、时分秒格式化

格式化:08 : 16 : 09

var date = new Date();

var hour = date.getHours(); // 时
hour = hour > 9 ? hour : '0' + hour;
var minutes = date.getMinutes(); // 分
minutes = minutes > 9 ? minutes : '0' + minutes;
var seconds = date.getSeconds();  // 秒
seconds = seconds > 9 ? seconds : '0' + seconds;

console.log('时间是:' + hour + ':' + minutes + ':' + seconds);

// 结果: 时间是:14:30:01

三、时间的总毫秒(时间戳)

Date对象是基于GMT时间1970年1月1日起的毫秒数,一天由 86,400,000 毫秒组成。

1、通过valueOf()

var date = new Date();
console.log(date.valueOf());  // 当前时间距离UTC的毫秒数
//结果 1665902415094

2、通过getTime()

var date = new Date();
console.log(date.getTime()) // 当前时间距离UTC的毫秒数

//结果 1665902415094

3、简单写法(最常用)

var date = +new Date()

var date = +new Date();
console.log(date);  // 当前时间距离UTC的毫秒数

4、H5新增方法

Date.now()

console.log(Date.now()); // 当前时间距离UTC的毫秒数

5、时间戳为0

计算机元年为1970-01-01 00:00:00
我们的时间戳为0的时间为1970-01-01 08:00:00
UNIX认为1970年1月1日0点是时间纪元,unix时间戳零点是 1970年1月1日0点整(utc),但是我们的电脑时区设置为东8区,故打印的结果是8点,其实系统时间依然是0点

现代计算机(电话,电子设备)时间以1970 年 1 月 1 日的 08:00为基准,在时间转换时,或者时间重置时都会出现这个时间值。

四、倒计时

核心:输入的时间减去现在的时间就是倒计时
实现:通过时间戳来实现
输入的时间戳减去现在的时间戳得到剩余时间的总毫秒数,然后将总的毫秒数换算为天、时、分、秒

// 封装倒计时函数
function countDown(time){
    var nowTime = +new Date(); // 当前时间
    var inputTime = +new Date(time); // 输入时间
    var times = (inputTime - nowTime) / 1000; // 剩余时间秒数

    var s = parseInt(times % 60) // 剩余秒数
    var m = parseInt(times / 60 % 60) // 剩余分钟
    var h = parseInt(times / 60 / 60 %24); // 剩余小时
    var d = parseInt(times / 60 / 60 / 24); // 剩余天数

    // 小于10,数字前面加0
    s= s > 9 ? s : '0' + s;
    m= m > 9 ? m : '0' + m;
    h= h > 9 ? h : '0' + h;
    d= d > 9 ? d : '0' + d;

    return d + '天' + h + '时' + m + '分' + s + '秒';
}

console.log(countDown('2022-11-11'));
// 结果:25天15时21分06秒

五、Date对象的设置类函数

方法名 说明 代码
setFullYear() 设置某一年(4位数) obj.setFullYear(2022)
setMonth() 设置年份中的某一月(1-12) obj.setMonth(22)
setDate() 设置月份中的某一天(1-31) obj.setDate(2)
setHours() 设置一天中的某一小时(0-23) obj.setHours(22)
setMinutes() 设置小时中的某一分(0-59) obj.setMinutes(22)
setSeconds() 设置分钟中的某一秒(0-59) obj.setSeconds(22)
setMilliseconds() 设置一秒钟的某一毫秒(0-999) obj.setMilliseconds(22)
// 当前系统时间
var date= new Date();
console.log(date);

// 将时间设置为2022年2月22日 22:22:22
date.setFullYear(2022);
date.setMonth(01);
date.setDate(22);
date.setHours(22);
date.setMinutes(22);
date.setSeconds(22);
// date.setMilliseconds(222);
console.log(date);

六、setTime()方法

定义

setTime() 方法以毫秒设置 Date 对象。

理解

使用 setTime() 向 GMT 1970/01/01 添加毫秒,并显示新的日期和时间。

用法

obj.setTime(millisecond) 该方法必须结合一个Date 对象来使用

参数

参数 描述
millisecond 必需。要设置的时间是距计算机元年的毫秒数

案例

var date = new Date();

 // 向 1970/01/01 添加 888 毫秒,并显示新的日期和时间
 date.setTime(888)
 console.log(date) // Thu Jan 01 1970 08:00:00 GMT+0800 (中国标准时间)

 // 将从 1970/01/01 减去 888 毫秒,并显示新的日期和时间
 date.setTime(-888)
 console.log(date) // Thu Jan 01 1970 07:59:59 GMT+0800 (中国标准时间)

你可能感兴趣的:(JavaScript,javascript,前端,开发语言)