Accueil Casino argent reel Meilleur casino Nouveaux casinos Live casino

Premiers pas en JavaScript 35.2 méthodes : objet date

copyleft   See You Why?

---

L'objet Date() (35.1) | | exercices relatifs aux objets Date() (35.8)

---

Contenu

I. Objet date

voir < < < Section précédente

II. Les méthodes de l'objet Date()

Nous savons que la date est stockée dans une variable sous la forme d'une chaîne qui contient le jour, le mois, l'année, l'heure, les minutes, et les secondes. Il sera donc difficile d'accéder à un seul élément d'un objet date avec les simples fonctions de manipulation de chaînes de caractères vues dans la séquence "manipulation de chaines", étant donné que chacun des éléments peut avoir une taille variable. Mais les méthodes de l'objet Date nous fournissent un moyen simple d'accéder à un seul élément, ou bien de le modifier.
Leur syntaxe générale est la suivante :

Objet_Date.Methode()

Reste donc à développer chacune des méthodes applicables à un objet Date().

Nous avions annoncé que nous aborderions :

1. l'objet Date() abordé dans la séquence précédente ;
2. les méthodes de type getTime() ou getDate() pour connaitre la date ;
3. les méthodes pour changer le format de la date, telles que toGMTString() ;
4. les méthodes de type setTime() ou setDate() pour modifier la date ;
5. la méthode setTimeout() pour répéter une action à intervalles réguliers.

B. Les méthodes de type getTime() ou getDate() pour connaitre la date

La date et l'heure comprennent différents éléments tels heure, minute, seconde, milliseconde, jour, date, mois, année qui exigeraient de lourdes manipulations de chaines pour les extraire... JS met à notre disposition les méthodes suivantes dont le nom commence par get, c'est-à-dire "récupère" :

Ainsi, si j'appelle nu la variable qui retient la date d'aujourd'hui (ça n'a rien de sexuel, c'est la traduction en néerlandais de 'maintenant'), en donnant l'instruction nu = new Date();
document.write(nu) affichera :  ;
document.write(nu.getDate()) affichera :  ;
document.write(nu.getDay()) affichera :  ;
document.write(nu.getFullYear()) affichera :  ;
document.write(nu.getHours()) affichera :  ;
document.write(nu.getMilliSeconds()) affichera :  ;
document.write(nu.getMinutes()) affichera :  ;
document.write(nu.getMonth()) affichera :  ;
document.write(nu.getSeconds()) affichera :  ;
document.write(nu.getTime()) affichera :  ;
document.write(nu.getYear()) affichera :  ;

Plutôt que de donner de grandes explications théoriques, nous préférerons ici commenter de petits scripts que vous pourrez modifier et tester à volonté :

Combien de secondes avant le prochain réveillon ?

Un premier exemple n'utilisant que l'objet Date() et les méthodes pour connaitre...

Il s'agit donc, dans l'ordre de :
- relever la date actuelle précise (variable maintenant) ;
- convertir en secondes depuis le temps UTC (variable temps_maintenant) ;
- relever l'année en cours (variable an_maintenant) ;
- calculer l'année suivante (variable an_prochain) ;
- déterminer la date du prochain réveillon (variable date_proch_rev) ;
- convertir cette date en secondes depuis le temps UTC (variable temps_proch_rev) ;
- faire la différence entre les 2 conversions en secondes (variable reste) ;
- enfin, afficher le message avec le résultat du calcul.

C. Les méthodes pour changer le format de la date, type toGMTString()

Une autre série de méthodes relatives à l'objet Date() peuvent en changer le format et/ou les références. En voici un aperçu :

Et pour que vous puissiez tester :

D. Les méthodes de type setTime() ou setDate() pour modifier la date

Pour modifier une date, JS met à notre disposition une nouvelle série de méthodes, mais dont le nom commence par set, c'est-à-dire "fixe" en anglais :

E. Les méthodes setTimeout() et setInterval()
pour répéter une action à intervalles réguliers

Rappelons ici la syntaxe setTimeOut(expression,msec) de cette fonction où 'expression' est une expression que JS pourra exécuter (ici, une fonction JS) et msec est un nombre de millisecondes que l'ordinateur attendra avant d'exécuter (ou de répéter) l'expression JS qui précède.
Dans l'exemple qui suit, la fonction s'appelle elle-même, on dira qu'elle est récursive, donc l'expression sera répétée... à l'infini, à condition d'être appelée une première fois.

Un exemple illustrera ceci : voici l'affichage de la date en français, recalculée toutes les 2 sec. et demi, et donc avec un affichage des secondes arrondi :

var Mois=new Array("Janvier","Février","Mars","Avril","Mai","Juin","Juillet",
      "Aout","Septembre","Octobre","Novembre","Décembre")
var Jours=new Array("Dimanche","Lundi","Mardi","Mercredi","Jeudi",
      "Vendredi","Samedi")
function FrenchDate25() {
    Maintenant = new Date();
    var DateFran = Jours[Maintenant.getDay()] + " " + Maintenant.getDate() + " " ;
    DateFran += Mois[Maintenant.getMonth()] + " " + Maintenant.getYear() + ", ";
    DateFran += Maintenant.getHours() + " heures " + Maintenant.getMinutes();
    DateFran += " minutes et " + Maintenant.getSeconds() + " secondes";
    document.forme.champ.value=DateFran;
    setTimeout(FrenchDate25, 2500);
}

Il s'agit de noter la fonction dont la source se trouve ci-dessus dans le <head> du fichier.
Ensuite, dans le <body>, à l'endroit où l'on souhaite voir apparaitre l'affichage, il faudra ajouter le formulaire de la manière suivante :

<center><form name="forme"><input type="text" name="champ" size=60></form></center>

Ce qui ne suffit pas, car la fonction FrenchDate25 n'est nulle part appelée pour l'instant... on pourrait l'appeler dès l'ouverture de la page avec un onLoad d'où :

<body onLoad="FrenchDate25()">

Janvier est le mois à indice 'zéro', aussi bien dans l'array que dans le retour de la fonction getmonth(). Il n'y a donc pas lieu de corriger les indices pour écrire la date. Imaginons que nous soyons le mardi 25 décembre 2012 et analysons et décomposons ceraines lignes de ce script : Maintenant.getDay() va renvoyer la valeur '2' pour Tuesday, donc Jours[Maintenant.getDay()] deviendra Jours[2] qui est la 3e valeur (d'indice 2) de mon tableau ou array Jours[] et vaudra finalement 'Mardi'.

De même, Maintenant.getMonth() prendra la valeur '11' car décembre est le 12e mois, d'indice 11, et Mois[Maintenant.getMonth()] deviendra Mois[11] qui prendra la 12e valeur, d'indice 11, de mon array Mois[] qui est la valeur 'Décembre'.

Plus loin, DateFran est une chaine concaténée de plusieurs valeurs dont la première est la valeur "Mardi" et la dernière le mot " secondes", toujours au pluriel... on aurait pu être plus précis en écrivant la condition ternaire :
(Maintenant.getSeconds()>1)?" secondes":" seconde" à affecter à une variable telle que sec qu'on remplacera comme dernier élément de la chaine concaténée :
sec = (Maintenant.getSeconds()>1)?" secondes":" seconde".
Idem pour les minutes et pour les heures... nos pages sont lues aussi entre minuit et 2 heures du matin... deux heures au moins avec fautes d'orthographe... à éviter, bien sûr.

Cette variable DateFran est affectée et remplace alors la valeur document.forme.champ.value qui n'est rien d'autre que la valeur value du champ baptisé champ du formulaire dénommé forme du document en cours, ce qui explique qu'elle soit toujours écrite dans cette zone de texte du formulaire. Ainsi, cette valeur est recalculée toutes les 2,5 secondes ou 2500 millisecondes.

La méthode setInterval a la même syntaxe et le même usage... sauf qu'on préférera setTimeout s'il s'agit d'une fonction qui ne sera pas "relue" à chaque passage.

Plus de mystères pour l'objet Date() ? Plus aucune question ? Si vous êtes d'accord avec tout ce qui précède, c'est que vous n'êtes pas attentif... en effet, la méthode getYear() ne renvoie pas 2012, mais 112 ; il aurait fallu employer la méthode getFullYear(). À bon lecteur, salut... et à la prochaine séquence qui vous montrera d'autres exemples de l'usage des objets de type Date().

III. Exemples relatifs à l'objet Date()

voir suite >>>

IV. Exemple du calendrier relatif à l'objet Date()

voir suite >>>

VIII. Exercices relatifs à l'objet Date()

voir suite >>>

IX. Test relatif à l'objet Date()

voir suite >>>

---

L'objet Date() (35.1) | | exemples relatifs aux objets Date() (35.3)

---