JavaScriptは日付に先行ゼロを追加します


437

このスクリプトを作成して、10日前の日付をdd / mm / yyyyの形式で計算します。

var MyDate = new Date();
var MyDateString = new Date();
MyDate.setDate(MyDate.getDate()+10);
MyDateString = MyDate.getDate() + '/' + (MyDate.getMonth()+1) + '/' + MyDate.getFullYear();

これらのルールをスクリプトに追加することで、日と月のコンポーネントの先頭にゼロを付けて日付を表示する必要があります。うまく動かないようです。

if (MyDate.getMonth < 10)getMonth = '0' + getMonth;

そして

if (MyDate.getDate <10)get.Date = '0' + getDate;

誰かがスクリプトにこれらを挿入する場所を教えてくれれば、本当にありがたいです。


6
慣例として、変数名の最初の文字を小文字にし、オブジェクト/プロトタイプ用にキャメルケースを予約する必要があります。
zykadelic 2014年

:YYYY-MM-DD形式が受け入れ可能であるならば、これは非常に良い答えでしょうstackoverflow.com/a/28431880/1717535
ファビアンSnauwaert

回答:


1351

これを試してください:http : //jsfiddle.net/xA5B7/

var MyDate = new Date();
var MyDateString;

MyDate.setDate(MyDate.getDate() + 20);

MyDateString = ('0' + MyDate.getDate()).slice(-2) + '/'
             + ('0' + (MyDate.getMonth()+1)).slice(-2) + '/'
             + MyDate.getFullYear();

編集:

説明するために、.slice(-2)私たちに与え、最後の文字列の2つの文字が。

したがって、何があっても"0"、日または月に追加して、最後の2つを要求できます。これらは常に必要な2つだからです。

したがって、がMyDate.getMonth()返される場合は9、次のようになります。

("0" + "9") // Giving us "09"

したがって、これを追加.slice(-2)すると、次の2つの文字が得られます。

("0" + "9").slice(-2)
"09"

ただし、MyDate.getMonth()が返された場合は10、次のようになります。

("0" + "10") // Giving us "010"

したがって、追加.slice(-2)すると最後の2文字が得られます。または、

("0" + "10").slice(-2)
"10"

27
Forked-日付形式YYYY-MM-DD jsfiddle.net/j6qJp/1 誰かにとって便利かもしれません。ありがとう
tomexx 2012年

3
これが@Alerossが以下に提供する答えよりも優れている理由を誰かが説明できますか?明確に明らかなパッド機能と比較して、それが何をするかはすぐには明らかではありません。
クラウディオ

2
言うまでもなく、この例では、
2014

3
@DazManCat:それはそれがすることになっていることです。コードは、現在の日付に20日を追加することから始まります。MyDate.setDate(MyDate.getDate() + 20);
クッキーモンスター14

3
@ n00bと@Phil Cooperは、JavaScriptルーチンのタイミングのインとアウトについての議論にこだわることなくslice()、受け入れられた回答の手法は、@ Alerosのpad()手法よりも1/10秒ほど速いことがわかり ました100万回の反復。jsFiddle。「あなたのお金を払って、あなたの選んでください」。
Karl

105

以下は、JavaScriptのNumberプロトタイプを拡張する必要のない、カスタムの「パッド」関数を使用したMozilla Developer Network のDateオブジェクトドキュメントの例です。彼らが例として与える便利な機能は

function pad(n){return n<10 ? '0'+n : n}

そして、それはコンテキストで使用されています。

/* use a function for the exact format desired... */
function ISODateString(d){
    function pad(n){return n<10 ? '0'+n : n}
    return d.getUTCFullYear()+'-'
    + pad(d.getUTCMonth()+1)+'-'
    + pad(d.getUTCDate())+'T'
    + pad(d.getUTCHours())+':'
    + pad(d.getUTCMinutes())+':'
    + pad(d.getUTCSeconds())+'Z'
}

var d = new Date();
console.log(ISODateString(d)); // prints something like 2009-09-28T19:03:12Z

3
それを行う非常に素晴らしい方法。受け入れられた答えは本当にいいと思いますが、私の意見ではこれはもっとすっきりしています
Binke

1
これにより、予期しないバグが発生し、10未満の文字列と10以上の数値が出力される可能性があります
David Fregoli

@DavidFregoli、これらの日付から文字列への関数はすべて文字列を返すため、文字列を入力すると、文字列padのみが出力されます。
ローマー2017

55

これを行う新しいモダンな方法はを使用toLocaleDateStringすることです。これにより、適切なローカリゼーションで日付をフォーマットできるだけでなく、フォーマットオプションを渡して目的の結果をアーカイブすることもできます。

var date = new Date(2018, 2, 1);
var result = date.toLocaleDateString("en-GB", { // you can skip the first argument
  year: "numeric",
  month: "2-digit",
  day: "2-digit",
});
console.log(result);

最初の引数をスキップすると、代わりにブラウザの言語が検出されます。または、2-digit年オプションでも使用できます。

IE10のような古いブラウザをサポートする必要がない場合は、これが最もクリーンな方法です。IE10以前のバージョンは、options引数を認識しません。

注:さらに、toLocaleTimeString日付の時刻をローカライズまたはフォーマットする場合は、もあります。


3
これがまさに私が探していたものです、ありがとう。toLocaleDateStringで利用可能なオプションの詳細については、こちらをご覧ください:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…–
JoseLinares

1
@JoseLinaresこんにちは。このリンクを元に戻していただきありがとうございます。最初の引数をスキップすることができ、IE10はもう関係ないので、ソリューションを一般的なシナリオにとってより魅力的なものにするために私の答えを改善することを決定しました。それを念頭に置いて、私はあなたのリンクを私の答えに含めました。
Martin Braun

@modiX、申し訳ありませんが、コードの間違いで説明が間違っていました。はい、ロケール(最初の変数)はオプションです。
Kanhaiya lal

@Kanhaiyalal心配しないでください。間違いが起こる可能性があります。3人のレビューアのうち2人が間違った編集を承認したことにも驚いただけです。
Martin Braun


29

未来のあなたのために(ECMAScript 2017以降)

解決

"use strict"

const today = new Date()

const year = today.getFullYear()

const month = `${today.getMonth() + 1}`.padStart(2, "0")

const day = `${today.getDate()}`.padStart(2, "0")

const stringDate = [day, month, year].join("/") // 13/12/2017

説明

String.prototype.padStart(targetLength[, padString])できるだけ多くのを追加padStringしてString.prototype、ターゲットの新しい長さになるようにターゲットtargetLength

"use strict"

let month = "9"

month = month.padStart(2, "0") // "09"

let byte = "00000100"

byte = byte.padStart(8, "0") // "00000100"

4
これはES2017またはES8の一部です。したがって、「ES6 +」はES6およびES7の一部ではないため、「ES6 +」と言うのは誤りです。
Noel Llevares

これは技術的にする必要があり.padStart(2, '0')ますが、活字体使用している場合を除き、それは問題とはならないでしょうが、2番目のパラメータは、文字列であるため、
bmaupin

あなたは正しい、私は私の答えを編集します。
アミンNAIRI

11
Number.prototype.padZero= function(len){
 var s= String(this), c= '0';
 len= len || 2;
 while(s.length < len) s= c + s;
 return s;
}

//使用中で:

(function(){
 var myDate= new Date(), myDateString;
 myDate.setDate(myDate.getDate()+10);

 myDateString= [myDate.getDate().padZero(),
 (myDate.getMonth()+1).padZero(),
 myDate.getFullYear()].join('/');

 alert(myDateString);
})()

/*  value: (String)
09/09/2010
*/

10

私はこれを行う最も短い方法を見つけました:

 MyDateString.replace(/(^|\D)(\d)(?!\d)/g, '$10$2');

すべての孤独な1桁に先行ゼロを追加します


私はこの解決策が好きです、多分そこで何が起こるのか少し明確にできますか?
Gobliins

7
var MyDate = new Date();
var MyDateString = '';
MyDate.setDate(MyDate.getDate());
var tempoMonth = (MyDate.getMonth()+1);
var tempoDate = (MyDate.getDate());
if (tempoMonth < 10) tempoMonth = '0' + tempoMonth;
if (tempoDate < 10) tempoDate = '0' + tempoDate;
MyDateString = tempoDate + '/' + tempoMonth + '/' + MyDate.getFullYear();

5

三項演算子を使用して、「if」ステートメントのように日付をフォーマットできます。

例えば:

var MyDate = new Date();
MyDate.setDate(MyDate.getDate()+10);
var MyDateString = (MyDate.getDate() < 10 ? '0' + MyDate.getDate() : MyDate.getDate()) + '/' + ((d.getMonth()+1) < 10 ? '0' + (d.getMonth()+1) : (d.getMonth()+1)) + '/' + MyDate.getFullYear();

そう

(MyDate.getDate() < 10 ? '0' + MyDate.getDate() : MyDate.getDate())

ifステートメントに似ています。getDate()が10未満の値を返した場合、 '0' +日付を返します。10を超える場合は日付を返します(先頭を追加する必要がないため) 0)。今月も同じです。

編集:getMonthが0で始まることを忘れたので、それを考慮して+1を追加しました。もちろん、d.getMonth()<9:と言うこともできますが、+ 1を使用すると理解しやすくなると考えました。


+1を説明していただきありがとう
ブライアンA

5

この問題を解決するにはslice、JavaScript を使用する別の方法があります。

var d = new Date();
var datestring = d.getFullYear() + "-" + ("0"+(d.getMonth()+1)).slice(-2) +"-"+("0" + d.getDate()).slice(-2);

datestring期待どおりの形式の返却日:2019-09-01

dateformatライブラリを使用する別のアプローチ:https : //github.com/felixge/node-dateformat


「JavaScript」のスペルには注意してください。
バジルブルク

3

生活を楽にして、Moment.jsにいくつかのサンプルコードを使用します。

var beginDateTime = moment()
  .format('DD-MM-YYYY HH:mm')
  .toString();

// Now will print 30-06-2015 17:55
console.log(beginDateTime);

4
moment.js->ここでは0.3kサイズのソリューションと比較して、19.8kのコードのbcosは適切ではありません。
MarcoZen 2016

3
function formatDate(jsDate){
  // add leading zeroes to jsDate when days or months are < 10.. 
  // i.e.
  //     formatDate(new Date("1/3/2013")); 
  // returns
  //    "01/03/2103"
  ////////////////////
  return (jsDate.getDate()<10?("0"+jsDate.getDate()):jsDate.getDate()) + "/" + 
      ((jsDate.getMonth()+1)<10?("0"+(jsDate.getMonth()+1)):(jsDate.getMonth()+1)) + "/" + 
      jsDate.getFullYear();
}

3

日付をフォーマットするパラメーターとしてオプションを提供できます。最初のパラメータは必要のないロケール用で、2番目はオプション用です。詳細については、 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateStringをご覧ください。

var date = new Date(Date.UTC(2012, 1, 1, 3, 0, 0));
var options = { year: 'numeric', month: '2-digit', day: '2-digit' };
console.log(date.toLocaleDateString(undefined,options));

1
提案ありがとうございます。
MJ55

2

私はこの質問の正解を、複数の先行ゼロを追加できる関数にラップしましたが、デフォルトでは1ゼロを追加します。

function zeroFill(nr, depth){
  depth = (depth === undefined)? 1 : depth;

  var zero = "0";
  for (var i = 0; i < depth; ++i) {
    zero += "0";
  }

  return (zero + nr).slice(-(depth + 1));
}

2桁以下の数値のみを扱う場合、これもアプローチです。

function zeroFill(i) {
    return (i < 10 ? '0' : '') + i
  }

1

組み込み関数を使用してパディングを行う別のオプション(ただし、コードが非常に長くなります):

myDateString = myDate.getDate().toLocaleString('en-US', {minimumIntegerDigits: 2})
  + '/' + (myDate.getMonth()+1).toLocaleString('en-US', {minimumIntegerDigits: 2})
  + '/' + myDate.getFullYear();

// '12/06/2017'

また、正規表現で文字列を操作する:

var myDateString = myDate.toISOString().replace(/T.*/, '').replace(/-/g, '/');

// '2017/06/12'

ただし、年は最初に、日は最後に表示されることに注意してください。


これが一番気に入りました:myDate.getDate()。toLocaleString( 'en-US'、{minimumIntegerDigits:2})
Max Alexander Hanna

1

@modiXの回答に追加すると、これが機能します...空のままにしないでください

today.toLocaleDateString("default", {year: "numeric", month: "2-digit", day: "2-digit"})

1

これは、この状況に対処するための非常に簡単な例です。

var mydate = new Date();

var month = (mydate.getMonth().toString().length < 2 ? "0"+mydate.getMonth().toString() :mydate.getMonth());

var date = (mydate.getDate().toString().length < 2 ? "0"+mydate.getDate().toString() :mydate.getDate());

var year = mydate.getFullYear();

console.log("Format Y-m-d : ",year+"-"+month+"-" + date);

console.log("Format Y/m/d : ",year+"/"+month+"/" + date);


0

以下は、構成を抽出し、構成をフックしDate.protoypeて適用することを目的としています。

Array時間チャンクを格納するためにを使用しましpush() thisた。Dateオブジェクトとして使用すると、反復する長さが返されます。完了したらjoin、そのreturn値を使用できます。

これはかなり速く動作するようです:0.016ms

// Date protoype
Date.prototype.formatTime = function (options) {
    var i = 0,
        time = [],
        len = time.push(this.getHours(), this.getMinutes(), this.getSeconds());

    for (; i < len; i += 1) {
        var tick = time[i];
        time[i] = tick < 10 ? options.pad + tick : tick;
    }

    return time.join(options.separator);
};

// Setup output
var cfg = {
    fieldClock: "#fieldClock",
    options: {
        pad: "0",
        separator: ":",
        tick: 1000
    }
};

// Define functionality
function startTime() {
    var clock = $(cfg.fieldClock),
        now = new Date().formatTime(cfg.options);

    clock.val(now);
    setTimeout(startTime, cfg.options.tick);
}

// Run once
startTime();

デモ: http : //jsfiddle.net/tive/U4MZ3/


0

私がやろうとしていることは、次のような独自のカスタム日付ヘルパーを作成することです:

var DateHelper = {
    addDays : function(aDate, numberOfDays) {
        aDate.setDate(aDate.getDate() + numberOfDays); // Add numberOfDays
        return aDate;                                  // Return the date
    },
    format : function format(date) {
        return [
           ("0" + date.getDate()).slice(-2),           // Get day and pad it with zeroes
           ("0" + (date.getMonth()+1)).slice(-2),      // Get month and pad it with zeroes
           date.getFullYear()                          // Get full year
        ].join('/');                                   // Glue the pieces together
    }
}

// With this helper, you can now just use one line of readable code to :
// ---------------------------------------------------------------------
// 1. Get the current date
// 2. Add 20 days
// 3. Format it
// 4. Output it
// ---------------------------------------------------------------------
document.body.innerHTML = DateHelper.format(DateHelper.addDays(new Date(), 20));

このフィドルも参照してください)


0

必要に応じて、先行ゼロを許可するパディングを追加し、選択した区切り文字を文字列として使用して連結します。

Number.prototype.padLeft = function(base,chr){
        var  len = (String(base || 10).length - String(this).length)+1;
        return len > 0? new Array(len).join(chr || '0')+this : this;
    }

var d = new Date(my_date);
var dformatted = [(d.getMonth()+1).padLeft(), d.getDate().padLeft(), d.getFullYear()].join('/');

0

@John Henckelが示唆するように、toISOString()メソッドの使用を開始すると、物事が簡単になります

const dateString = new Date().toISOString().split('-');
const year = dateString[0];
const month = dateString[1];
const day = dateString[2].split('T')[0];

console.log(`${year}-${month}-${day}`);


0
 let date = new Date();
 let dd = date.getDate();//day of month

 let mm = date.getMonth();// month
 let yyyy = date.getFullYear();//day of week
 if (dd < 10) {//if less then 10 add a leading zero
     dd = "0" + dd;
   }
 if (mm < 10) {
    mm = "0" + mm;//if less then 10 add a leading zero
  }

何をしようとしているかを簡単に説明することもできます。
Shiv Kumar Baghel

0

基本的な機能のためにこれを試してください、ライブラリは必要ありません

Date.prototype.CustomformatDate = function() {
 var tmp = new Date(this.valueOf());
 var mm = tmp.getMonth() + 1;
 if (mm < 10) mm = "0" + mm;
 var dd = tmp.getDate();
 if (dd < 10) dd = "0" + dd;
 return mm + "/" + dd + "/" + tmp.getFullYear();
};

0
function pad(value) {
    return value.tostring().padstart(2, 0);
}

let d = new date();
console.log(d);
console.log(`${d.getfullyear()}-${pad(d.getmonth() + 1)}-${pad(d.getdate())}t${pad(d.gethours())}:${pad(d.getminutes())}:${pad(d.getseconds())}`);

2
このコードは質問に答えることがありますが、問題を解決する方法や理由に関する追加のコンテキストを提供すると、回答の長期的な価値が向上します。
レオパル

0

元の文字列を変更せずに、文字列のセクションを抽出して新しい文字列として返すString.slice()を使用できます。

const currentDate = new Date().toISOString().slice(0, 10) // 2020-04-16

または、Moment.jsなどのlibを使用して日付をフォーマットすることもできます。

const moment = require("moment")
const currentDate = moment().format("YYYY-MM-DD") // 2020-04-16
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.