dossiers relatifs au langage JavaScript
le langage et son utilisation dans le D.O.M.
contenus de la page
Le langage JavaScript a longtemps figuré comme le vilain petit
canard des langages. Déroutant les programmeurs, car s'il est bien
un langage objets, il n'a pas de classe ! Interprété
et donc forcément lent. Mais la principale difficulté liée à son
usage lui est extérieure : lorsqu'on veut l'utiliser comme langage
de script dans les pages web, la galère vient du fait que le
D.O.M. qu'il est sensé manipuler est implémenté différement sur les
divers navigateurs, et jusqu'à une période récente suivant le contenu du
DOCTYPE. Un script efficace peut nécessiter 3 ou 4 versions :
pour I.E., pour Firefox, pour Safari, pour Opera...
Une double convergence s'est alors opérée à partir de 2005 : les
navigateurs se sont rapprochés avec la venue du HTML 5 et
des frameworks comme jQuery
sont venus gommer les différences irréductibles entre implémentations.
JavaScript s'est normalisé : on devrait désormais parles de l'EcmaScript.
Bien plus, JavaScript est devenu, avec HTML5 le langage de script
interne, certaines nouvelles balises comme <canvas> n'étant
utilisables qu'avec lui.
La page propose actuellement trois dossiers :
une description de JavaScript en tant que langage
une ilustration de l'utilisation de Javascript avec le D.O.M.
l'utilisation de JavaScript avec la balise <canvas> du HTML5
JavaScript, un langage prototypé
JavaScript est un langage objet sans
classes. Il n'a que des instances, et la création d'une nouvelle
instance se fait par clonage. L'héritage est réalisé par prototypage.
Cela le rend déroutant pour le non initié ! Contrairement à la
pensée commune, JavaScript, cela s'apprend !
Le document proposé est une description assez basique du langage,
mais qui n'en gomme pas les aspérités. Au contraire, les difficultés
sont signalées. Pour rester délibérément pratique, l'analyse de
l'implémentation conduit à édicter quelques règles de bonne
programmation qui peuvent aller à l'encontre des procédés habituels et
qui évitent quelques facilités rendant délicate la maintenance des scripts.
L'écriture JSON est simplement évoquée. Comme elle n'a sa véritable puissance
que quand on utilise plusieurs langages, la question est traitée dans la
page réservée à Django.
Les domaines d'action de JavaScript dans la
programmation des pages web sont les suivants :
1- il permet de créer de nouvelles fenêtres dans le navigateur ;
2- il permet d'intervenir dynamiquement sur les styles et modifier ainsi
l'aspect de la page une fois chargée ;
3- il permet de gérer les événements ;
4- à un degré supérieur, il permet de manipuler le modèle de document :
en pratique cela revient à ajouter ou retirer des balises, à les modifier,
à en changer les propriétés comme la classe, le contenu, les gestionnaires
d'événement. Un cas typique est le changement de contenu d'un affichage de texte.
Malheureusement, l'implémentation du modèle qui sous-tends ces opérations dépend du
navigateur, la grande ligne de démarcation étant entre Internet Explorer et la
famille Netscape, quand elle ne passe pas à l'intérieur des versions de I.E. L'usage
d'un framework qui laisse oublier les divergences est impérative. Nous avons opté pour
jQuery, fort populaire parmi les programmeurs du web. Son usage est systématique (sauf pour
la question du focus). De nombreux exemples sont traités sur un fond de XHTML. Mais le
passage en HTML5 ne pose pas de problème particulier. Sauf par exemple, que la balise
nouvelle canvas n'est pas abordée ; son étude fait l'objet d'un document spécifique.
Jusqu'au HTMl4, le fonctionnement des balises se fait de
manière autonome. Le JavaScript apparaît uniquement lorsque
l'on a besoin d'interagir avec le D.O.M. (Modèle Objet de
Document) pour créer ce que l'on appelle le HTML dynamique.
L'usage le plus courant est la gestion des événements utilisateur.
Avec AJAX, une antorse est faite avec le HTML classique :
Ajax est partie prenante du D.O.M. et régit de façon nouvelle la
relation client-serveur. L'usage d'un langage de script devient
une nécessité. Un pas supplémentaire est fait en HTML5 où cette
fois une balise ne peut fonctionner qu'en utilisant un langage de
script et pour l'instant, c'est l'ECMAscript qui est défini
comme langage normal d'action avec la balise canvas.
Le dossier joint est un exposé complet sur les méthodes et attributs
de programmation de la balise canvas. Toutes le primitivs
sont illustrées par les pages d'exemple fournis dans le fichier ZIP.
Le bandeau de la page actuelle comme l'illustration ci-dessous
constituent un test sur la balise <canvas>
format LibreOffice (4,3 Mio)
format P.D.F. (4,2 Mio)
les exemples au format Z.I.P. (55,7 Kio)