JavaScript- 2.4 内置对象Date-CSDN博客

本文链接：https://blog.csdn.net/HRDMN/article/details/148200108

本系列可作为前端学习系列的笔记，代码的运行环境是在HBuilder中，小编会将代码复制下来，大家复制下来就可以练习了，方便大家学习。

HTML和CSS系列文章 已经收录在前端专栏，有需要的宝宝们可以点击前端专栏查看！

点赞关注不迷路！您的点赞、关注和收藏是对小编最大的支持和鼓励！

系列文章目录

JavaScript- 1.1 行内、内部、外部三种引用方式

JavaScript- 1.2 ECMA基本语法和控制流

JavaScript- 1.3 DOM对页面内容进行操作

JavaScript- 1.4 BOM对浏览器进行操作

JavaScript- 1.5 数据类型+变量+运算符

JavaScript- 1.6 基本控制流

JavaScript- 2.1 系统函数和自定义函数

JavaScript- 2.2 内置对象MATH

JavaScript- 2.3 内置对象String

JavaScript- 2.4 内置对象Date

JavaScript- 2.5 内置对象ARRAY

JavaScript- 2.6 数组应用

JavaScript- 2.7 二维数组

JavaScript- 3.1 定时器函数 window.settimeout & window.settinterval

JavaScript- 3.2 JavaScript实现不同显示器尺寸的响应式主题和页面

JavaScript- 4.1 DOM-document对象

JavaScript- 4.2 DOM--定位元素

JavaScript- 4.3 轮播图实现指南

前言

小编作为新晋码农一枚，会定期整理一些写的比较好的代码，作为自己的学习笔记，会试着做一下批注和补充，如转载或者参考他人文献会标明出处，非商用，如有侵权会删改！欢迎大家斧正和讨论！

一、内置对象：Date

Date 是 JavaScript 中用于处理日期和时间的内置对象，它提供了创建日期对象、获取和设置日期时间信息、格式化日期以及执行日期计算等功能。

1、创建 Date 对象

可以通过多种方式创建 Date 对象：

1. 当前日期和时间

javascript

let now = new Date(); // 返回当前日期和时间的 Date 对象

2. 指定日期字符串

javascript

let date1 = new Date("October 13, 2023 14:30:00"); // 解析日期字符串
let date2 = new Date("2023-10-13T14:30:00"); // ISO 8601 格式

3. 指定日期分量

javascript

let date3 = new Date(2023, 9, 13, 14, 30, 0); // 年, 月(0-11), 日, 时, 分, 秒, 毫秒
// 注意：月份从 0 开始（0=一月，11=十二月）

4. 时间戳（毫秒数）

javascript

let date4 = new Date(1697197800000); // 2023-10-13 14:30:00 UTC 的时间戳

2、Date 方法

1.获取日期信息

getFullYear()：获取四位数的年份

javascript
```
let year = new Date().getFullYear(); // 2023
```

getMonth()：获取月份（0-11）

javascript

let month = new Date().getMonth(); // 9 表示十月

getDate()：获取月份中的第几天（1-31）

javascript
```
let day = new Date().getDate(); // 13
```
getDay()：获取星期几（0-6，0 表示星期日）

javascript
```
let weekday = new Date().getDay(); // 5 表示星期五
```
getHours()：获取小时（0-23）
getMinutes()：获取分钟（0-59）
getSeconds()：获取秒（0-59）
getMilliseconds()：获取毫秒（0-999）

2.设置日期信息

setFullYear(year[, month[, day]])：设置年份
setMonth(month[, day])：设置月份
setDate(day)：设置月份中的第几天
setHours(hour[, min[, sec[, ms]]])：设置小时
setMinutes(min[, sec[, ms]])：设置分钟
setSeconds(sec[, ms])：设置秒
setMilliseconds(ms)：设置毫秒
setTime(milliseconds)：设置完整时间（时间戳）

3.时间戳相关

getTime()：返回时间戳（自 1970-01-01 00:00:00 UTC 以来的毫秒数）

javascript
```
let timestamp = new Date().getTime(); // 当前时间戳
```
valueOf()：与 getTime() 相同

4.UTC 方法（协调世界时）

getUTCFullYear()
getUTCMonth()
getUTCDate()
getUTCHours()
getUTCMinutes()
getUTCSeconds()
getUTCMilliseconds()
setUTCFullYear(year[, month[, day]])
setUTCMonth(month[, day])
setUTCDate(day)
setUTCHours(hour[, min[, sec[, ms]]])
setUTCMinutes(min[, sec[, ms]])
setUTCSeconds(sec[, ms])
setUTCMilliseconds(ms)

5.其他实用方法

toDateString()：返回日期部分的字符串

javascript
```
new Date().toDateString(); // "Fri Oct 13 2023"
```

toTimeString()：返回时间部分的字符串

javascript

new Date().toTimeString(); // "14:30:00 GMT+0800 (中国标准时间)"

toISOString()：返回 ISO 8601 格式的字符串

javascript
```
new Date().toISOString(); // "2023-10-13T06:30:00.000Z"
```
toUTCString()：返回 UTC 日期时间的字符串

javascript
```
new Date().toUTCString(); // "Fri, 13 Oct 2023 06:30:00 GMT"
```
toLocaleDateString([locales[, options]])：返回本地化的日期字符串

javascript
```
new Date().toLocaleDateString('zh-CN'); // "2023/10/13"
```
toLocaleTimeString([locales[, options]])：返回本地化的时间字符串

javascript
```
new Date().toLocaleTimeString('zh-CN'); // "下午2:30:00"
```
toLocaleString([locales[, options]])：返回本地化的日期时间字符串

javascript
```
new Date().toLocaleString('zh-CN'); // "2023/10/13 下午2:30:00"
```

3、日期计算

Date 对象可以用于日期计算，因为它们可以转换为时间戳（毫秒数）：

javascript

let today = new Date();
let tomorrow = new Date(today);
tomorrow.setDate(today.getDate() + 1); // 计算明天的日期

let oneWeekLater = new Date();
oneWeekLater.setDate(oneWeekLater.getDate() + 7); // 计算一周后的日期

// 计算两个日期之间的天数差
let date1 = new Date('2023-10-01');
let date2 = new Date('2023-10-15');
let diffTime = Math.abs(date2 - date1);
let diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)); // 14 天

4、注意事项

月份从 0 开始：JavaScript 中月份是从 0 开始的（0=一月，11=十二月），这与许多其他语言不同。
时区处理：Date 对象内部以 UTC 时间存储，但显示时会根据本地时区调整。使用 UTC 方法可以避免时区问题。
字符串解析差异：不同浏览器对日期字符串的解析可能不一致，建议使用 ISO 8601 格式 (YYYY-MM-DDTHH:mm:ss.sssZ) 或显式创建 Date 对象。
不可变性：Date 对象本身是可变的（可以修改其属性），但日期计算通常通过创建新 Date 对象来实现。
闰年处理：JavaScript 的 Date 对象自动处理闰年、闰秒等复杂情况。

5、示例代码

javascript

// 创建日期
let birthday = new Date(1990, 5, 15); // 1990年6月15日（注意月份是5）

// 获取日期信息
console.log(birthday.getFullYear()); // 1990
console.log(birthday.getMonth() + 1); // 6（转换为1-12）
console.log(birthday.getDate()); // 15

// 设置日期
let nextYearBirthday = new Date(birthday);
nextYearBirthday.setFullYear(nextYearBirthday.getFullYear() + 1);
console.log(nextYearBirthday.toLocaleDateString()); // 本地化格式的明年生日

// 日期计算
let today = new Date();
let daysUntilBirthday = Math.ceil((nextYearBirthday - today) / (1000 * 60 * 60 * 24));
console.log(`距离下次生日还有 ${daysUntilBirthday} 天`);

Date 对象是 JavaScript 中处理日期时间的核心工具，掌握其使用方法对于开发需要日期时间处理的应用至关重要。

二、代码实战

代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>内置对象-Date</title>
	</head>
	<body>
		<script type="text/javascript">
			//创建
			var myDate =new Date();
			//方法 date只有方法
			console.log(myDate.getDate());//日
			console.log(myDate.getMonth());//月 0-11月
			console.log(myDate.getFullYear());//年
			console.log(myDate.getHours());//时间
			console.log(myDate.getMinutes());//分
			console.log(myDate.getSeconds());//秒
			console.log(myDate.getMilliseconds());//毫秒
			//显示整个日期和时间
			console.log(myDate.toDateString());//美国
			console.log(myDate.toLocaleDateString());//当地（动态）
			console.log(myDate.toLocaleString());//静态时间
			//时间段 从1970.1.1的0：0：0到现在的毫秒数
			console.log(myDate.getTime());//计算机计算0-十万累加所用时间
			var myDate1=new Date();
			var sum=0;
			for (var i=0;i<=100000000;i++) {
				sum+= i;
				
			}
			var myDate2=new Date();
						console.log("一共花了"+(	myDate2.getTime()-myDate1.getTime()+"毫秒"   ));
		</script>
	</body>
</html>

代码运行如下：