Add days to JavaScript Date

Add days to JavaScript Date

How to add days to current Date using JavaScript. Does JavaScript have a built in function like .Net’s AddDay?

Solutions/Answers:

Solution 1:

You can create one with:-

Date.prototype.addDays = function(days) {
    var date = new Date(this.valueOf());
    date.setDate(date.getDate() + days);
    return date;
}

var date = new Date();

alert(date.addDays(5));

This takes care of automatically incrementing the month if necessary. For example:

8/31 + 1 day will become 9/1.

The problem with using setDate directly is that it’s a mutator and that sort of thing is best avoided. ECMA saw fit to treat Date as a mutable class rather than an immutable structure.

Solution 2:

Correct Answer:

function addDays(date, days) {
  var result = new Date(date);
  result.setDate(result.getDate() + days);
  return result;
}

Incorrect Answer:

This answer sometimes provides the correct result but very often returns the wrong year and month. The only time this answer works is when the date that you are adding days to happens to have the current year and month.

// Don't do it this way!
function addDaysWRONG(date, days) {
  var result = new Date();
  result.setDate(date.getDate() + days);
  return result;
}

Proof / Example

Check this JsFiddle

// Correct
function addDays(date, days) {
    var result = new Date(date);
    result.setDate(result.getDate() + days);
    return result;
}

// Bad Year/Month
function addDaysWRONG(date, days) {
    var result = new Date();
    result.setDate(date.getDate() + days);
    return result;
}

// Bad during DST
function addDaysDstFail(date, days) {
    var dayms = (days * 24 * 60 * 60 * 1000);
    return new Date(date.getTime() + dayms);    
}

// TEST
function formatDate(date) {
    return (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();
}

$('tbody tr td:first-child').each(function () {
    var $in = $(this);
    var $out = $('<td/>').insertAfter($in).addClass("answer");
    var $outFail = $('<td/>').insertAfter($out);
    var $outDstFail = $('<td/>').insertAfter($outFail);
    var date = new Date($in.text());
    var correctDate = formatDate(addDays(date, 1));
    var failDate = formatDate(addDaysWRONG(date, 1));
    var failDstDate = formatDate(addDaysDstFail(date, 1));

    $out.text(correctDate);
    $outFail.text(failDate);
    $outDstFail.text(failDstDate);
    $outFail.addClass(correctDate == failDate ? "right" : "wrong");
    $outDstFail.addClass(correctDate == failDstDate ? "right" : "wrong");
});
body {
    font-size: 14px;
}

table {
    border-collapse:collapse;
}
table, td, th {
    border:1px solid black;
}
td {
    padding: 2px;
}

.wrong {
    color: red;
}
.right {
    color: green;
}
.answer {
    font-weight: bold;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
    <tbody>
        <tr>
            <th colspan="4">DST Dates</th>
        </tr>
        <tr>
            <th>Input</th>
            <th>+1 Day</th>
            <th>+1 Day Fail</th>
            <th>+1 Day DST Fail</th>
        </tr>
        <tr><td>03/10/2013</td></tr>
        <tr><td>11/03/2013</td></tr>
        <tr><td>03/09/2014</td></tr>
        <tr><td>11/02/2014</td></tr>
        <tr><td>03/08/2015</td></tr>
        <tr><td>11/01/2015</td></tr>
        <tr>
            <th colspan="4">2013</th>
        </tr>
        <tr>
            <th>Input</th>
            <th>+1 Day</th>
            <th>+1 Day Fail</th>
            <th>+1 Day DST Fail</th>
        </tr>
        <tr><td>01/01/2013</td></tr>
        <tr><td>02/01/2013</td></tr>
        <tr><td>03/01/2013</td></tr>
        <tr><td>04/01/2013</td></tr>
        <tr><td>05/01/2013</td></tr>
        <tr><td>06/01/2013</td></tr>
        <tr><td>07/01/2013</td></tr>
        <tr><td>08/01/2013</td></tr>
        <tr><td>09/01/2013</td></tr>
        <tr><td>10/01/2013</td></tr>
        <tr><td>11/01/2013</td></tr>
        <tr><td>12/01/2013</td></tr>
        <tr>
            <th colspan="4">2014</th>
        </tr>
        <tr>
            <th>Input</th>
            <th>+1 Day</th>
            <th>+1 Day Fail</th>
            <th>+1 Day DST Fail</th>
        </tr>
        <tr><td>01/01/2014</td></tr>
        <tr><td>02/01/2014</td></tr>
        <tr><td>03/01/2014</td></tr>
        <tr><td>04/01/2014</td></tr>
        <tr><td>05/01/2014</td></tr>
        <tr><td>06/01/2014</td></tr>
        <tr><td>07/01/2014</td></tr>
        <tr><td>08/01/2014</td></tr>
        <tr><td>09/01/2014</td></tr>
        <tr><td>10/01/2014</td></tr>
        <tr><td>11/01/2014</td></tr>
        <tr><td>12/01/2014</td></tr>
        <tr>
            <th colspan="4">2015</th>
        </tr>
        <tr>
            <th>Input</th>
            <th>+1 Day</th>
            <th>+1 Day Fail</th>
            <th>+1 Day DST Fail</th>
        </tr>
        <tr><td>01/01/2015</td></tr>
        <tr><td>02/01/2015</td></tr>
        <tr><td>03/01/2015</td></tr>
        <tr><td>04/01/2015</td></tr>
        <tr><td>05/01/2015</td></tr>
        <tr><td>06/01/2015</td></tr>
        <tr><td>07/01/2015</td></tr>
        <tr><td>08/01/2015</td></tr>
        <tr><td>09/01/2015</td></tr>
        <tr><td>10/01/2015</td></tr>
        <tr><td>11/01/2015</td></tr>
        <tr><td>12/01/2015</td></tr>
    </tbody>
</table>

Solution 3:

var today = new Date();
var tomorrow = new Date();
tomorrow.setDate(today.getDate()+1);

Be careful, because this can be tricky. When setting “tomorrow”, it only works because it’s current value matches the year and month for “today”. However, setting to a date number like “32” normally will still work just fine to move it to the next month.

Solution 4:

My simple solution is:

nextday=new Date(oldDate.getFullYear(),oldDate.getMonth(),oldDate.getDate()+1);

this solution does not have problem with daylight saving time. Also, one can add/sub any offset for years, months, days etc.

day=new Date(oldDate.getFullYear()-2,oldDate.getMonth()+22,oldDate.getDate()+61);

is correct code.

Solution 5:

These answers seem confusing to me, I prefer:

var ms = new Date().getTime() + 86400000;
var tomorrow = new Date(ms);

getTime() gives us milliseconds since 1970, and 86400000 is the number of milliseconds in a day.
Hence, ms contains milliseconds for the desired date.

Using the millisecond constructor gives the desired date object.

Solution 6:

Try

var someDate = new Date();
var duration = 2; //In Days
someDate.setTime(someDate.getTime() +  (duration * 24 * 60 * 60 * 1000));

Using setDate() to add a date wont solve your problem, try adding some days to a Feb month, if you try to add new days to it, it wont result in what you expected.