Vous vous apprêtez à lire un tutoriel rédigé par un membre de ce site. Malgré tout le soin que ce membre a pu apporter au tutoriel, nous ne pouvons pas garantir que les informations contenues sur cette page sont exactes à 100%. Merci de garder cela en tête lorsque vous lirez cette page ;o)
L'objet
Date va, comme son nom l'indique, nous permettre d'avoir accès à la date, mais également à l'heure.
Il peut servir à l'afficher dans un coin de la page
(et non pas une énorme horloge horrible qui suit la souris 
), mais aussi à chronométrer le temps de visite d'une page ou bien le temps d'exécution d'un script JS.
Pour récupérer l'heure et la date actuelle, rien de compliqué : il suffit de créer une instance de cet objet, elle sera initialisée avec l'heure courante (qui est l'heure du PC du visiteur).
Code : JavaScript
Maintenant qu'on a notre objet, on peut lire chaque propriété (l'heure, l'année, ...) via les fonctions présentées plus bas.
Il est aussi possible d'initialiser l'objet à une autre date, qu'on indiquera sous forme de paramètres, comme ceci...
Code : JavaScript1 | var uneDate = new Date(annee, mois, jour, heure, minute, seconde);
|
Si les derniers paramètres ne sont pas précisés, ils sont mis à
0 :
Code : JavaScript1 | var uneAutreDate = new Date(annee, mois, jour);
|
Il est également possible de l'initialiser en donnant le nombre de millisecondes depuis le 01/01/1970, 0h00 :
Code : JavaScript1 | var derniereDate = new Date(millisecondes);
|
Passons maintenant aux méthodes, pour savoir que faire de notre nouvel objet.
getTime()
Description
Cette méthode renvoie le nombre de millisecondes écoulées entre le 01/01/1970 et la date.
Utile pour chronométrer un script, par exemple.
Exemple
Justement, chronométrons un petit script...
Code : JavaScript 1
2
3
4
5
6
7
8
9
10
11 | var debut = new Date();
// le script ici
var i=0
while(i < 1234567)
i++;
// fin du script
var fin = new Date();
tempsMs = fin.getTime() - debut.getTime();
alert("Le script a mis " + tempsMs/1000 + " secondes.");
|
Les
new Date() servent à récupérer la date et l'heure à laquelle ils sont appelés. On en place donc un au début et un à la fin du script, et on fait la différence des
getTime().
setTime(x)
Description
Modifie la date, en indiquant le nombre de millisecondes écoulées entre le 01/01/1970 et la date.
C'est un très bon format pour stocker une date (dans un cookie, par exemple) : on enregistre uniquement le nombre de millisecondes (cf.
getTime()), qui permettra ensuite de retrouver la date ; quand besoin est, on demande à JS de re-créer notre date à partir de ce nombre.
Exemple
Code : JavaScript1
2 | var uneDate = new Date();
uneDate.setTime(1234567890);
|
On peut ensuite récupérer le jour, l'heure, etc. avec les méthodes présentées ci-après.
getTimezoneOffset()
Description
Retourne le décalage horaire, en minutes.
Exemple
Code : JavaScript1
2
3
4 | var date = new Date();
var decalage = date.getTimezoneOffset();
if(decalage > 0)
alert("Vous avez " + decalage + " minutes d'avance sur les gens de Greenwich.");
|
On va enfin lire l'heure !
Il est possible de reconstituer l'heure grâce aux méthodes qui nous permettent d'accéder au nombre de minutes, de secondes, etc.
Comme il n'y a pas grand chose à dire de ces fonctions, nous vous proposons une fonction qui affiche l'heure.
Quelques petites remarques cependant...
Noms des jours et des mois
Comme il a été dit, les jours de la semaine et les mois sont retournés sous forme de nombres.
Mais si on veut leur nom, comment faire ?
Pour cela, il est judicieux d'utiliser un tableau, ce qui est d'autant plus simple que les nombres commencent justement à 0.
On aura donc :
Code : JavaScript1
2 | var jours = new Array("dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi");
var mois = new Array("janvier", "fevrier", "mars", "avril", "mai", "juin", "juillet", "aout", "septembre", "octobre", "novembre", "decembre");
|
Attention aux minutes !
Un autre point "sensible" : lorsque les minutes sont inférieures à 10. En effet, afficher
1h1 n'est vraiment pas élégant...
Ceci est aussi valable pour les jours et les mois : on n'affiche pas
1/1/1970.
Il faudra donc penser à rajouter un zéro devant (sous forme de chaîne de caractères).
Créons notre fonction
On va maintenant créer deux fonctions supplémentaires retournant la date pour l'une et l'heure pour l'autre, en francais.
Pour la date, on va renvoyer une chaîne de caractères de la forme "mardi 5 avril 1988".
Code : JavaScript 1
2
3
4
5
6
7
8
9
10
11
12
13
14 | function dateFr()
{
// les noms de jours / mois
var jours = new Array("dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi");
var mois = new Array("janvier", "fevrier", "mars", "avril", "mai", "juin", "juillet", "aout", "septembre", "octobre", "novembre", "decembre");
// on recupere la date
var date = new Date();
// on construit le message
var message = jours[date.getDay()] + " "; // nom du jour
message += date.getDate() + " "; // numero du jour
message += mois[date.getMonth()] + " "; // mois
message += date.getFullYear();
return message;
}
|
Pour l'heure, on se contentera d'un "
1h01".
Code : JavaScript1
2
3
4
5
6
7
8
9 | function heure()
{
var date = new Date();
var heure = date.getHours();
var minutes = date.getMinutes();
if(minutes < 10)
minutes = "0" + minutes;
return heure + "h" + minutes;
}
|
Maintenant, il ne vous reste plus qu'à créer un petit champ de formulaire pour afficher l'heure.
Pour qu'elle soit actualisée automatiquement, il faut utiliser setInterval(fonction, delai) qui appellera fonction toutes les delai millisecondes.
C'est une méthode de l'objet window, elle sera abordée dans le chapitre sur ce dernier.
Tutoriels
Communauté
Mon compte
Recherche
Livre d'or
Publicité
.
91 Zéros connectés |
8 requêtes |
0.0626s (0.05s)
