当前位置:首页 > JavaScript

js实现日期

2026-02-02 07:11:55JavaScript

获取当前日期

使用 new Date() 可以获取当前日期和时间。返回的对象包含年、月、日、时、分、秒等信息。

const currentDate = new Date();
console.log(currentDate); // 输出当前日期和时间(如:Wed Jun 05 2024 14:30:00 GMT+0800)

格式化日期为字符串

通过 toLocaleDateString() 或手动拼接日期组件,可以将日期格式化为易读的字符串。

const date = new Date();
const formattedDate = date.toLocaleDateString('zh-CN', {
  year: 'numeric',
  month: '2-digit',
  day: '2-digit'
});
console.log(formattedDate); // 输出 "2024/06/05"(中文格式)

// 手动拼接
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
console.log(`${year}-${month}-${day}`); // 输出 "2024-06-05"

解析字符串为日期

使用 Date.parse() 或直接传入字符串到 new Date(),可以将符合格式的字符串转为日期对象。

const dateStr = '2024-06-05';
const parsedDate = new Date(dateStr);
console.log(parsedDate); // 输出对应的日期对象

// 注意:不同浏览器对字符串格式的兼容性可能不同

计算日期差

通过时间戳(毫秒数)计算两个日期的差值,再转换为天数、小时等单位。

const date1 = new Date('2024-06-05');
const date2 = new Date('2024-06-10');
const diffMs = date2 - date1; // 差值(毫秒)
const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24));
console.log(diffDays); // 输出 5

日期加减操作

直接修改日期对象的组件(如 setDate),或使用库(如 date-fns)实现更复杂的操作。

const date = new Date('2024-06-05');
date.setDate(date.getDate() + 7); // 加7天
console.log(date.toLocaleDateString()); // 输出 "2024/6/12"

// 使用 date-fns(需安装)
import { addDays } from 'date-fns';
const newDate = addDays(date, 7);
console.log(newDate);

时区处理

使用 toLocaleString 指定时区,或通过 getTimezoneOffset() 获取本地时区偏移量。

const date = new Date();
console.log(date.toLocaleString('en-US', { timeZone: 'America/New_York' }));

const offset = date.getTimezoneOffset(); // 分钟数
console.log(`本地时区偏移:${offset} 分钟`);

第三方库推荐

对于复杂需求,推荐使用以下库:

js实现日期

  • date-fns:轻量级、模块化。
  • Day.js:类似 Moment.js 但更小巧。
  • Luxon:支持时区和国际化。
// Day.js 示例
const dayjs = require('dayjs');
console.log(dayjs().format('YYYY-MM-DD'));

标签: 日期js
分享给朋友:

相关文章

js实现vue

js实现vue

Vue.js 简介 Vue.js 是一个渐进式 JavaScript 框架,用于构建用户界面。其核心库专注于视图层,易于与其他库或现有项目整合。 实现 Vue.js 的基本步骤 安装 Vue.j…

js实现瀑布流

js实现瀑布流

实现瀑布流布局 瀑布流布局是一种常见的网页布局方式,常用于图片展示、商品列表等场景。以下是使用 JavaScript 实现瀑布流布局的几种方法。 纯 JavaScript 实现 通过计算元素的位置和…

js实现抽奖

js实现抽奖

实现抽奖功能的基本思路 抽奖功能的核心是随机选择奖项并展示结果。可以通过数组存储奖项,利用随机数生成索引,最后通过动画增强用户体验。 准备奖项数据 定义一个数组存储奖项信息,每个奖项可以包含名称、图…

js实现吸色

js实现吸色

使用Canvas实现吸色功能 通过Canvas的getImageData方法获取像素颜色数据。创建一个Canvas元素,将目标图像绘制到Canvas上,通过鼠标事件获取坐标对应的颜色值。 const…

js验证码实现

js验证码实现

验证码的基本原理 验证码(CAPTCHA)用于区分人类用户和自动化程序。常见类型包括图形验证码、滑动验证码、短信验证码等。JavaScript 可用于前端验证码的生成和验证逻辑。 图形验证码实现 使…

js实现同步

js实现同步

同步与异步的概念 在JavaScript中,同步代码会按照顺序执行,每一行代码必须等待上一行代码执行完成后才能运行。异步代码则允许在等待某些操作(如网络请求)完成的同时继续执行其他代码。 实现同步的…