JavaScriptの日付をフォーマットする方法

JavaScriptでは、日付オブジェクトをどのようにフォーマットして印刷することができ10-Aug-2010ますか？

カスタム区切りの日付形式の場合、DateTimeFormatオブジェクト（ECMAScript国際化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を使用して1つずつパーツを取り出すこともできますがDateTimeFormat#format、この方法を使用する場合、2020年3月の時点で、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を使用して、標準のロケール固有のレンダリングを作成できます。引数は、アプリケーションがその書式設定規則を使用する言語を指定して、レンダリングのいくつかのカスタマイズを許可してみましょう。localeoptions

オプションの主な例：

1. 日：日
   の表現。
   可能な値は、「数値」、「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のdateformat

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

あなたはすぐに、プレーン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

まあ、私が欲しかったのは、今日の日付を2012-06-23のようなMySQLフレンドリーな日付文字列に変換し、その文字列を私のクエリの1つでパラメーターとして使用することでした。私が見つけた簡単な解決策はこれです：

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：日付の一般的な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

プレーン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

最新のブラウザー（*）では、次のようにできます。

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/

ライブラリも日付メソッドも使用せずに、正規表現を使用して、要求された形式を1行で取得できます。

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、最近JavaScriptで日付をフォーマットするのに非常に役立つIntlと呼ばれるものを手に入れました：

以下の日付：

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のWebサイトでホストされ、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桁の時間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'));

Luxonをご利用いただきありがとうございます。

これは、私が取り組んでいるプロジェクトの日付フォーマットを処理するために書いたばかりのコードです。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で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"

日付と時刻の形式は、options引数を使用してカスタマイズできます。

Intl.DateTimeFormatオブジェクトは、言語に敏感な日付と時刻のフォーマットを有効にするオブジェクトのコンストラクタです。

構文

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

パラメーター

ロケール

オプション。BCP 47言語タグを含む文字列、またはそのような文字列の配列。ロケール引数の一般的な形式と解釈につ​​いては、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"。

時間12

（24時間制ではなく）12時間制を使用するかどうか。可能な値は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

実装は他のサブセットをサポートする場合があり、リクエストは、最適な一致を見つけるために、利用可能なすべてのサブセットと表現の組み合わせに対してネゴシエートされます。このネゴシエーションには2つのアルゴリズムが利用可能であり、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年の時点では、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

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を参照してください。