JavaScript – Les dates
Javascript
Introduction
• Pour travailler avec des dates et les manipuler en JavaScript, nous allons utiliser l’objet
natif Date.
• Le constructeur Date() possède en effet de nombreuses méthodes qui vont nous permettre
d’obtenir ou de définir une date.
La date actuelles
• Pour récupérer la date actuelle sous forme littérale, on va tout simplement
utiliser Date().
• Pour afficher cette même date sous forme de nombre (le nombre de millisecondes
écoulées depuis le 1er janvier 1970), on peut utiliser la méthode statique now() du
constructeur Date.
Exemple :
var d1 = Date();
var d2 = Date.now();
console.log('Date 1 = ' + d1);
console.log('Date 2 = ' + d2);
Créer un objet de type date
• Voici un exemple qui montre les différentes façons pour créer une date :
let date1 = new Date();
let date2 = new Date('March 23, 2019 20:00:00');
let date3 = new Date(1553466000000);
let date4 = new Date(2019, 0, 25);
let date5 = new Date(2019, 0, 25,12,30);
document.write('Date 1 : ' + date1 + '<br>Date 2 : ' + date2 +
'<br>Date 3 : ' + date3 + '<br>Date4 : ' + date4);
Les méthodes getters l’objet Date
• getDay() renvoie le jour de la semaine sous forme de chiffre (avec 0 pour dimanche, 1 pour lundi et 6
pour samedi) pour la date spécifiée selon l’heure locale ;
• getDate() renvoie le jour du mois en chiffres pour la date spécifiée selon l’heure locale ;
• getMonth() renvoie le numéro du mois de l’année (avec 0 pour janvier, 1 pour février, 11 pour
décembre) pour la date spécifiée selon l’heure locale ;
• getFullYear() renvoie l’année en 4 chiffres pour la date spécifiée selon l’heure locale ;
• getHours() renvoie l’heure en chiffres pour la date spécifiée selon l’heure locale ;
• getMinutes() renvoie les minutes en chiffres pour la date spécifiée selon l’heure locale ;
• getSeconds() renvoie les secondes en chiffres pour la date spécifiée selon l’heure locale ;
• getMilliseconds() renvoie les millisecondes en chiffres pour la date spécifiée selon l’heure locale.
Les méthodes setters de l’objet Date
• setDate() définissent le jour du mois en chiffres pour la date spécifiée selon l’heure locale ou l’heure UTC ;
• setMonth() définissent le numéro du mois de l’année (avec 0 pour janvier, 1 pour février, 11 pour décembre)
pour la date spécifiée selon l’heure locale ou l’heure UTC ;
• setFullYear() définissent l’année en 4 chiffres pour la date spécifiée selon l’heure locale ou l’heure UTC ;
• setHours() définissent l’heure en chiffres pour la date spécifiée selon l’heure locale ou l’heure UTC ;
• setMinutes() définissent les minutes en chiffres pour la date spécifiée selon l’heure locale ou l’heure UTC ;
• setSeconds() définissent les secondes en chiffres pour la date spécifiée selon l’heure locale ou l’heure UTC ;
• setMilliseconds() définissent les millisecondes en chiffres pour la date spécifiée selon l’heure locale ou l’heure
UTC.
La methode setTimeout
• La méthode setTimeout() permet d’exécuter une fonction ou un bloc de code après
une certaine période définie (à la fin de ce qu’on appelle un « timer »).
• Il va falloir passer deux arguments à cette méthode : une fonction à exécuter et un
nombre en millisecondes qui représente le délai d’exécution de la fonction (le
moment où la fonction doit s’exécuter à partir de l’exécution de setTimeout()).
Exemple de setTimeout
<html><head>
<script type="text/javascript">
function refresh(){
setTimeout('showDate()',1000)
}
function showDate() {
var date = new Date()
var h = date.getHours();
var m = date.getMinutes();
var s = date.getSeconds();
if( h < 10 ){ h = '0' + h; }
if( m < 10 ){ m = '0' + m; }
if( s < 10 ){ s = '0' + s; }
var time = h + ':' + m + ':' + s
document.getElementById('horloge').innerHTML = time;
refresh();
}
</script>
</head>
<body onload=showDate();>
<span id='horloge' style="background-color:#1C1C1C;color:silver;font-size:40px;"></span>
</body></html>
La methode SetInterval()
• setInterval déclenche une opération à intervalles réguliers
• Syntaxe d’utilisation est : setInterval("instructions", délai)
• Exemple :
setInterval("alert(('bip')", 10000);
Affiche un message toutes les dix secondes.
L'action sera recommencée jusqu'à ce que l'on quitte la page ou que clearInterval soit exécutée.
