迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

JavaScript 中格式化日期

作者:迹忆客 最近更新:2024/03/19 浏览次数:

本教程说明了如何格式化 JavaScript 日期。

我们可以使用 JavaScript Date 对象获取当前日期和时间。我们可以通过编写自己的自定义函数并使用诸如 moment.js 之类的库来格式化日期。

首先,我们使用 Date 对象创建一个名为 date 的变量,以获取当前日期和时间。

var date = new Date();

我们将显示应用于该变量的所有格式化函数的结果。


在 JavaScript 中使用 toTimeString() 格式化 JavaScript 数据

toTimeString() 有助于从 date 变量中仅提取包含有关时间信息的字符串。

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

输出:

"20:07:37 GMT+0100 (Central European Standard Time)"

在 JavaScript 中使用 toUTCString() 格式化 JavaScript 数据

此方法从变量中存储的当前国家/地区的时间返回格林威治标准时间或世界标准时间。

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

输出:

"Thu, 18 Mar 2021 19:09:40 GMT"

在 JavaScript 中使用 toDateString() 格式化 JavaScript 数据

此方法提取日期并以字符串形式返回它。

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

输出:

"Thu Mar 18 2021"

在 JavaScript 中使用 toISOString() 格式化 JavaScript 数据

它以 ISO 8601 格式返回包含日期/时间的字符串。

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

输出:

"2021-03-18T19:11:35.957Z"

在 JavaScript 中使用 toLocaleString() 格式化 JavaScript 数据

它将使用语言环境设置将日期对象转换为字符串。

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

输出:

"3/18/2021, 8:13:03 PM"

在 JavaScript 中使用 toLocaleTimeString() 格式化 JavaScript 数据

它将日期对象转换为字符串,但只提取时间,使用本地设置。

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

输出:

"8:14:22 PM"

在 JavaScript 中使用自定义函数格式化日期

日期格式 dd-mm-yyyydd-mm-yyyy 及类似格式

我们使用 getDate()getMonth()getFullYear() 方法来获取日期的各个部分,并使用所需的符号和所需的顺序将其连接起来。

例如,我们可以通过编写下面的自定义函数来获得 dd/mm/yyyydd-mm-yyyymm/yyyy 等任何我们喜欢的方式。

var date = new Date();
const formatDate = (date) => {
  let formatted_date =
      date.getDate() + '-' + (date.getMonth() + 1) + '-' + date.getFullYear()
  return formatted_date;
} console.log(formatDate(date));

输出:

"18-3-2021"

我们还可以在日期字符串中放入月份名称,例如 JanuaryFebruaryMarch

var date = new Date();
const months = [
  'JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV',
  'DEC'
];

const formatDate = (date) => {
  let formatted_date =
      date.getDate() + '-' + months[date.getMonth()] + '-' + date.getFullYear()
  return formatted_date;
} console.log(formatDate(date));

输出:

"18-MAR-2021"

日期格式 yyyy-mm-dd hh:mm:ss 和类似的格式

我们使用所有方法 getDate()getMonth()getFullYear()getHour()getminutes()getsecond() 来分别获取日期和时间的各个部分,以及使用我们想要的符号和我们想要的顺序将它们连接起来。

var date = new Date();

const formatDate =
    (current_datetime) => {
      let formatted_date = current_datetime.getFullYear() + '-' +
          (current_datetime.getMonth() + 1) + '-' + current_datetime.getDate() +
          ' ' + current_datetime.getHours() + ':' +
          current_datetime.getMinutes() + ':' + current_datetime.getSeconds();
      return formatted_date;
    }

                          console.log(formatDate(date));

输出:

"2021-3-18 20:21:2"

Moment.js 包与 Node.js 一起使用以格式化 JavaScript 中的日期

它被认为是 JavaScript 中最好的日期和时间库。它简单易用,不需要记住并构建所有这些不同的功能。用户可以根据自己的格式需求轻松编写字符串模板。

const moment = require('moment');
let m = moment();
m.format('[Time: ] h:mm:ss a');  // output of the form `Time: 11:39:03 pm`

上面的代码演示了 moment.js 允许我们使用 Node REPL 格式化日期和时间的方式之一。


dateformat 包与 Node.js 一起使用

另一个像 Moment.js 一样的软件包可以帮助我们格式化日期。它可以与 Node.js浏览器端 JavaScript 一起使用。它通过包含 .format() 方法来扩展 Date 对象。

浏览器端

Day = new Date();
Day.format('dd-m-yy');  // Returns '16-3-21'

上面的代码显示了将 dateformat 包与 Date 对象一起使用的简便性。

Node.js

const dateformat = require('dateformat');
let now = new Date();
dateformat(now, 'dddd, mmmm dS, yyyy, h:MM:ss TT');  // returns 'Tuesday, March
                                                     // 16th, 2021, 11:32:08 PM'

上面的代码演示了如何使用 dateformat 包通过 Node REPL 格式化日期。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

Do you understand JavaScript closures?

发布时间:2025/02/21 浏览次数:108 分类:JavaScript

The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.

Do you know about the hidden traps in variables in JavaScript?

发布时间:2025/02/21 浏览次数:178 分类:JavaScript

Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av

How much do you know about the Prototype Chain?

发布时间:2025/02/21 浏览次数:150 分类:JavaScript

The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start

用 jQuery 检查复选框是否被选中

发布时间:2024/03/24 浏览次数:102 分类:JavaScript

在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便