如何在 JavaScript 中格式化日期?
- 2024-11-02 21:00:00
- admin 原创
- 37
问题描述:
如何将 JavascriptDate
对象格式化为字符串?(最好采用以下格式10-Aug-2010
:)
解决方案 1:
如果您需要的格式控制比当前接受的答案略少,Date#toLocaleDateString
可用于创建标准语言环境特定的渲染。locale
和options
参数让应用程序指定应使用其格式约定的语言,并允许对渲染进行一些自定义。
选项键示例:
day:
天的表示形式。
可能的值是“数字”、“2 位数字”。
weekday:
星期几的表示形式。
可能的值有“narrow”、“short”、“long”。
year:
年份的表示。
可能的值是“数字”、“2 位数字”。
month:
月份的表示形式。
可能的值有“数字”、“2 位数字”、“窄”、“短”、“长”。
hour:
小时的表示形式。
可能的值是“数字”、“2 位数字”。
分钟:
分钟的表示形式。
可能的值是“数字”、“2 位数字”。
second:
秒的表示形式。
可能的值是“数字”或“2 位数字”。
hour12:
时间格式的表示。
接受布尔值 true 或 false
所有这些键都是可选的。您可以根据需要更改选项值的数量,这也将反映每个日期时间术语的存在。
注意:如果您只想配置内容选项,但仍使用当前语言环境,则传递null
第一个参数将导致错误。请undefined
改用。
对于不同的语言:
“en-US”:适用于美式英语
“en-GB”:适用于英式英语
“hi-IN”:印地语
“ja-JP”:针对日语
您可以使用更多语言选项。
例如
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
var today = new Date();
console.log(today.toLocaleDateString("en-US")); // 9/17/2016
console.log(today.toLocaleDateString("en-US", options)); // Saturday, September 17, 2016
console.log(today.toLocaleDateString("hi-IN", options)); // शनिवार, 17 सितंबर 2016
运行代码片段Hide results展开片段
您也可以使用该toLocaleString()
方法实现相同目的。唯一的区别是此函数提供您未传递任何选项时的时间。
// Example
9/17/2016, 1:21:34 PM
参考:
toLocaleString()
toLocaleDateString()
解决方案 2:
对于自定义分隔的日期格式,您必须从对象( ECMAScript 国际化 APIDateTimeFormat
的一部分
)中提取日期(或时间)组件,然后使用所需的分隔符手动创建字符串。
为此,您可以使用DateTimeFormat#formatToParts
。您可以解构数组,但这并不理想,因为数组输出取决于语言环境:
{ // example 1
let formatter = new Intl.DateTimeFormat('en');
let example = formatter.formatToParts();
console.log(example);
}
{ // example 2
let formatter = new Intl.DateTimeFormat('hi');
let example = formatter.formatToParts();
console.log(example);
}
运行代码片段Hide results展开片段
更好的方法是将格式数组映射到结果字符串:
function join(date, options, separator) {
function format(option) {
let formatter = new Intl.DateTimeFormat('en', option);
return formatter.format(date);
}
return options.map(format).join(separator);
}
let options = [{day: 'numeric'}, {month: 'short'}, {year: 'numeric'}];
let joined = join(new Date, options, '-');
console.log(joined);
运行代码片段Hide results展开片段
DateTimeFormat
您还可以使用 逐个
提取各个部分DateTimeFormat#format
,但请注意,使用此方法时,截至 2020 年 3 月,ECMAScript 实现中在分钟和秒的前导零方面存在一个错误(该错误已被上述方法规避)。
let date = new Date(2010, 7, 5);
let year = new Intl.DateTimeFormat('en', { year: 'numeric' }).format(date);
let month = new Intl.DateTimeFormat('en', { month: 'short' }).format(date);
let day = new Intl.DateTimeFormat('en', { day: '2-digit' }).format(date);
console.log(`${day}-${month}-${year}`);
运行代码片段Hide results展开片段
处理日期和时间时,通常值得使用库(例如luxon、date-fns、moment.js由于该领域隐藏着许多复杂性,因此不建议用于新项目。
请注意,上述解决方案中使用的 ECMAScript 国际化 API在 IE10( 2020 年 2 月全球浏览器市场份额为 0.03% )中不受支持。
解决方案 3:
如果您需要使用纯 JavaScript 快速格式化日期,请使用getDate
、getMonth + 1
、和getFullYear
:getHours
`getMinutes`
var d = new Date();
var datestring = d.getDate() + "-" + (d.getMonth()+1) + "-" + d.getFullYear() + " " +
d.getHours() + ":" + d.getMinutes();
// 16-5-2015 9:50
或者,如果您需要用零填充:
var datestring = ("0" + d.getDate()).slice(-2) + "-" + ("0"+(d.getMonth()+1)).slice(-2) + "-" +
d.getFullYear() + " " + ("0" + d.getHours()).slice(-2) + ":" + ("0" + d.getMinutes()).slice(-2);
// 16-05-2015 09:50
解决方案 4:
使用date.format 库:
var dateFormat = require('dateformat');
var now = new Date();
dateFormat(now, "dddd, mmmm dS, yyyy, h:MM:ss TT");
返回:
Saturday, June 9th, 2007, 5:46:21 PM
npm 上的 dateformat
解决方案 5:
好吧,我想要的是将今天的日期转换为MySQL友好的日期字符串,例如2012-06-23
,并将该字符串用作我的查询之一中的参数。我找到的简单解决方案是这样的:
var today = new Date().toISOString().slice(0, 10);
请记住,上述解决方案没有考虑您的时区偏移。
您可以考虑使用这个函数:
function toJSONLocal (date) {
var local = new Date(date);
local.setMinutes(date.getMinutes() - date.getTimezoneOffset());
return local.toJSON().slice(0, 10);
}
如果您在一天开始/结束时执行此代码,这将为您提供正确的日期。
var date = new Date();
function toLocal(date) {
var local = new Date(date);
local.setMinutes(date.getMinutes() - date.getTimezoneOffset());
return local.toJSON();
}
function toJSONLocal(date) {
var local = new Date(date);
local.setMinutes(date.getMinutes() - date.getTimezoneOffset());
return local.toJSON().slice(0, 10);
}
// check out your devtools console
console.log(date.toJSON());
console.log(date.toISOString());
console.log(toLocal(date));
console.log(toJSONLocal(date));
运行代码片段Hide results展开片段
日期转ISO字符串
日期转JSON
字符串切片
外部示例
解决方案 6:
自定义格式化功能:
对于固定格式,一个简单的函数就可以完成工作。以下示例生成国际格式 YYYY-MM-DD:
function dateToYMD(date) {
var d = date.getDate();
var m = date.getMonth() + 1; //Month from 0 to 11
var y = date.getFullYear();
return '' + y + '-' + (m<=9 ? '0' + m : m) + '-' + (d <= 9 ? '0' + d : d);
}
console.log(dateToYMD(new Date(2017,10,5))); // Nov 5
运行代码片段Hide results展开片段
OP格式可能生成如下:
function dateToYMD(date) {
var strArray=['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
var d = date.getDate();
var m = strArray[date.getMonth()];
var y = date.getFullYear();
return '' + (d <= 9 ? '0' + d : d) + '-' + m + '-' + y;
}
console.log(dateToYMD(new Date(2017,10,5))); // Nov 5
运行代码片段Hide results展开片段
注意:但是,扩展 JavaScript 标准库(例如将此函数添加到 Date 的原型)通常不是一个好主意。
更高级的功能可以根据格式参数生成可配置的输出。
如果编写格式化函数太长,有很多库可以做到这一点。其他一些答案已经列举了它们。但增加依赖性也有其反面。
标准 ECMAScript 格式化函数:
从 ECMAScript 的较新版本开始,该类Date
具有一些特定的格式化功能:
toDateString:依赖于实现,仅显示日期。
https://262.ecma-international.org/#sec-date.prototype.todatestring
new Date().toDateString(); // e.g. "Fri Nov 11 2016"
toISOString:显示 ISO 8601 日期和时间。
https://262.ecma-international.org/#sec-date.prototype.toisostring
new Date().toISOString(); // e.g. "2016-11-21T08:00:00.000Z"
toJSON:JSON 的字符串化器。
https://262.ecma-international.org/#sec-date.prototype.tojson
new Date().toJSON(); // e.g. "2016-11-21T08:00:00.000Z"
toLocaleDateString:依赖于实现,采用区域设置格式的日期。
https://262.ecma-international.org/#sec-date.prototype.tolocaledatestring
new Date().toLocaleDateString(); // e.g. "21/11/2016"
toLocaleString:依赖于实现,采用区域格式的日期和时间。
https://262.ecma-international.org/#sec-date.prototype.tolocalestring
new Date().toLocaleString(); // e.g. "21/11/2016, 08:00:00 AM"
toLocaleTimeString:依赖于实现,采用语言环境格式的时间。
https://262.ecma-international.org/#sec-date.prototype.tolocaletimestring
new Date().toLocaleTimeString(); // e.g. "08:00:00 AM"
toString:日期的通用 toString。
https://262.ecma-international.org/#sec-date.prototype.tostring
new Date().toString(); // e.g. "Fri Nov 21 2016 08:00:00 GMT+0100 (W. Europe Standard Time)"
注意:可以从这些格式生成自定义输出 >
new Date().toISOString().slice(0,10); //return YYYY-MM-DD
示例片段:
console.log("1) "+ new Date().toDateString());
console.log("2) "+ new Date().toISOString());
console.log("3) "+ new Date().toJSON());
console.log("4) "+ new Date().toLocaleDateString());
console.log("5) "+ new Date().toLocaleString());
console.log("6) "+ new Date().toLocaleTimeString());
console.log("7) "+ new Date().toString());
console.log("8) "+ new Date().toISOString().slice(0,10));
运行代码片段Hide results展开片段
指定标准函数的区域设置:
上面列出的一些标准功能依赖于语言环境:
toLocaleDateString()
toLocaleTimeString()
toLocalString()
这是因为不同的文化使用不同的格式,并以不同的方式表达日期或时间。该函数默认将返回其运行的设备上配置的格式,但可以通过设置参数 (ECMA-402) 来指定。
toLocaleDateString([locales[, options]])
toLocaleTimeString([locales[, options]])
toLocaleString([locales[, options]])
//e.g. toLocaleDateString('ko-KR');
第二个参数option
,允许在所选区域内配置更具体的格式。例如,月份可以显示为全文或缩写。
toLocaleString('en-GB', { month: 'short' })
toLocaleString('en-GB', { month: 'long' })
示例片段:
console.log("1) "+ new Date().toLocaleString('en-US'));
console.log("2) "+ new Date().toLocaleString('ko-KR'));
console.log("3) "+ new Date().toLocaleString('de-CH'));
console.log("4) "+ new Date().toLocaleString('en-GB', { hour12: false }));
console.log("5) "+ new Date().toLocaleString('en-GB', { hour12: true }));
运行代码片段Hide results展开片段
有关语言环境的一些良好做法:
大多数人不喜欢日期以外国格式出现,因此,尽可能保留默认语言环境(而不是到处设置“en-US”)。
实现与 UTC 之间的转换可能具有挑战性(考虑 DST、时区不是 1 小时的倍数等)。尽可能使用经过良好测试的库。
不要假设地区与国家有对应关系:许多国家都有许多地区(加拿大、印度等)
避免通过非标准方式检测区域设置。您可以在此处了解多种陷阱:检测键盘布局、通过地理位置检测区域设置等。
解决方案 7:
如果您已经在项目中使用 jQuery UI,您可以这样做:
var formatted = $.datepicker.formatDate("M d, yy", new Date("2014-07-08T09:02:21.377"));
// formatted will be 'Jul 8, 2014'
这里提供了一些可以使用的日期选择器日期格式选项。
解决方案 8:
注意 (2022-10):
toLocaleFormat
已弃用一段时间,并从 Firefox 版本 58 中删除。请参阅toLocaleFormat
我认为你可以使用非标准日期方法toLocaleFormat(formatString)
formatString:strftime()
与C 中的函数所需格式相同的格式字符串。
var today = new Date();
today.toLocaleFormat('%d-%b-%Y'); // 30-Dec-2011
运行代码片段Hide results展开片段
参考:
toLocaleFormat
strftime
解决方案 9:
对于小型一次性程序来说,普通 JavaScript 是最好的选择。
另一方面,如果您需要更多日期信息,MomentJS是一个很好的解决方案。
例如:
moment().format('YYYY-MM-DD HH:m:s'); // now() -> 2015-03-24 14:32:20
moment("20111031", "YYYYMMDD").fromNow(); // 3 years ago
moment("20120620", "YYYYMMDD").fromNow(); // 3 years ago
moment().startOf('day').fromNow(); // 11 hours ago
moment().endOf('day').fromNow(); // in 13 hours
解决方案 10:
在现代浏览器(*)中,您只需执行以下操作:
var today = new Date().toLocaleDateString('en-GB', {
day : 'numeric',
month : 'short',
year : 'numeric'
}).split(' ').join('-');
如果今天执行(2016 年 1 月 24 日),则输出如下:
'24-Jan-2016'
(*) 据 MDN 称,“现代浏览器”是指 Chrome 24+、Firefox 29+、Internet Explorer 11、Edge 12+、Opera 15+ 和 Safari每日构建版。
解决方案 11:
请求的格式在一行中 - 没有库,没有日期方法,只有正则表达式:
var d = (new Date()).toString().replace(/S+s(S+)s(d+)s(d+)s.*/,'$2-$1-$3');
// date will be formatted as "14-Oct-2015" (pass any date object in place of 'new Date()')
在我的测试中,这在主流浏览器(Chrome、Safari、Firefox 和 IE)中都能可靠地运行。正如 @RobG 指出的那样,Date.prototype.toString() 的输出依赖于实现,因此对于国际或非浏览器实现,只需测试输出以确保它在您的 JavaScript 引擎中正常工作即可。您甚至可以添加一些代码来测试字符串输出,并确保它符合您的预期,然后再进行正则表达式替换。
解决方案 12:
打包解决方案: Luxon或date-fns
如果您想使用一个解决方案来满足所有要求,我建议使用 date-fns 或 Luxon。
Luxon 托管在 Moment.js 网站上,并由 Moment.js 开发人员开发,因为 Moment.js 存在开发人员想要解决但无法解决的限制。
安装:
npm install luxon
或yarn add luxon
(访问链接了解其他安装方法)
例子:
luxon.DateTime.fromISO('2010-08-10').toFormat('yyyy-LLL-dd');
产量:
2010 年 8 月 10 日
手动解决方案
使用与 Moment.js、类 DateTimeFormatter (Java)和类 SimpleDateFormat (Java)类似的格式,我实现了一个全面的解决方案formatDate(date, patternStr)
,其中的代码易于阅读和修改。您可以显示日期、时间、上午/下午等。查看代码以获取更多示例。
例子:
formatDate(new Date(), 'EEEE, MMMM d, yyyy HH:mm:ss:S')
(formatDate
在下面的代码片段中实现)
产量:
2018 年 10 月 12 日星期五 18:11:23:445
单击“运行代码片段”来试用代码。
日期和时间模式
yy
= 2 位数年份;yyyy
= 全年
M
= 数字月份;MM
= 2 位月份;MMM
= 短月份名称;MMMM
= 完整月份名称
EEEE
= 完整的星期名称;EEE
= 简短的星期名称
d
= 数字日期;dd
= 2 数字日期
h
= 小时 am/pm;hh
= 2 位数小时 am/pm;H
= 小时;HH
= 2 位数小时
m
= 分钟;mm
= 2 位数分钟;aaa
= AM/PM
s
= 秒;ss
= 2 位秒数
S
= 毫秒
var monthNames = [
"January", "February", "March", "April", "May", "June", "July",
"August", "September", "October", "November", "December"
];
var dayOfWeekNames = [
"Sunday", "Monday", "Tuesday",
"Wednesday", "Thursday", "Friday", "Saturday"
];
function formatDate(date, patternStr){
if (!patternStr) {
patternStr = 'M/d/yyyy';
}
var day = date.getDate(),
month = date.getMonth(),
year = date.getFullYear(),
hour = date.getHours(),
minute = date.getMinutes(),
second = date.getSeconds(),
miliseconds = date.getMilliseconds(),
h = hour % 12,
hh = twoDigitPad(h),
HH = twoDigitPad(hour),
mm = twoDigitPad(minute),
ss = twoDigitPad(second),
aaa = hour < 12 ? 'AM' : 'PM',
EEEE = dayOfWeekNames[date.getDay()],
EEE = EEEE.substr(0, 3),
dd = twoDigitPad(day),
M = month + 1,
MM = twoDigitPad(M),
MMMM = monthNames[month],
MMM = MMMM.substr(0, 3),
yyyy = year + "",
yy = yyyy.substr(2, 2)
;
// checks to see if month name will be used
patternStr = patternStr
.replace('hh', hh).replace('h', h)
.replace('HH', HH).replace('H', hour)
.replace('mm', mm).replace('m', minute)
.replace('ss', ss).replace('s', second)
.replace('S', miliseconds)
.replace('dd', dd).replace('d', day)
.replace('EEEE', EEEE).replace('EEE', EEE)
.replace('yyyy', yyyy)
.replace('yy', yy)
.replace('aaa', aaa);
if (patternStr.indexOf('MMM') > -1) {
patternStr = patternStr
.replace('MMMM', MMMM)
.replace('MMM', MMM);
}
else {
patternStr = patternStr
.replace('MM', MM)
.replace('M', M);
}
return patternStr;
}
function twoDigitPad(num) {
return num < 10 ? "0" + num : num;
}
console.log(formatDate(new Date()));
console.log(formatDate(new Date(), 'dd-MMM-yyyy')); //OP's request
console.log(formatDate(new Date(), 'EEEE, MMMM d, yyyy HH:mm:ss.S aaa'));
console.log(formatDate(new Date(), 'EEE, MMM d, yyyy HH:mm'));
console.log(formatDate(new Date(), 'yyyy-MM-dd HH:mm:ss.S'));
console.log(formatDate(new Date(), 'M/dd/yyyy h:mmaaa'));
运行代码片段Hide results展开片段
感谢@Gerry 提出 Luxon。
解决方案 13:
@Sébastien——替代所有浏览器支持
new Date(parseInt(496407600)*1000).toLocaleDateString('de-DE', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
}).replace(/./g, '/');
文档:
https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
基于 Date.toLocaleDateString 的高阶标记模板文字示例:
const date = new Date(Date.UTC(2020, 4, 2, 3, 23, 16, 738));
const fmt = (dt, lc = "en-US") => (str, ...expr) =>
str.map((str, i) => str + (expr[i]?dt.toLocaleDateString(lc, expr[i]) :'')).join('')
console.log(fmt(date)`${{year: 'numeric'}}-${{month: '2-digit'}}-${{day: '2-digit'}}`);
// expected output: "2020-05-02"
解决方案 14:
好的,我们有了一个叫做Intl的东西,它对于在 JavaScript 中格式化日期非常有用:
您的日期如下:
var date = '10/8/2010';
然后您可以使用 new Date() 更改为 Date,如下所示:
date = new Date(date);
现在,您可以使用如下所示的语言环境列表以任何您喜欢的方式对其进行格式化:
date = new Intl.DateTimeFormat('en-AU').format(date); // Australian date format: "8/10/2010"
date = new Intl.DateTimeFormat('en-US').format(date); // USA date format: "10/8/2010"
date = new Intl.DateTimeFormat('ar-EG').format(date); // Arabic date format: "٨/١٠/٢٠١٠"
如果您确实想要上面提到的格式,您可以执行以下操作:
date = new Date(Date.UTC(2010, 7, 10, 0, 0, 0));
var options = {year: "numeric", month: "short", day: "numeric"};
date = new Intl.DateTimeFormat("en-AU", options).format(date).replace(/s/g, '-');
结果将是:
"10-Aug-2010"
更多信息请参阅Intl API和Intl.DateTimeFormat文档。
解决方案 15:
构造函数Date
(和Date.parse()
)在构造日期时仅接受一种格式作为参数,即ISO 8601:
// new Date('YYYY-MM-DDTHH:mm:ss.sssZ')
const date = new Date('2017-08-15')
但由于浏览器的差异和不一致,强烈建议不要从字符串解析(MDN 建议不要使用日期字符串创建日期)。
推荐的替代方法是直接从数字数据构建日期实例,如下所示:
new Date(2017, 7, 15) // Month is zero-indexed
这就是解析。现在,要将日期格式化为所需的字符串,您有多个 Date 对象原生的选项(尽管我相信没有一个符合您所需的格式):
date.toString() // 'Wed Jan 23 2019 17:23:42 GMT+0800 (Singapore Standard Time)'
date.toDateString() // 'Wed Jan 23 2019'
date.toLocaleString() // '23/01/2019, 17:23:42'
date.toGMTString() // 'Wed, 23 Jan 2019 09:23:42 GMT'
date.toUTCString() // 'Wed, 23 Jan 2019 09:23:42 GMT'
date.toISOString() // '2019-01-23T09:23:42.079Z'
对于其他格式选项,恐怕您必须求助于Moment.js、day.js等库。
本文感谢Zell Liew提供的日期格式提示。
解决方案 16:
使用 ECMAScript Edition 6(ES6/ES2015)字符串模板:
let d = new Date();
let formatted = `${d.getFullYear()}-${d.getMonth() + 1}-${d.getDate()}`;
如果需要更改分隔符:
const delimiter = '/';
let formatted = [d.getFullYear(), d.getMonth() + 1, d.getDate()].join(delimiter);
解决方案 17:
这是我刚刚编写的一些代码,用于处理我正在从事的项目的日期格式。它模仿了 PHP 日期格式功能以满足我的需求。请随意使用它,它只是扩展了现有的 Date() 对象。这可能不是最优雅的解决方案,但它可以满足我的需求。
var d = new Date();
d_string = d.format("m/d/Y h:i:s");
/**************************************
* Date class extension
*
*/
// Provide month names
Date.prototype.getMonthName = function(){
var month_names = [
'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December'
];
return month_names[this.getMonth()];
}
// Provide month abbreviation
Date.prototype.getMonthAbbr = function(){
var month_abbrs = [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec'
];
return month_abbrs[this.getMonth()];
}
// Provide full day of week name
Date.prototype.getDayFull = function(){
var days_full = [
'Sunday',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday'
];
return days_full[this.getDay()];
};
// Provide full day of week name
Date.prototype.getDayAbbr = function(){
var days_abbr = [
'Sun',
'Mon',
'Tue',
'Wed',
'Thur',
'Fri',
'Sat'
];
return days_abbr[this.getDay()];
};
// Provide the day of year 1-365
Date.prototype.getDayOfYear = function() {
var onejan = new Date(this.getFullYear(),0,1);
return Math.ceil((this - onejan) / 86400000);
};
// Provide the day suffix (st,nd,rd,th)
Date.prototype.getDaySuffix = function() {
var d = this.getDate();
var sfx = ["th","st","nd","rd"];
var val = d%100;
return (sfx[(val-20)%10] || sfx[val] || sfx[0]);
};
// Provide Week of Year
Date.prototype.getWeekOfYear = function() {
var onejan = new Date(this.getFullYear(),0,1);
return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7);
}
// Provide if it is a leap year or not
Date.prototype.isLeapYear = function(){
var yr = this.getFullYear();
if ((parseInt(yr)%4) == 0){
if (parseInt(yr)%100 == 0){
if (parseInt(yr)%400 != 0){
return false;
}
if (parseInt(yr)%400 == 0){
return true;
}
}
if (parseInt(yr)%100 != 0){
return true;
}
}
if ((parseInt(yr)%4) != 0){
return false;
}
};
// Provide Number of Days in a given month
Date.prototype.getMonthDayCount = function() {
var month_day_counts = [
31,
this.isLeapYear() ? 29 : 28,
31,
30,
31,
30,
31,
31,
30,
31,
30,
31
];
return month_day_counts[this.getMonth()];
}
// format provided date into this.format format
Date.prototype.format = function(dateFormat){
// break apart format string into array of characters
dateFormat = dateFormat.split("");
var date = this.getDate(),
month = this.getMonth(),
hours = this.getHours(),
minutes = this.getMinutes(),
seconds = this.getSeconds();
// get all date properties ( based on PHP date object functionality )
var date_props = {
d: date < 10 ? '0'+date : date,
D: this.getDayAbbr(),
j: this.getDate(),
l: this.getDayFull(),
S: this.getDaySuffix(),
w: this.getDay(),
z: this.getDayOfYear(),
W: this.getWeekOfYear(),
F: this.getMonthName(),
m: month < 10 ? '0'+(month+1) : month+1,
M: this.getMonthAbbr(),
n: month+1,
t: this.getMonthDayCount(),
L: this.isLeapYear() ? '1' : '0',
Y: this.getFullYear(),
y: this.getFullYear()+''.substring(2,4),
a: hours > 12 ? 'pm' : 'am',
A: hours > 12 ? 'PM' : 'AM',
g: hours % 12 > 0 ? hours % 12 : 12,
G: hours > 0 ? hours : "12",
h: hours % 12 > 0 ? hours % 12 : 12,
H: hours,
i: minutes < 10 ? '0' + minutes : minutes,
s: seconds < 10 ? '0' + seconds : seconds
};
// loop through format array of characters and add matching data else add the format character (:,/, etc.)
var date_string = "";
for(var i=0;i<dateFormat.length;i++){
var f = dateFormat[i];
if(f.match(/[a-zA-Z]/g)){
date_string += date_props[f] ? date_props[f] : '';
} else {
date_string += f;
}
}
return date_string;
};
/*
*
* END - Date class extension
*
************************************/
解决方案 18:
这可能有助于解决问题:
var d = new Date();
var options = {
day: 'numeric',
month: 'long',
year: 'numeric'
};
console.log(d.toLocaleDateString('en-ZA', options));
运行代码片段Hide results展开片段
解决方案 19:
不使用任何外部库的 JavaScript 解决方案:
var now = new Date()
months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
var formattedDate = now.getDate() + "-" + months[now.getMonth()] + "-" + now.getFullYear()
alert(formattedDate)
解决方案 20:
TypeScript 版本
它可以轻松增强以支持所需的任何格式字符串。当像这样的通用解决方案如此容易创建,并且日期格式在应用程序中如此频繁出现时,我不建议在整个应用程序中硬编码日期格式代码。这更难阅读并隐藏您的意图。格式字符串清楚地表明了您的意图。
原型函数
interface Date {
format(formatString: string): string;
}
Date.prototype.format = function (formatString: string): string {
return Object.entries({
YYYY: this.getFullYear(),
YY: this.getFullYear().toString().substring(2),
yyyy: this.getFullYear(),
yy: this.getFullYear().toString().substring(2),
MMMM: this.toLocaleString('default', { month: 'long' }),
MMM: this.toLocaleString('default', { month: 'short' }),
MM: (this.getMonth() + 1).toString().padStart(2, '0'),
M: this.getMonth() + 1,
DDDD: this.toLocaleDateString('default', { weekday: 'long' }),
DDD: this.toLocaleDateString('default', { weekday: 'short' }),
DD: this.getDate().toString().padStart(2, '0'),
D: this.getDate(),
dddd: this.toLocaleDateString('default', { weekday: 'long' }),
ddd: this.toLocaleDateString('default', { weekday: 'short' }),
dd: this.getDate().toString().padStart(2, '0'),
d: this.getDate(),
HH: this.getHours().toString().padStart(2, '0'), // military
H: this.getHours().toString(), // military
hh: (this.getHours() % 12).toString().padStart(2, '0'),
h: (this.getHours() % 12).toString(),
mm: this.getMinutes().toString().padStart(2, '0'),
m: this.getMinutes(),
SS: this.getSeconds().toString().padStart(2, '0'),
S: this.getSeconds(),
ss: this.getSeconds().toString().padStart(2, '0'),
s: this.getSeconds(),
TTT: this.getMilliseconds().toString().padStart(3, '0'),
ttt: this.getMilliseconds().toString().padStart(3, '0'),
AMPM: this.getHours() < 13 ? 'AM' : 'PM',
ampm: this.getHours() < 13 ? 'am' : 'pm',
}).reduce((acc, entry) => {
return acc.replace(entry[0], entry[1].toString())
}, formatString)
}
演示
function unitTest() {
var d: Date = new Date()
console.log(d.format('MM/dd/yyyy hh:mm:ss')) // 12/14/2022 03:38:31
console.log(d.format('yyyy-MM-dd HH:mm:ss')) // 2022-12-14 15:38:31
}
unitTest()
JavaScript 版本
是一样的。只需删除接口,以及冒号后面的类型名称及其关联的冒号即可。
片段
显示代码片段
Date.prototype.format = function(formatString) {
return Object.entries({
YYYY: this.getFullYear(),
YY: this.getFullYear().toString().substring(2),
yyyy: this.getFullYear(),
yy: this.getFullYear().toString().substring(2),
MMMM: this.toLocaleString('default', { month: 'long' }),
MMM: this.toLocaleString('default', { month: 'short' }),
MM: (this.getMonth() + 1).toString().padStart(2, '0'),
M: this.getMonth() + 1,
DDDD: this.toLocaleDateString('default', { weekday: 'long' }),
DDD: this.toLocaleDateString('default', { weekday: 'short' }),
DD: this.getDate().toString().padStart(2, '0'),
D: this.getDate(),
dddd: this.toLocaleDateString('default', { weekday: 'long' }),
ddd: this.toLocaleDateString('default', { weekday: 'short' }),
dd: this.getDate().toString().padStart(2, '0'),
d: this.getDate(),
HH: this.getHours().toString().padStart(2, '0'), // military
H: this.getHours().toString(), // military
hh: (this.getHours() % 12).toString().padStart(2, '0'),
h: (this.getHours() % 12).toString(),
mm: this.getMinutes().toString().padStart(2, '0'),
m: this.getMinutes(),
SS: this.getSeconds().toString().padStart(2, '0'),
S: this.getSeconds(),
ss: this.getSeconds().toString().padStart(2, '0'),
s: this.getSeconds(),
TTT: this.getMilliseconds().toString().padStart(3, '0'),
ttt: this.getMilliseconds().toString().padStart(3, '0'),
AMPM: this.getHours() < 13 ? 'AM' : 'PM',
ampm: this.getHours() < 13 ? 'am' : 'pm',
}).reduce((acc, entry) => {
return acc.replace(entry[0], entry[1].toString())
}, formatString)
}
function unitTest() {
var d = new Date()
console.log(d.format('MM/dd/yyyy hh:mm:ss')) // 12/14/2022 03:38:31
console.log(d.format('yyyy-MM-dd HH:mm:ss')) // 2022-12-14 15:38:31
}
unitTest()
Run code snippetHide resultsExpand snippet
解决方案 21:
在 JavaScript 中格式化 DateTime 的一个有用且灵活的方法是Intl.DateTimeFormat
:
var date = new Date();
var options = { year: 'numeric', month: 'short', day: '2-digit'};
var _resultDate = new Intl.DateTimeFormat('en-GB', options).format(date);
// The _resultDate is: "12 Oct 2017"
// Replace all spaces with - and then log it.
console.log(_resultDate.replace(/ /g,'-'));
结果是: "12-Oct-2017"
可以使用选项参数定制日期和时间格式。
该Intl.DateTimeFormat
对象是启用语言敏感的日期和时间格式的对象的构造函数。
句法
new Intl.DateTimeFormat([locales[, options]])
Intl.DateTimeFormat.call(this[, locales[, options]])
参数
区域设置
可选。带有 BCP 47 语言标记的字符串,或此类字符串的数组。有关 locales 参数的一般形式和解释,请参阅 Intl 页。允许使用以下 Unicode 扩展键:
nu
Numbering system. Possible values include: "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt".
ca
Calendar. Possible values include: "buddhist", "chinese", "coptic", "ethioaa", "ethiopic", "gregory", "hebrew", "indian", "islamic", "islamicc", "iso8601", "japanese", "persian", "roc".
选项
可选。具有以下部分或全部属性的对象:
本地匹配器
要使用的区域设置匹配算法。可能的值是"lookup"
和"best fit"
;默认值是"best fit"
。有关此选项的信息,请参阅 Intl 页面。
时区
要使用的时区。实现必须识别的唯一值是"UTC"
;默认值是运行时的默认时区。实现还可以识别 IANA 时区数据库的时区名称,例如"Asia/Shanghai"
、"Asia/Kolkata"
、"America/New_York"
。
小时12
是否使用 12 小时制(而不是 24 小时制)。可能的值是true
和false
;默认值取决于语言环境。
格式匹配器
要使用的格式匹配算法。可能的值是"basic"
和"best fit"
;默认值是"best fit"
。有关此属性的使用信息,请参阅以下段落。
以下属性描述了格式化输出中使用的日期时间组件及其所需的表示形式。实现需要至少支持以下子集:
weekday, year, month, day, hour, minute, second
weekday, year, month, day
year, month, day
year, month
month, day
hour, minute, second
hour, minute
实现可能支持其他子集,请求将根据所有可用的子集表示组合进行协商,以找到最佳匹配。此协商有两种算法可用,由 formatMatcher 属性选择:完全指定的"basic"
算法和依赖于实现的“最佳匹配”算法。
平日
星期几的表示。可能的值有"narrow"
、"short"
、"long"
。
时代
时代的代表。可能的值有"narrow"
、"short"
、"long"
。
年
年份的表示形式。可能的值有"numeric"
、"2-digit"
。
月
月份的表示形式。可能的值包括"numeric"
、"2-digit"
、"narrow"
、"short"
、"long"
。
天
表示日期。可能的值有"numeric"
、"2-digit"
。
小时
小时的表示形式。可能的值有"numeric"
、"2-digit"
。
分钟
分钟的表示形式。可能的值有"numeric"
、"2-digit"
。
第二
秒的表示。可能的值是"numeric"
、"2-digit"
。
时区名称
时区名称的表示形式。可能值为"short"
、"long"
。每个日期时间组件属性的默认值为 未定义,但如果所有组件属性均未定义,则年、月、日假定为"numeric"
。
在线查询
更多细节
解决方案 22:
new Date().toLocaleDateString()
// "3/21/2018"
运行代码片段Hide results展开片段
更多文档请访问developer.mozilla.org
解决方案 23:
针对这个问题我们有很多解决方案,但我认为其中最好的是 Moment.js。所以我个人建议使用 Moment.js 进行日期和时间操作。
console.log(moment().format('DD-MMM-YYYY'));
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script>
运行代码片段Hide results展开片段
解决方案 24:
如果您在代码中使用 jQuery UI,则有一个名为的内置函数formatDate()
。我以这种方式使用它来格式化今天的日期:
var testdate = Date();
testdate = $.datepicker.formatDate( "d-M-yy",new Date(testdate));
alert(testdate);
您可以在 jQuery UI 文档中看到 许多其他格式化日期的示例。
解决方案 25:
这就是我实现 npm 插件的方法
var monthNames = [
"January", "February", "March",
"April", "May", "June", "July",
"August", "September", "October",
"November", "December"
];
var Days = [
"Sunday", "Monday", "Tuesday", "Wednesday",
"Thursday", "Friday", "Saturday"
];
var formatDate = function(dt,format){
format = format.replace('ss', pad(dt.getSeconds(),2));
format = format.replace('s', dt.getSeconds());
format = format.replace('dd', pad(dt.getDate(),2));
format = format.replace('d', dt.getDate());
format = format.replace('mm', pad(dt.getMinutes(),2));
format = format.replace('m', dt.getMinutes());
format = format.replace('MMMM', monthNames[dt.getMonth()]);
format = format.replace('MMM', monthNames[dt.getMonth()].substring(0,3));
format = format.replace('MM', pad(dt.getMonth()+1,2));
format = format.replace(/M(?![ao])/, dt.getMonth()+1);
format = format.replace('DD', Days[dt.getDay()]);
format = format.replace(/D(?!e)/, Days[dt.getDay()].substring(0,3));
format = format.replace('yyyy', dt.getFullYear());
format = format.replace('YYYY', dt.getFullYear());
format = format.replace('yy', (dt.getFullYear()+"").substring(2));
format = format.replace('YY', (dt.getFullYear()+"").substring(2));
format = format.replace('HH', pad(dt.getHours(),2));
format = format.replace('H', dt.getHours());
return format;
}
pad = function(n, width, z) {
z = z || '0';
n = n + '';
return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
}
解决方案 26:
您应该看看DayJs, 它是 momentJs 的重制版,但采用模块化架构,因此更轻便。
具有相同现代 API 的 Moment.js 的快速 2kB 替代品
Day.js 是一个极简的 JavaScript 库,它使用与 Moment.js 高度兼容的 API 来解析、验证、操作和显示适用于现代浏览器的日期和时间。如果您使用 Moment.js,那么您已经知道如何使用 Day.js。
var date = Date.now();
const formatedDate = dayjs(date).format("YYYY-MM-DD")
console.log(formatedDate);
<script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.8.16/dayjs.min.js" crossorigin="anonymous"></script>
运行代码片段Hide results展开片段
解决方案 27:
受到JD Smith的奇妙的正则表达式解决方案的启发,我突然有了这个令人头脑发热的想法:
var D = Date().toString().split(" ");
console.log(D[2] + "-" + D[1] + "-" + D[3]);
运行代码片段Hide results展开片段
解决方案 28:
var today = new Date();
var formattedToday = today.toLocaleDateString() + ' ' + today.toLocaleTimeString();
解决方案 29:
对于任何寻求真正简单的 ES6 解决方案来复制、粘贴和采用的人来说:
const dateToString = d => `${d.getFullYear()}-${('00' + (d.getMonth() + 1)).slice(-2)}-${('00' + d.getDate()).slice(-2)}`
// how to use:
const myDate = new Date(Date.parse('04 Dec 1995 00:12:00 GMT'))
console.log(dateToString(myDate)) // 1995-12-04
运行代码片段Hide results展开片段
解决方案 30:
截至 2019 年,您似乎可以让 toLocaleDateString 仅返回某些部分,然后您可以根据需要将它们连接起来:
var date = new Date();
console.log(date.toLocaleDateString("en-US", { day: 'numeric' })
+ "-"+ date.toLocaleDateString("en-US", { month: 'short' })
+ "-" + date.toLocaleDateString("en-US", { year: 'numeric' }) );
> 16-Nov-2019
console.log(date.toLocaleDateString("en-US", { month: 'long' })
+ " " + date.toLocaleDateString("en-US", { day: 'numeric' })
+ ", " + date.toLocaleDateString("en-US", { year: 'numeric' }) );
> November 16, 2019
- 2024年20款好用的项目管理软件推荐,项目管理提效的20个工具和技巧
- 2024年开源项目管理软件有哪些?推荐5款好用的项目管理工具
- 项目管理软件有哪些?推荐7款超好用的项目管理工具
- 项目管理软件哪个最好用?盘点推荐5款好用的项目管理工具
- 项目管理软件有哪些最好用?推荐6款好用的项目管理工具
- 项目管理软件有哪些,盘点推荐国内外超好用的7款项目管理工具
- 2024项目管理软件排行榜(10类常用的项目管理工具全推荐)
- 项目管理软件排行榜:2024年项目经理必备5款开源项目管理软件汇总
- 2024年常用的项目管理软件有哪些?推荐这10款国内外好用的项目管理工具
- 项目管理必备:盘点2024年13款好用的项目管理软件