JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<h1>Before fix:</h1>
<h2>Today is:</h2>
<div id="todayString"></div>
<h2>This date string is fine:</h2>
<div id="goodDateString"></div>
<h2>Double digit handling is wrong:</h2>
<div id="badDateString"></div>
<h1>After fix:</h1>
<h2>Today is:</h2>
<div id="todayStringFixed"></div>
<h2>This date string is fine:</h2>
<div id="goodDateStringFixed"></div>
<h2>Double digit handling is (no longer) wrong:</h2>
<div id="badDateStringFixed"></div>
</body>
JavaScript
//Do not use this method - it doesn't handle double digits correctly
Date.prototype.yyyymmdd = function() {
var mm = this.getMonth() + 1; // getMonth() is zero-based
var dd = this.getDate();
return [this.getFullYear(), !mm[1] && '0', mm, !dd[1] && '0', dd].join(''); // padding
};
var date = new Date();
var todayString = date.yyyymmdd();
var goodDate = new Date(2016, 0, 1);
var goodDateString = goodDate.yyyymmdd();
var badDate = new Date(2016, 11, 25);
var badDateString = badDate.yyyymmdd();
document.getElementById('todayString').innerHTML = todayString;
document.getElementById('goodDateString').innerHTML = goodDateString;
document.getElementById('badDateString').innerHTML = badDateString;
//Use this method - it does handle double digits correctly
Date.prototype.yyyymmdd = function() {
var mm = (this.getMonth() + 1).toString(); // getMonth() is zero-based
var dd = this.getDate().toString();
return [this.getFullYear(), mm.length===2 ? '' : '0', mm, dd.length===2 ? '' : '0', dd].join(''); // padding
};
var date = new Date();
var todayString = date.yyyymmdd();
var goodDate = new Date(2016, 0, 1);
var goodDateString = goodDate.yyyymmdd();
var badDate = new Date(2016, 11, 25);
var badDateString = badDate.yyyymmdd();
document.getElementById('todayStringFixed').innerHTML = todayString;
document.getElementById('goodDateStringFixed').innerHTML = goodDateString;
document.getElementById('badDateStringFixed').innerHTML = badDateString;