Как отформатировать дату в JavaScript - PullRequest
1732 голосов
/ 24 августа 2010

Как мне отформатировать объект даты JavaScript для печати как 10-Aug-2010?

Ответы [ 49 ]

14 голосов
/ 13 октября 2017

Полезный и гибкий способ форматирования DateTimes в JavaScript: 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"

Форматы даты и времени можно настроить с помощьюАргумент options.

Объект Intl.DateTimeFormat является конструктором для объектов, которые разрешают форматирование даты и времени с учетом языка.

Синтаксис

new Intl.DateTimeFormat([locales[, options]])
Intl.DateTimeFormat.call(this[, locales[, options]])

Параметры

locales

Необязательно.Строка с языковым тегом 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".

Опции

Необязательно.Объект с некоторыми или всеми из следующих свойств:

localeMatcher

Используемый алгоритм сопоставления локали.Возможные значения: "lookup" и "best fit";по умолчанию "best fit".Информацию об этой опции см. На странице Intl.

timeZone

Часовой пояс, который необходимо использовать.Единственные значения, которые должны распознавать реализации, это "UTC";по умолчанию используется часовой пояс по умолчанию.Реализации также могут распознавать имена часовых поясов в базе данных часовых поясов IANA, например "Asia/Shanghai", "Asia/Kolkata", "America/New_York".

hour12

использовать 12-часовое время (в отличие от 24-часового).Возможные значения: true и false;значение по умолчанию зависит от локали.

formatMatcher

Используемый алгоритм сопоставления формата.Возможные значения: "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".

era

Представление эпохи.Возможные значения: "narrow", "short", "long".

year

Представление года.Возможные значения: "numeric", "2-digit".

month

Представление месяца.Возможные значения: "numeric", "2-digit", "narrow", "short", "long".

day

Представление дня.Возможные значения: "numeric", "2-digit".

час

Представление часа.Возможные значения: "numeric", "2-digit".

минута

Представление минуты.Возможные значения: "numeric", "2-digit".

секунда

Представление секунды.Возможные значения: "numeric", "2-digit".

timeZoneName

Представление имени часового пояса.Возможные значения: "short", "long".Значение по умолчанию для каждого свойства компонента даты и времени не определено, но если все свойства компонента не определены, то предполагается, что год, месяц и день равны "numeric".

Проверка в сети

Подробнее

13 голосов
/ 30 июля 2016

Так я реализовал свои плагины для 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;
}
13 голосов
/ 15 января 2018

new Date().toLocaleDateString()

// "3/21/2018"

Дополнительная документация на developer.mozilla.org

11 голосов
/ 08 января 2018

Это может помочь с проблемой:

var d = new Date();

var options = {   
    day: 'numeric',
    month: 'long', 
    year: 'numeric'
};

console.log(d.toLocaleDateString('en-ZA', options));

Date to locate format

9 голосов
/ 10 февраля 2016
var today = new Date();
var formattedToday = today.toLocaleDateString() + ' ' + today.toLocaleTimeString();
8 голосов
/ 23 октября 2012

Sugar.js имеет отличные расширения для объекта Date, включая метод Date.format .

Примеры из документации:

Date.create().format('{Weekday} {Month} {dd}, {yyyy}');

Date.create().format('{12hr}:{mm}{tt}')
8 голосов
/ 07 мая 2018

Для тех, кто ищет действительно простое решение 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
5 голосов
/ 05 февраля 2019

Чтобы получить «10 августа 2010», попробуйте:

var date = new Date('2010-08-10 00:00:00');
date = date.toLocaleDateString(undefined, {day:'2-digit'}) + '-' + date.toLocaleDateString(undefined, {month:'short'}) + '-' + date.toLocaleDateString(undefined, {year:'numeric'})

Информацию о поддержке браузера см. В toLocaleDateString .

.
4 голосов
/ 29 июня 2012

Добавьте плагин jQuery UI на свою страницу:

function DateFormate(dateFormate, datetime) {
    return $.datepicker.formatDate(dateFormate, datetime);
};
4 голосов
/ 31 декабря 2015

Попробуйте это:

function init(){
    var d = new Date();
    var day = d.getDate();
    var x = d.toDateString().substr(4, 3);
    var year = d.getFullYear();
    document.querySelector("#mydate").innerHTML = day + '-' + x + '-' + year;
}
window.onload = init;
<div id="mydate"></div>
...