Comparez deux dates avec JavaScript

Quelqu'un peut-il suggérer un moyen de comparer les valeurs de deux dates supérieures à, inférieures à et non dans le passé en utilisant JavaScript? Les valeurs proviendront des zones de texte.

L' objet Date fera ce que vous voulez - construire un pour chaque date, puis de les comparer en utilisant la >, <, <=ou >=.

Le ==, !=, ===, et les !==opérateurs vous obligent à utiliser date.getTime()comme

var d1 = new Date();
var d2 = new Date(d1);
var same = d1.getTime() === d2.getTime();
var notSame = d1.getTime() !== d2.getTime();

pour être clair, il suffit de vérifier l'égalité directement avec les objets de date ne fonctionnera pas

var d1 = new Date();
var d2 = new Date(d1);

console.log(d1 == d2);   // prints false (wrong!) 
console.log(d1 === d2);  // prints false (wrong!)
console.log(d1 != d2);   // prints true  (wrong!)
console.log(d1 !== d2);  // prints true  (wrong!)
console.log(d1.getTime() === d2.getTime()); // prints true (correct)

Je vous suggère d'utiliser des listes déroulantes ou une forme similaire de saisie de date plutôt que des zones de texte, de peur de vous retrouver dans l'enfer de la validation des entrées.

Le moyen le plus simple de comparer des dates en javascript est de le convertir d'abord en objet Date, puis de comparer ces objets de date.

Ci-dessous vous trouvez un objet avec trois fonctions:

• dates.compare (a, b)

  Renvoie un nombre:

  • -1 si a <b
  • 0 si a = b
  • 1 si a> b
  • NaN si a ou b est une date illégale

• dates.inRange (d, début, fin)

  Renvoie un booléen ou NaN:

  • vrai si d est entre le début et la fin (inclus)
  • false si d est avant le début ou après la fin .
  • NaN si une ou plusieurs dates sont illégales.

• dates.convert

  Utilisé par les autres fonctions pour convertir leur entrée en objet date. L'entrée peut être

  • a date -object: L'entrée est retournée telle quelle.
  • un tableau : interprété comme [année, mois, jour]. REMARQUE le mois est 0-11.
  • un nombre : interprété comme un nombre de millisecondes depuis le 1er janvier 1970 (horodatage)
  • une chaîne : plusieurs formats différents sont pris en charge, comme "AAAA / MM / JJ", "MM / JJ / AAAA", "31 janvier 2009", etc.
  • un objet : interprété comme un objet avec des attributs année, mois et date. REMARQUE le mois est 0-11.

.

// Source: http://stackoverflow.com/questions/497790
var dates = {
    convert:function(d) {
        // Converts the date in d to a date-object. The input can be:
        //   a date object: returned without modification
        //  an array      : Interpreted as [year,month,day]. NOTE: month is 0-11.
        //   a number     : Interpreted as number of milliseconds
        //                  since 1 Jan 1970 (a timestamp) 
        //   a string     : Any format supported by the javascript engine, like
        //                  "YYYY/MM/DD", "MM/DD/YYYY", "Jan 31 2009" etc.
        //  an object     : Interpreted as an object with year, month and date
        //                  attributes.  **NOTE** month is 0-11.
        return (
            d.constructor === Date ? d :
            d.constructor === Array ? new Date(d[0],d[1],d[2]) :
            d.constructor === Number ? new Date(d) :
            d.constructor === String ? new Date(d) :
            typeof d === "object" ? new Date(d.year,d.month,d.date) :
            NaN
        );
    },
    compare:function(a,b) {
        // Compare two dates (could be of any type supported by the convert
        // function above) and returns:
        //  -1 : if a < b
        //   0 : if a = b
        //   1 : if a > b
        // NaN : if a or b is an illegal date
        // NOTE: The code inside isFinite does an assignment (=).
        return (
            isFinite(a=this.convert(a).valueOf()) &&
            isFinite(b=this.convert(b).valueOf()) ?
            (a>b)-(a<b) :
            NaN
        );
    },
    inRange:function(d,start,end) {
        // Checks if date in d is between dates in start and end.
        // Returns a boolean or NaN:
        //    true  : if d is between start and end (inclusive)
        //    false : if d is before start or after end
        //    NaN   : if one or more of the dates is illegal.
        // NOTE: The code inside isFinite does an assignment (=).
       return (
            isFinite(d=this.convert(d).valueOf()) &&
            isFinite(start=this.convert(start).valueOf()) &&
            isFinite(end=this.convert(end).valueOf()) ?
            start <= d && d <= end :
            NaN
        );
    }
}

Comparez <et >comme d'habitude, mais tout ce qui implique =doit utiliser un +préfixe. Ainsi:

var x = new Date('2013-05-23');
var y = new Date('2013-05-23');

// less than, greater than is fine:
x < y; => false
x > y; => false
x === y; => false, oops!

// anything involving '=' should use the '+' prefix
// it will then compare the dates' millisecond values
+x <= +y;  => true
+x >= +y;  => true
+x === +y; => true

J'espère que cela t'aides!

Les opérateurs relationnels < <= > >=peuvent être utilisés pour comparer des dates JavaScript:

var d1 = new Date(2013, 0, 1);
var d2 = new Date(2013, 0, 2);
d1 <  d2; // true
d1 <= d2; // true
d1 >  d2; // false
d1 >= d2; // false

Cependant, les opérateurs d'égalité == != === !==ne peuvent pas être utilisés pour comparer (la valeur de) les dates car :

• Deux objets distincts ne sont jamais égaux pour des comparaisons strictes ou abstraites.
• Une expression comparant des objets n'est vraie que si les opérandes font référence au même objet.

Vous pouvez comparer la valeur des dates pour l'égalité à l'aide de l'une de ces méthodes:

var d1 = new Date(2013, 0, 1);
var d2 = new Date(2013, 0, 1);
/*
 * note: d1 == d2 returns false as described above
 */
d1.getTime() == d2.getTime(); // true
d1.valueOf() == d2.valueOf(); // true
Number(d1)   == Number(d2);   // true
+d1          == +d2;          // true

Les deux Date.getTime()et Date.valueOf()retournent le nombre de millisecondes depuis le 1er janvier 1970 à 00h00 UTC. La Numberfonction et l' +opérateur unaire appellent les valueOf()méthodes dans les coulisses.

La méthode de loin la plus simple consiste à soustraire une date de l'autre et à comparer le résultat.

var oDateOne = new Date();
var oDateTwo = new Date();

alert(oDateOne - oDateTwo === 0);
alert(oDateOne - oDateTwo < 0);
alert(oDateOne - oDateTwo > 0);

En comparant les dates en JavaScript est assez facile ... JavaScript a intégré le système de comparaison pour les dates qui le rend si facile à faire la comparaison ...

Suivez simplement ces étapes pour comparer la valeur de 2 dates, par exemple vous avez 2 entrées qui ont chacune une valeur de date Stringet vous pour les comparer ...

1. vous avez 2 valeurs de chaîne que vous obtenez à partir d'une entrée et vous souhaitez les comparer, elles sont comme ci-dessous:

var date1 = '01/12/2018';
var date2 = '12/12/2018';

2. Ils doivent Date Objectêtre comparés en tant que valeurs de date, alors convertissez-les simplement en date, en utilisant new Date(), je les réattribue simplement pour des raisons d'explication, mais vous pouvez le faire comme vous le souhaitez:

date1 = new Date(date1);
date2 = new Date(date2);

3. Maintenant, comparez-les simplement en utilisant> < >= <=

date1 > date2;  //false
date1 < date2;  //true
date1 >= date2; //false
date1 <= date2; //true

Comparer uniquement le jour (en ignorant la composante temps):

Date.prototype.sameDay = function(d) {
  return this.getFullYear() === d.getFullYear()
    && this.getDate() === d.getDate()
    && this.getMonth() === d.getMonth();
}

Usage:

if(date1.sameDay(date2)) {
    // highlight day on calendar or something else clever
}

quel format?

Si vous construisez un objet Javascript Date , vous pouvez simplement les soustraire pour obtenir une différence de quelques millisecondes (modifier: ou simplement les comparer):

js>t1 = new Date()
Thu Jan 29 2009 14:19:28 GMT-0500 (Eastern Standard Time)
js>t2 = new Date()
Thu Jan 29 2009 14:19:31 GMT-0500 (Eastern Standard Time)
js>t2-t1
2672
js>t3 = new Date('2009 Jan 1')
Thu Jan 01 2009 00:00:00 GMT-0500 (Eastern Standard Time)
js>t1-t3
2470768442
js>t1>t3
true

vous utilisez ce code,

var firstValue = "2012-05-12".split('-');
var secondValue = "2014-07-12".split('-');

 var firstDate=new Date();
 firstDate.setFullYear(firstValue[0],(firstValue[1] - 1 ),firstValue[2]);

 var secondDate=new Date();
 secondDate.setFullYear(secondValue[0],(secondValue[1] - 1 ),secondValue[2]);     

  if (firstDate > secondDate)
  {
   alert("First Date  is greater than Second Date");
  }
 else
  {
    alert("Second Date  is greater than First Date");
  }

Et vérifiez également ce lien http://www.w3schools.com/js/js_obj_date.asp

RÉPONSE COURTE

Voici une fonction qui retourne {boolean} si la démo from dateTime> to dateTime en action

var from = '08/19/2013 00:00'
var to = '08/12/2013 00:00 '

function isFromBiggerThanTo(dtmfrom, dtmto){
   return new Date(dtmfrom).getTime() >=  new Date(dtmto).getTime() ;
}
console.log(isFromBiggerThanTo(from, to)); //true

Explication

jsFiddle

var date_one = '2013-07-29 01:50:00',
date_two = '2013-07-29 02:50:00';
//getTime() returns the number of milliseconds since 01.01.1970.
var timeStamp_date_one = new Date(date_one).getTime() ; //1375077000000 
console.log(typeof timeStamp_date_one);//number 
var timeStamp_date_two = new Date(date_two).getTime() ;//1375080600000 
console.log(typeof timeStamp_date_two);//number 

puisque vous avez maintenant les deux datetime dans le type de nombre, vous pouvez les comparer avec toutes les opérations de comparaison

(>, <, =,! =, ==,! ==,> = ET <=)

alors

Si vous connaissez la C#chaîne de format de date et d'heure personnalisée, cette bibliothèque devrait faire exactement la même chose et vous aider à formater votre date et heure dtmFRM, que vous passiez une chaîne de date et d'heure ou un format Unix.

Usage

var myDateTime = new dtmFRM();

alert(myDateTime.ToString(1375077000000, "MM/dd/yyyy hh:mm:ss ampm"));
//07/29/2013 01:50:00 AM

alert(myDateTime.ToString(1375077000000,"the year is yyyy and the day is dddd"));
//this year is 2013 and the day is Monday

alert(myDateTime.ToString('1/21/2014', "this month is MMMM and the day is dd"));
//this month is january and the day is 21

DEMO

tout ce que vous avez à faire est de passer l'un de ces formats pacifiés dans le jsfichier de bibliothèque

La manière simple est,

var first = '2012-11-21';
var second = '2012-11-03';

if (new Date(first) > new Date(second) {
    .....
}

Remarque - Comparer uniquement la date:

Lorsque nous comparons deux dates en javascript. Cela prend des heures, des minutes et des secondes également à prendre en compte. Donc, si nous devons seulement comparer la date seulement, voici l'approche:

var date1= new Date("01/01/2014").setHours(0,0,0,0);

var date2= new Date("01/01/2014").setHours(0,0,0,0);

Maintenant: if date1.valueOf()> date2.valueOf()fonctionnera comme un charme.

function datesEqual(a, b)
{
   return (!(a>b || b>a))
}

var date = new Date(); // will give you todays date.

// following calls, will let you set new dates.
setDate()   
setFullYear()   
setHours()  
setMilliseconds()   
setMinutes()    
setMonth()  
setSeconds()    
setTime()

var yesterday = new Date();
yesterday.setDate(...date info here);

if(date>yesterday)  // will compare dates

Juste pour ajouter encore une autre possibilité aux nombreuses options existantes, vous pouvez essayer:

if (date1.valueOf()==date2.valueOf()) .....

... qui semble fonctionner pour moi. Bien sûr, vous devez vous assurer que les deux dates ne sont pas indéfinies ...

if ((date1?date1.valueOf():0)==(date2?date2.valueOf():0) .....

De cette façon, nous pouvons nous assurer qu'une comparaison positive est faite si les deux ne sont pas définis également, ou ...

if ((date1?date1.valueOf():0)==(date2?date2.valueOf():-1) .....

... si vous préférez qu'ils ne soient pas égaux.

Via Moment.js

Jsfiddle: http://jsfiddle.net/guhokemk/1/

function compare(dateTimeA, dateTimeB) {
    var momentA = moment(dateTimeA,"DD/MM/YYYY");
    var momentB = moment(dateTimeB,"DD/MM/YYYY");
    if (momentA > momentB) return 1;
    else if (momentA < momentB) return -1;
    else return 0;
}

alert(compare("11/07/2015", "10/07/2015"));

La méthode renvoie 1 si dateTimeAest supérieur àdateTimeB

La méthode renvoie 0 si dateTimeAégal àdateTimeB

La méthode renvoie -1 si dateTimeAest inférieur àdateTimeB

ATTENTION À LA FUSEAU HORAIRE

Une date javascript n'a aucune notion de fuseau horaire . C'est un moment dans le temps (ticks depuis l'époque) avec des fonctions pratiques pour traduire vers et depuis des chaînes dans le fuseau horaire "local". Si vous souhaitez travailler avec des dates à l'aide d'objets de date, comme tout le monde ici, vous voulez que vos dates représentent UTC à minuit au début de la date en question. Il s'agit d'une convention courante et nécessaire qui vous permet de travailler avec des dates indépendamment de la saison ou du fuseau horaire de leur création. Vous devez donc être très vigilant pour gérer la notion de fuseau horaire, en particulier lorsque vous créez votre objet Date UTC à minuit.

La plupart du temps, vous souhaiterez que votre date reflète le fuseau horaire de l'utilisateur. Cliquez si aujourd'hui est votre anniversaire . Les utilisateurs en NZ et aux États-Unis cliquent en même temps et obtiennent des dates différentes. Dans ce cas, faites ceci ...

// create a date (utc midnight) reflecting the value of myDate and the environment's timezone offset.
new Date(Date.UTC(myDate.getFullYear(),myDate.getMonth(), myDate.getDate()));

Parfois, la comparabilité internationale l'emporte sur la précision locale. Dans ce cas, faites ceci ...

// the date in London of a moment in time. Device timezone is ignored.
new Date(Date.UTC(myDate.getUTCYear(), myDate.getyUTCMonth(), myDate.getUTCDate()));

Vous pouvez maintenant comparer directement vos objets de date comme le suggèrent les autres réponses.

Après avoir pris soin de gérer le fuseau horaire lors de la création, vous devez également vous assurer de ne pas afficher le fuseau horaire lors de la reconversion en une représentation sous forme de chaîne. Vous pouvez donc utiliser en toute sécurité ...

• toISOString()
• getUTCxxx()
• getTime() //returns a number with no time or timezone.
• .toLocaleDateString("fr",{timezone:"UTC"}) // whatever locale you want, but ALWAYS UTC.

Et évitez totalement tout le reste, surtout ...

• getYear(), getMonth(),getDate()

Supposons que vous ayez les objets de date A et B, obtenez leur valeur de temps EPOC, puis soustrayez pour obtenir la différence en millisecondes.

var diff = +A - +B;

C'est tout.

Pour comparer deux dates, nous pouvons utiliser la bibliothèque JavaScript date.js qui se trouve à l' adresse : https://code.google.com/archive/p/datejs/downloads

et utilisez la Date.compare( Date date1, Date date2 )méthode et elle renvoie un nombre qui signifie le résultat suivant:

-1 = date1 est inférieure à date2.

0 = les valeurs sont égales.

1 = date1 est supérieure à date2.

Soustrayez deux dates pour obtenir la différence en millisecondes, si vous obtenez 0c'est la même date

function areSameDate(d1, d2){
    return d1 - d2 === 0
}

Afin de créer des dates à partir de texte libre en Javascript, vous devez l'analyser dans l'objet Date ().

Vous pouvez utiliser Date.parse () qui prend du texte libre essaie de le convertir en une nouvelle date, mais si vous avez le contrôle sur la page, je recommanderais d'utiliser des zones de sélection HTML à la place ou un sélecteur de date tel que le contrôle du calendrier YUI ou l' interface utilisateur jQuery Datepicker .

Une fois que vous avez une date, comme d'autres l'ont souligné, vous pouvez utiliser une simple arithmétique pour soustraire les dates et la reconvertir en nombre de jours en divisant le nombre (en secondes) par le nombre de secondes dans une journée (60 * 60 * 24 = 86400).

var date_today=new Date();
var formated_date = formatDate(date_today);//Calling formatDate Function

var input_date="2015/04/22 11:12 AM";

var currentDateTime = new Date(Date.parse(formated_date));
var inputDateTime   = new Date(Date.parse(input_date));

if (inputDateTime <= currentDateTime){
    //Do something...
}

function formatDate(date) {
    var hours = date.getHours();
    var minutes = date.getMinutes();
    var ampm = hours >= 12 ? 'PM' : 'AM';

    hours = hours % 12;
    hours = hours ? hours : 12; // the hour '0' should be '12'
    hours   = hours < 10 ? '0'+hours : hours ;

    minutes = minutes < 10 ? '0'+minutes : minutes;

    var strTime = hours+":"+minutes+ ' ' + ampm;
    return  date.getFullYear()+ "/" + ((date.getMonth()+1) < 10 ? "0"+(date.getMonth()+1) :
    (date.getMonth()+1) ) + "/" + (date.getDate() < 10 ? "0"+date.getDate() :
    date.getDate()) + " " + strTime;
}

Une version améliorée du code posté par "certains"

/* Compare the current date against another date.
 *
 * @param b  {Date} the other date
 * @returns   -1 : if this < b
 *             0 : if this === b
 *             1 : if this > b
 *            NaN : if a or b is an illegal date
*/ 
Date.prototype.compare = function(b) {
  if (b.constructor !== Date) {
    throw "invalid_date";
  }

 return (isFinite(this.valueOf()) && isFinite(b.valueOf()) ? 
          (this>b)-(this<b) : NaN 
        );
};

usage:

  var a = new Date(2011, 1-1, 1);
  var b = new Date(2011, 1-1, 1);
  var c = new Date(2011, 1-1, 31);
  var d = new Date(2011, 1-1, 31);

  assertEquals( 0, a.compare(b));
  assertEquals( 0, b.compare(a));
  assertEquals(-1, a.compare(c));
  assertEquals( 1, c.compare(a));

Si votre format de date est le suivant, vous pouvez utiliser ce code:

var first = '2012-11-21';
var second = '2012-11-03';
if(parseInt(first.replace(/-/g,""),10) > parseInt(second.replace(/-/g,""),10)){
   //...
}

Il vérifiera si le 20121121nombre est supérieur 20121103ou non.

Je stocke généralement Datescomme timestamps(Number)dans les bases de données.

Quand j'ai besoin de comparer, je compare simplement entre ces horodatages ou

convertissez-le en objet de date et comparez-le > <si nécessaire.

Notez que == ou === ne fonctionne pas correctement sauf si vos variables sont des références du même objet Date.

Convertissez d'abord ces objets Date en horodatage (nombre), puis comparez leur égalité.

Date à l'horodatage

var timestamp_1970 = new Date(0).getTime(); // 1970-01-01 00:00:00
var timestamp = new Date().getTime(); // Current Timestamp

Horodatage à ce jour

var timestamp = 0; // 1970-01-01 00:00:00
var DateObject = new Date(timestamp);

Avant de comparer l' Datesobjet, essayez de mettre leurs deux millisecondes à zéro comme Date.setMilliseconds(0);.

Dans certains cas où l' Dateobjet est créé dynamiquement en javascript, si vous continuez à imprimer le Date.getTime(), vous verrez les millisecondes changer, ce qui empêchera l'égalité des deux dates.

Performance

Aujourd'hui 2020.02.27 j'effectue des tests des solutions choisies sur Chrome v80.0, Safari v13.0.5 et Firefox 73.0.1 sur MacOs High Sierra v10.13.6

Conclusions

• les solutions d1==d2(D) et d1===d2(E) sont les plus rapides pour tous les navigateurs
• la solution getTime(A) est plus rapide que valueOf(B) (les deux sont moyennement rapides)
• les solutions F, L, N sont les plus lentes pour tous les navigateurs

Détails

Les solutions d'extraits de code utilisées dans les tests de performances sont présentées ci-dessous. Vous pouvez effectuer un test sur votre machine ICI

function A(d1,d2) {
	return d1.getTime() == d2.getTime();
}

function B(d1,d2) {
	return d1.valueOf() == d2.valueOf();
}

function C(d1,d2) {
	return Number(d1)   == Number(d2);
}

function D(d1,d2) {
	return d1 == d2;
}

function E(d1,d2) {
	return d1 === d2;
}

function F(d1,d2) {
	return (!(d1>d2 || d2>d1));
}

function G(d1,d2) {
	return d1*1 == d2*1;
}

function H(d1,d2) {
	return +d1 == +d2;
}

function I(d1,d2) {
	return !(+d1 - +d2);
}

function J(d1,d2) {
	return !(d1 - d2);
}

function K(d1,d2) {
	return d1 - d2 == 0;
}

function L(d1,d2) {
	return !((d1>d2)-(d1<d2));
}

function M(d1,d2) {
  return d1.getFullYear() === d2.getFullYear()
    && d1.getDate() === d2.getDate()
    && d1.getMonth() === d2.getMonth();
}

function N(d1,d2) {
	return (isFinite(d1.valueOf()) && isFinite(d2.valueOf()) ? !((d1>d2)-(d1<d2)) : false );
}


// TEST

let past= new Date('2002-12-24'); // past
let now= new Date('2020-02-26');  // now

console.log('Code  d1>d2  d1<d2  d1=d2')
var log = (l,f) => console.log(`${l}     ${f(now,past)}  ${f(past,now)}  ${f(now,now)}`);

log('A',A);
log('B',B);
log('C',C);
log('D',D);
log('E',E);
log('G',G);
log('H',H);
log('I',I);
log('J',J);
log('K',K);
log('L',L);
log('M',M);
log('N',N);

p {color: red}

<p>This snippet only presents tested solutions (it not perform tests itself)</p>

Résultats pour chrome

        from_date ='10-07-2012';
        to_date = '05-05-2012';
        var fromdate = from_date.split('-');
        from_date = new Date();
        from_date.setFullYear(fromdate[2],fromdate[1]-1,fromdate[0]);
        var todate = to_date.split('-');
        to_date = new Date();
        to_date.setFullYear(todate[2],todate[1]-1,todate[0]);
        if (from_date > to_date ) 
        {
            alert("Invalid Date Range!\nStart Date cannot be after End Date!")

            return false;
        }

Utilisez ce code pour comparer la date à l'aide de javascript.

Merci D.Jeeva

var curDate=new Date();
var startDate=document.forms[0].m_strStartDate;

var endDate=document.forms[0].m_strEndDate;
var startDateVal=startDate.value.split('-');
var endDateVal=endDate.value.split('-');
var firstDate=new Date();
firstDate.setFullYear(startDateVal[2], (startDateVal[1] - 1), startDateVal[0]);

var secondDate=new Date();
secondDate.setFullYear(endDateVal[2], (endDateVal[1] - 1), endDateVal[0]);
if(firstDate > curDate) {
    alert("Start date cannot be greater than current date!");
    return false;
}
if (firstDate > secondDate) {
    alert("Start date cannot be greater!");
    return false;
}

Voici ce que j'ai fait dans l'un de mes projets,

function CompareDate(tform){
     var startDate = new Date(document.getElementById("START_DATE").value.substring(0,10));
     var endDate = new Date(document.getElementById("END_DATE").value.substring(0,10));

     if(tform.START_DATE.value!=""){
         var estStartDate = tform.START_DATE.value;
         //format for Oracle
         tform.START_DATE.value = estStartDate + " 00:00:00";
     }

     if(tform.END_DATE.value!=""){
         var estEndDate = tform.END_DATE.value;
         //format for Oracle
         tform.END_DATE.value = estEndDate + " 00:00:00";
     }

     if(endDate <= startDate){
         alert("End date cannot be smaller than or equal to Start date, please review you selection.");
         tform.START_DATE.value = document.getElementById("START_DATE").value.substring(0,10);
         tform.END_DATE.value = document.getElementById("END_DATE").value.substring(0,10);
         return false;
     }
}

appelant ceci sur le formulaire onsubmit. J'espère que cela t'aides.