JavaScript 날짜 형식을 지정하는 방법

JavaScript에서 날짜 개체를 어떻게 형식화하여 인쇄 할 수 10-Aug-2010있습니까?

사용자 정의 구분 날짜 형식 DateTimeFormat의 경우 ECMAScript Internationalization API의 일부인 객체 에서 날짜 (또는 시간) 구성 요소를 가져온 다음 원하는 구분 기호로 문자열을 수동으로 만들어야합니다.

이를 위해 다음을 사용할 수 있습니다 DateTimeFormat#formatToParts.

const date = new Date('2010-08-05')
const dateTimeFormat = new Intl.DateTimeFormat('en', { year: 'numeric', month: 'short', day: '2-digit' }) 
const [{ value: month },,{ value: day },,{ value: year }] = dateTimeFormat .formatToParts(date ) 

console.log(`${day}-${month}-${year }`)
console.log(`${day}👠${month}👢${year}`) // just for fun

또한의 부분을 당겨 수있는 DateTimeFormat하나씩 사용 DateTimeFormat#format하지만,이 방법을 사용하면 월 2020대로 떨어져 있음을 유의 버그 는 분, 초에 앞에 0에 올 때 ECMAScript를 구현에서 (이 버그 위의 방법으로 우회합니다).

const d = new Date('2010-08-05')
const ye = new Intl.DateTimeFormat('en', { year: 'numeric' }).format(d)
const mo = new Intl.DateTimeFormat('en', { month: 'short' }).format(d)
const da = new Intl.DateTimeFormat('en', { day: '2-digit' }).format(d)

console.log(`${da}-${mo}-${ye}`)

날짜와 시간을 다룰 때 필드의 숨겨진 복잡성 때문에 라이브러리 (예 : moment.js , luxon )를 사용하는 것이 좋습니다 .

위의 솔루션에 사용 된 ECMAScript 국제화 API 는 IE10 ( 2020 년 2 월 0.03 % 글로벌 브라우저 시장 점유율)에서 지원되지 않습니다 .

현재 허용되는 답변보다 서식을 약간 덜 제어해야하는 경우 Date#toLocaleDateString표준 로캘 별 렌더링을 만드는 데 사용할 수 있습니다. locale및 options인수 응용 프로그램이 그 서식 규칙에 사용하는 언어를 지정하고 렌더링의 일부 사용자 정의를 허용 할 수 있습니다.

옵션 주요 예 :

1. day : 요일을
   나타냅니다.
   가능한 값은 "숫자", "2 자리"입니다.
2. 평일 : 평일을
   나타냅니다.
   가능한 값은 "좁은", "짧은", "긴"입니다.
3. 연도 : 연도를
   나타냅니다.
   가능한 값은 "숫자", "2 자리"입니다.
4. 월 : 월을
   나타냅니다.
   가능한 값은 "숫자", "2 자리", "좁은", "짧은", "긴"입니다.
5. 시간 : 시간을
   나타냅니다.
   가능한 값은 "숫자", "2 자리"입니다.
6. 분 : 분을 나타냅니다.
   가능한 값은 "숫자", "2 자리"입니다.
7. 초 :
   초를 나타냅니다.
   가능한 값은 "숫자", 2 자리 숫자입니다.

이 모든 키는 선택 사항입니다. 요구 사항에 따라 옵션 값 수를 변경할 수 있으며 이는 각 날짜 시간 기간의 존재를 반영합니다.

참고 : 컨텐츠 옵션 만 구성하고 여전히 현재 로케일을 사용하려는 null경우 첫 번째 매개 변수를 전달 하면 오류가 발생합니다. undefined대신 사용하십시오 .

다른 언어의 경우 :

1. "en-US": 영어
2. "hi-IN": 힌디어
3. "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

toLocaleString()동일한 목적으로이 방법을 사용할 수도 있습니다 . 유일한 차이점은이 기능은 옵션을 전달하지 않은 시간을 제공한다는 것입니다.

// Example
9/17/2016, 1:21:34 PM

참고 문헌 :

• toLocaleString()

• toLocaleDateString()

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의 날짜 형식

http://jsfiddle.net/phZr7/1/

빠르게 일반 자바 스크립트 사용을 사용하여 날짜를 포맷해야하는 경우 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

또는 0으로 채워야하는 경우 :

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

글쎄, 오늘 날짜 는 2012-06-23과 같은 MySQL 친화적 인 날짜 문자열 로 변환 하고 해당 문자열을 내 쿼리 중 하나에서 매개 변수로 사용하는 것이 었습니다. 내가 찾은 간단한 해결책은 다음과 같습니다.

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);
}

하루의 시작 / 끝에이 코드를 실행하는 경우 올바른 날짜를 제공합니다.

• 예 : http://jsfiddle.net/simo/sapuhzmm/
• Date.toISOString
• Date.toJSON
• String.slice

맞춤 형식 지정 기능 :

고정 형식의 경우 간단한 기능으로 작업이 가능합니다. 다음 예제는 국제 형식 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

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

참고 : 그러나 JavaScript 표준 라이브러리를 확장하는 것은 좋지 않습니다 (예 :이 함수를 Date 프로토 타입에 추가).

보다 고급 기능은 형식 매개 변수를 기반으로 구성 가능한 출력을 생성 할 수 있습니다.

포맷팅 함수를 작성하는 것이 너무 길면, 그 주위에 많은 라이브러리가 있습니다. 다른 답변은 이미 열거했습니다. 그러나 의존성이 증가함에 따라 이에 대한 대응도 이루어지고 있습니다.

표준 ECMAScript 형식화 기능 :

최신 버전의 ECMAScript 이후 Date클래스에는 몇 가지 특정 형식화 기능이 있습니다.

toDateString : 구현에 따라 다르며 날짜 만 표시하십시오.

http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.todatestring

new Date().toDateString(); // e.g. "Fri Nov 11 2016"

toISOString : ISO 8601 날짜 및 시간을 표시합니다.

http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.toisostring

new Date().toISOString(); // e.g. "2016-11-21T08:00:00.000Z"

toJSON : JSON 용 문자열입니다.

http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tojson

new Date().toJSON(); // e.g. "2016-11-21T08:00:00.000Z"

toLocaleDateString : 구현에 따라 다르며 로캘 형식의 날짜입니다.

http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tolocaledatestring

new Date().toLocaleDateString(); // e.g. "21/11/2016"

toLocaleString : 구현에 따라 달라 지며 날짜 및 시간은 로캘 형식입니다.

http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tolocalestring

new Date().toLocaleString(); // e.g. "21/11/2016, 08:00:00 AM"

toLocaleTimeString : 구현에 따라 다르며 로케일 형식의 시간입니다.

http://www.ecma-international.org/ecma-262/7.0/index.html#sec-date.prototype.tolocaletimestring

new Date().toLocaleTimeString(); // e.g. "08:00:00 AM"

toString : Date의 일반 toString입니다.

http://www.ecma-international.org/ecma-262/7.0/index.html#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));

프로젝트에서 이미 jQuery UI 를 사용하고 있다면 다음과 같이 할 수 있습니다.

var formatted = $.datepicker.formatDate("M d, yy", new Date("2014-07-08T09:02:21.377"));

// formatted will be 'Jul 8, 2014'

재생할 날짜 선택기 날짜 형식 옵션은 여기에서 사용할 수 있습니다 .

비표준 날짜 방법을 사용할 수 있다고 생각합니다.toLocaleFormat(formatString)

formatString :strftime() C 의 함수에서 예상하는 것과 동일한 형식의 형식 문자열

var today = new Date();
today.toLocaleFormat('%d-%b-%Y'); // 30-Dec-2011

참고 문헌 :

• tolocaleformat
• strftime

일반 자바 스크립트는 소규모 원타임 사용자에게 가장 적합합니다.

반면에 더 많은 데이트 자료가 필요하다면 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

최신 브라우저 (*) 에서는 다음을 수행 할 수 있습니다.

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 야간 빌드를 의미 합니다.

date.js를 살펴 보십시오 . 예를 들어, 날짜를 다루는 데 도움이되는 많은 도우미가 추가됩니다.

var date = Date.parse('2010-08-10');
console.log(date.toString('dd-MMM-yyyy'));

시작하기 : http://www.datejs.com/2007/11/27/getting-started-with-datejs/

라이브러리와 Date 메소드를 사용하지 않고 한 줄로 요청 된 형식을 얻을 수 있습니다. 정규식 :

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 엔진에서 바로 작동합니다. 문자열 출력을 테스트하는 코드를 추가하고 정규식 바꾸기를 수행하기 전에 예상과 일치하는지 확인할 수도 있습니다.

@ 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

OK , 우리는 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 설명서 를 참조하십시오 .

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);

패키지 솔루션 : Luxon

하나의 솔루션을 모두 사용하기 위해 Luxon ( Moment.js 의 현대화 된 버전)을 사용하는 것이 좋습니다. .

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, Class DateTimeFormatter (Java) 및 Class SimpleDateFormat (Java) 과 유사한 형식을 사용 하여 포괄적 인 솔루션을 구현했습니다.formatDate(date, patternStr) 하여 코드를 쉽게 읽고 수정할 수 . 날짜, 시간, AM / PM 등을 표시 할 수 있습니다. 자세한 예는 코드를 참조하십시오.

예:

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= 오전 / 오후; hh= 2 자리 시간 오전 / 오후; 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'));

Luxon을 키워 준 @Gerry에게 감사합니다.

다음은 내가 작업중 인 프로젝트의 날짜 형식을 처리하기 위해 작성한 코드입니다. 그것은 내 필요에 맞게 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
 * 
 ************************************/

외부 라이브러리를 사용하지 않는 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)

new Date().toLocaleDateString()

// "3/21/2018"

developer.mozilla.org 에서 추가 문서

코드에서 jQuery UI를 사용하는 경우라는 내장 함수가 formatDate()있습니다. 오늘 날짜 형식을 지정하는 데이 방법을 사용하고 있습니다.

var testdate = Date();
testdate = $.datepicker.formatDate( "d-M-yy",new Date(testdate));
alert(testdate);

jQuery UI 문서에서 다른 날짜 형식의 예제를 볼 수 있습니다 .

우리는 이것에 대한 많은 솔루션을 가지고 있지만 그중 가장 좋은 것은 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>

JavaScript에서 DateTimes를 형식화하는 데 유용하고 유연한 방법은 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 페이지를 참조하십시오. 다음과 같은 유니 코드 확장 키가 허용됩니다.

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; 기본값은 로케일에 따라 다릅니다.

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".

연대

시대의 표현. 가능한 값은 "narrow", "short", "long".

년

연도를 나타냅니다. 가능한 값은 "numeric", "2-digit"입니다.

달

월을 나타냅니다. 가능한 값은 "numeric", "2-digit", "narrow", "short", "long".

일

오늘의 표현. 가능한 값은 "numeric", "2-digit"입니다.

시

시간을 나타냅니다. 가능한 값은 "numeric", "2-digit"입니다.

분

분을 나타냅니다. 가능한 값은 "numeric", "2-digit"입니다.

둘째

두 번째 표현. 가능한 값은 "numeric", "2-digit"입니다.

timeZoneName

시간대 이름을 나타냅니다. 가능한 값은 "short", "long"입니다. 각 날짜-시간 구성 요소 속성의 기본값은 정의되어 있지 않지만 모든 구성 요소 속성이 정의되어 있지 않으면 년, 월 및 일이로 간주됩니다 "numeric".

온라인 확인

자세한 내용은

이 문제에 도움이 될 수 있습니다.

var d = new Date();

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

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

이것이 내 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;
}

var today = new Date();
var formattedToday = today.toLocaleDateString() + ' ' + today.toLocaleTimeString();

Sugar.js는 Date.format 메소드를 포함하여 Date 객체에 대한 확장 성이 뛰어납니다 .

설명서의 예 :

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

Date.create().format('{12hr}:{mm}{tt}')

복사, 붙여 넣기 및 채택을위한 매우 간단한 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

2019 년 현재 특정 부분 만 반환하도록 LocaleDateString을 얻을 수 있으며 원하는대로 결합 할 수 있습니다.

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

당신은 DayJs 를 보아야합니다 그것은 momentJs 의 리메이크이지만 모듈 형 아키텍처는 매우 가볍습니다.

동일한 최신 API를 사용하여 Moment.js에 대한 빠른 2kB 대안

Day.js는 Moment.js 호환 API를 사용하여 최신 브라우저의 날짜 및 시간을 구문 분석, 유효성 검사, 조작 및 표시하는 미니멀리즘 JavaScript 라이브러리입니다. 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>

"2010 년 8 월 10 일"을 구하려면 다음을 시도하십시오.

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을 참조하십시오 .