¿Cómo obtengo la diferencia entre dos fechas en JavaScript?

111

Estoy creando una aplicación que te permite definir eventos con un marco de tiempo. Quiero completar automáticamente la fecha de finalización cuando el usuario selecciona o cambia la fecha de inicio. Sin embargo, no puedo averiguar cómo obtener la diferencia entre los dos tiempos, y luego cómo crear una nueva fecha de finalización usando esa diferencia.

bdukes
fuente

Respuestas:

73

En JavaScript, las fechas se pueden transformar al número de milisegundos desde epoc llamando al getTime()método o simplemente usando la fecha en una expresión numérica.

Entonces, para obtener la diferencia, solo resta las dos fechas.

Para crear una nueva fecha basada en la diferencia, simplemente pase el número de milisegundos en el constructor.

var oldBegin = ...
var oldEnd = ...
var newBegin = ...

var newEnd = new Date(newBegin + oldEnd - oldBegin);

Esto debería funcionar

EDITAR : error fijo señalado por @bdukes

EDITAR :

Para una explicación de la conducta, oldBegin, oldEnd, y newBeginson Dateinstancias. Llamando a los operadores +y -desencadenará Javascript autocastear y llamará automáticamente al valueOf()método prototipo de esos objetos. Sucede que el valueOf()método se implementa en el Dateobjeto como una llamada a getTime().

Así que básicamente: date.getTime() === date.valueOf() === (0 + date) === (+date)

Vincent Robert
fuente
¿Cuál es el formato requerido para que funcione .getTime () ... Por ejemplo, nueva fecha ('22-12-2012 00:00 '). GetTime () no funcionará ... Alguna idea?
Jimmyt1988
1
Para el análisis de fecha en JS, le sugiero que eche un vistazo a esta pregunta: stackoverflow.com/questions/1576753/…
Vincent Robert
8
¿Se supone que OldBegin, oldEnd y NewBegin son Dateobjetos? Es difícil saber qué tipo de objeto se supone que son, ya que aquí se omite la declaración de variable.
Anderson Green
Además, hay una función que puede usar para sumar o restar fechas en JavaScript: stackoverflow.com/a/1214753/975097
Anderson Green
Tenga cuidado al sumar números y días. Vea mi respuesta a continuación para obtener una explicación
Dan
24

JavaScript admite perfectamente la diferencia de fechas desde el primer momento

var msMinute = 60*1000, 
    msDay = 60*60*24*1000,
    a = new Date(2012, 2, 12, 23, 59, 59),
    b = new Date("2013 march 12");


console.log(Math.floor((b - a) / msDay) + ' full days between');
console.log(Math.floor(((b - a) % msDay) / msMinute) + ' full minutes between');

Ahora algunas trampas. Prueba esto:

console.log(a - 10);
console.log(a + 10);

Entonces, si tiene riesgo de agregar un número y una Fecha, convierta la Fecha en numberdirectamente.

console.log(a.getTime() - 10);
console.log(a.getTime() + 10);

Mi primer ejemplo demuestra el poder del objeto Date, pero en realidad parece ser una bomba de tiempo.

Dan
fuente
Dan, encontré tu ejemplo el más fácil de entender y seguir. Gracias.
Melanie
5
Las "trampas" son en realidad valores predeterminados basados ​​en la especificación del idioma. El operador de resta -convierte los argumentos en números, por lo que Date devuelve su valor de hora. El +operador está sobrecargado, por lo que podría hacer una suma, coerción al número o concatenación. Dado que las fechas obligan a String en este caso, +hace la concatenación. La confusión no es culpa del objeto Date, sino de la sobrecarga de operadores.
RobG
9

Ver DEMO de JsFiddle

    var date1 = new Date();    
    var date2 = new Date("2025/07/30 21:59:00");
    //Customise date2 for your required future time

    showDiff();

function showDiff(date1, date2){

    var diff = (date2 - date1)/1000;
    diff = Math.abs(Math.floor(diff));

    var days = Math.floor(diff/(24*60*60));
    var leftSec = diff - days * 24*60*60;

    var hrs = Math.floor(leftSec/(60*60));
    var leftSec = leftSec - hrs * 60*60;

    var min = Math.floor(leftSec/(60));
    var leftSec = leftSec - min * 60;

    document.getElementById("showTime").innerHTML = "You have " + days + " days " + hrs + " hours " + min + " minutes and " + leftSec + " seconds before death.";

setTimeout(showDiff,1000);
}

para su código HTML:

<div id="showTime"></div>
tika
fuente
4

Si no le importa el componente de tiempo, puede usar .getDate()y .setDate()solo para establecer la parte de la fecha.

Entonces, para establecer su fecha de finalización en 2 semanas después de su fecha de inicio, haga algo como esto:

function GetEndDate(startDate)
{
    var endDate = new Date(startDate.getTime());
    endDate.setDate(endDate.getDate()+14);
    return endDate;
}

Para devolver la diferencia (en días) entre dos fechas, haga lo siguiente:

function GetDateDiff(startDate, endDate)
{
    return endDate.getDate() - startDate.getDate();
}

Finalmente, modifiquemos la primera función para que pueda tomar el valor devuelto por 2nd como parámetro:

function GetEndDate(startDate, days)
{
    var endDate = new Date(startDate.getTime());
    endDate.setDate(endDate.getDate() + days);
    return endDate;
}
Joel Coehoorn
fuente
31
GetDateDiff()romperá las barreras del mes. Por ejemplo, 2011/04/26 y 2011/05/01 devolverán -25, pero el desplazamiento debe ser de 5 días.
nfm
var ds = nueva fecha (2014, 0, 31, 0, 0, 0, 0); var de = nueva fecha (2014, 2, 31, 0, 0, 0, 0); GetDateDiff (ds, de) return 0
Noor
3

Gracias @ Vincent Robert , terminé usando tu ejemplo básico, aunque en realidad lo es newBegin + oldEnd - oldBegin. Aquí está la solución final simplificada:

    // don't update end date if there's already an end date but not an old start date
    if (!oldEnd || oldBegin) {
        var selectedDateSpan = 1800000; // 30 minutes
        if (oldEnd) {
            selectedDateSpan = oldEnd - oldBegin;
        }

       newEnd = new Date(newBegin.getTime() + selectedDateSpan));
    }
bdukes
fuente
1
Es un buen punto explicar por qué a veces está usando getTimey otras no
Dan
2

Dependiendo de sus necesidades, esta función calculará la diferencia entre los 2 días y devolverá un resultado en días decimal.

// This one returns a signed decimal. The sign indicates past or future.

this.getDateDiff = function(date1, date2) {
    return (date1.getTime() - date2.getTime()) / (1000 * 60 * 60 * 24);
}

// This one always returns a positive decimal. (Suggested by Koen below)

this.getDateDiff = function(date1, date2) {
    return Math.abs((date1.getTime() - date2.getTime()) / (1000 * 60 * 60 * 24));
}
Sparkyspider
fuente
1
Colóquelo en una Math.abs()llamada y siempre obtendrá un decimal positivo.
Koen.
1
Buena sugerencia Koen. Eso le da a las personas 2 opciones: solo la diferencia de fecha real como sugirió, o una fecha con el signo que indica si la diferencia es en el pasado o en el futuro. :)
Sparkyspider
Tenga en cuenta que en JavaScript también puede agregar / restar un número en milisegundos date.getTime()para obtener el tiempo en el futuro / pasado. `var nextMinute = new Date (someDate.getTime () + 60 * 1000);
Dan
¿Esto es un error tipográfico? "entre los 2 días". Probablemente entre 2 fechas.
tomazahlin
2

Si usa moment.js, hay una solución más simple, que le dará la diferencia en días en una sola línea de código.

moment(endDate).diff(moment(beginDate), 'days');

Se pueden encontrar detalles adicionales en la página de moment.js

Saludos, Miguel

Miguel Guardo
fuente
1
function compare()
{
  var end_actual_time    = $('#date3').val();

  start_actual_time = new Date();
  end_actual_time = new Date(end_actual_time);

  var diff = end_actual_time-start_actual_time;

  var diffSeconds = diff/1000;
  var HH = Math.floor(diffSeconds/3600);
  var MM = Math.floor(diffSeconds%3600)/60;

  var formatted = ((HH < 10)?("0" + HH):HH) + ":" + ((MM < 10)?("0" + MM):MM)
  getTime(diffSeconds);
}
function getTime(seconds) {
  var days = Math.floor(leftover / 86400);

  //how many seconds are left
  leftover = leftover - (days * 86400);

  //how many full hours fits in the amount of leftover seconds
  var hours = Math.floor(leftover / 3600);

  //how many seconds are left
  leftover = leftover - (hours * 3600);

  //how many minutes fits in the amount of leftover seconds
  var minutes = leftover / 60;

  //how many seconds are left
  //leftover = leftover - (minutes * 60);
  alert(days + ':' + hours + ':' + minutes);
}
dheerendra
fuente
1

código extendido de modificación alternativa.

http://jsfiddle.net/vvGPQ/48/

showDiff();

function showDiff(){
var date1 = new Date("2013/01/18 06:59:00");   
var date2 = new Date();
//Customise date2 for your required future time

var diff = (date2 - date1)/1000;
var diff = Math.abs(Math.floor(diff));

var years = Math.floor(diff/(365*24*60*60));
var leftSec = diff - years * 365*24*60*60;

var month = Math.floor(leftSec/((365/12)*24*60*60));
var leftSec = leftSec - month * (365/12)*24*60*60;    

var days = Math.floor(leftSec/(24*60*60));
var leftSec = leftSec - days * 24*60*60;

var hrs = Math.floor(leftSec/(60*60));
var leftSec = leftSec - hrs * 60*60;

var min = Math.floor(leftSec/(60));
var leftSec = leftSec - min * 60;




document.getElementById("showTime").innerHTML = "You have " + years + " years "+ month + " month " + days + " days " + hrs + " hours " + min + " minutes and " + leftSec + " seconds the life time has passed.";

setTimeout(showDiff,1000);
}
NovaYear
fuente
Agregue más aclaraciones a su respuesta y use un mejor inglés.
Financia la demanda de Monica
Esta solución es incorrecta porque usa 365 días, sin tener en cuenta los años bisiestos.
Sergey Goliney
0
function checkdate() {
    var indate = new Date()
    indate.setDate(dat)
    indate.setMonth(mon - 1)
    indate.setFullYear(year)

    var one_day = 1000 * 60 * 60 * 24
    var diff = Math.ceil((indate.getTime() - now.getTime()) / (one_day))
    var str = diff + " days are remaining.."
    document.getElementById('print').innerHTML = str.fontcolor('blue')
}
Hiren Gamit
fuente
0
<html>
<head>
<script>
function dayDiff()
{
     var start = document.getElementById("datepicker").value;
     var end= document.getElementById("date_picker").value;
     var oneDay = 24*60*60*1000; 
     var firstDate = new Date(start);
     var secondDate = new Date(end);    
     var diffDays = Math.round(Math.abs((firstDate.getTime() - secondDate.getTime())/(oneDay)));
    document.getElementById("leave").value =diffDays ;
 }
</script>
</head>
<body>
<input type="text" name="datepicker"value=""/>
<input type="text" name="date_picker" onclick="function dayDiff()" value=""/>
<input type="text" name="leave" value=""/>
</body>
</html>
Sukanya Suku
fuente
0

este código llena la duración de los años de estudio cuando ingresa la fecha de inicio y la fecha de finalización (califique la fecha acreditada) del estudio y verifique si la duración es menor a un año si la respuesta es sí, la alerta un mensaje tenga en cuenta que hay tres elementos de entrada, el primero txtFromQualifDatey segundotxtQualifDate y tercerotxtStudyYears

mostrará el resultado del número de años con fracción

function getStudyYears()
    {
        if(document.getElementById('txtFromQualifDate').value != '' && document.getElementById('txtQualifDate').value != '')
        {
            var d1 = document.getElementById('txtFromQualifDate').value;

            var d2 = document.getElementById('txtQualifDate').value;

            var one_day=1000*60*60*24;

            var x = d1.split("/");
            var y = d2.split("/");

            var date1=new Date(x[2],(x[1]-1),x[0]);

            var date2=new Date(y[2],(y[1]-1),y[0])

            var dDays = (date2.getTime()-date1.getTime())/one_day;

            if(dDays < 365)
            {
                alert("the date between start study and graduate must not be less than a year !");

                document.getElementById('txtQualifDate').value = "";
                document.getElementById('txtStudyYears').value = "";

                return ;
            }

            var dMonths = Math.ceil(dDays / 30);

            var dYears = Math.floor(dMonths /12) + "." + dMonths % 12;

            document.getElementById('txtStudyYears').value = dYears;
        }
    }
Shareef
fuente
1
Nunca analice las cadenas de fechas para encontrar el año porque la apariencia de las cadenas (especialmente los separadores) difiere entre los navegadores. Utilice el getFullYearque fue diseñado para eso. ------- Consulte la biblioteca datejs en googlecode que posiblemente admita la mayoría de casos de esquina
Dan
gracias por el consejo @Dan, pero funcionó y probó para mí en un proyecto de gobierno real (diferentes navegadores) ¿es tan práctica la programación débil? :)
shareef
0

Si usa objetos Date y luego usa el getTime() función para ambas fechas, le dará sus horas respectivas desde el 1 de enero de 1970 en un valor numérico. A continuación, puede obtener la diferencia entre estos números.

Si eso no le ayuda, consulte la documentación completa: http://www.w3schools.com/jsref/jsref_obj_date.asp

Aaron
fuente
Oh, sí, no me di cuenta, las respuestas debajo de esta tienen como máximo medio año.
Koen.
0

El siguiente código devolverá los días que quedan desde hoy hasta la fecha de futuros.

Dependencias: jQuery y MomentJs.

var getDaysLeft = function (date) {
  var today = new Date();
  var daysLeftInMilliSec = Math.abs(new Date(moment(today).format('YYYY-MM-DD')) - new Date(date));
  var daysLeft = daysLeftInMilliSec / (1000 * 60 * 60 * 24);   
  return daysLeft;
};

getDaysLeft('YYYY-MM-DD');
Vin S
fuente
0
var getDaysLeft = function (date1, date2) {
   var daysDiffInMilliSec = Math.abs(new Date(date1) - new Date(date2));
   var daysLeft = daysDiffInMilliSec / (1000 * 60 * 60 * 24);   
   return daysLeft;
};
var date1='2018-05-18';
var date2='2018-05-25';
var dateDiff = getDaysLeft(date1, date2);
console.log(dateDiff);
Vin S
fuente
0

ESTO ES LO QUE HICE EN MI SISTEMA.

var startTime=("08:00:00").split(":");
var endTime=("16:00:00").split(":");
var HoursInMinutes=((parseInt(endTime[0])*60)+parseInt(endTime[1]))-((parseInt(startTime[0])*60)+parseInt(startTime[1]));
console.log(HoursInMinutes/60);
Sean Cortez
fuente