« Programmation JavaScript/Expression littérale » : différence entre les versions

Contenu supprimé Contenu ajouté
m Révocation des modifications par 196.203.57.165 (Discussion) vers la dernière version de Tavernier
Mef + ortho + <source>
Ligne 2 :
[[Programmation JavaScript/Sommaire|<< Retour au sommaire détaillé]] / [[Programmation JavaScript/Commentaire|Les commentaires >>]]
 
Dans un programme javascript, il est courant de devoir introduire des données sous forme littérale. Celà se produit principalement quand on renseigne une variable, ou quand on appelle une fonction.<br/>
Ce qui suit est valide pour le code javascript écrit dans les fichiers externes, ou entre les balises &lt;script&gt; &lt;/script&gt;. En ce qui concerne le code associé aux évennements (onclick, onload...), l'approche est différente.
 
Ce qui suit est valide pour le code javascript écrit dans les fichiers externes, ou entre les balises &lt;script&gt; &lt;/script&gt;. En ce qui concerne le code associé aux évennementsévènements (onclick, onload...), l'approche est différente.
<pre>
<source lang="javascript">
ma_var = "une chaîne exprimée littéralement";
mon_nombre = 12; // un nombre littéral;
alert("Ce message est une chaîne littérale");
</presource>
 
Ces expressions littérales peuvent être des chaînes, ou des nombres.<br/>
 
== Les chaînes sous forme littérale ==
Elles sont constituées de lettres, chiffres, ponctuation et symboles avec un mécanisme (échappement) permettant d'étendre cet ensemble à des caractères de contrôle, de formatage et des caractères spéciaux.<br/>
 
Une chaîne exprimée sous forme littérale est délimitée par des guillemets double ( " ) ou simple ( ' ).<br/>
Une chaîne exprimée sous forme littérale est délimitée par des guillemets double ( " ) ou simple ( ' ).

La rêglerègle veut qu'une chaîne ouverte avec un guillemet double doit être fermée avec un guillemet double. De même, une chaîne ouverte avec un guillemet simple doit être fermée avec un guillemet simple.<br/>
 
La première complication se produit quand nous désirons inclure des guillemets dans notre chaîne.<br/>
 
Appelons une fonction avec une chaîne en paramètre :
{{Erreur volontaire}}
<div style="color:red;border:1px dotted black;padding:5px">
<source lang="javascript">
alert("le titre de l'article : "les joies de l'informatique""); // ne marche pas
</divsource>
... à la place, on peut écrire:
<source lang="javascript">
<pre>
alert("le titre de l'article : " + '"' + "les joies de l'informatique" + '"' );
</presource>
... mais c'est affreux.
 
Pour utiliser une solution élégante, nous avons recours au mécanisme d'échappement.
 
=== Le mécanisme d'échappement ===
Le mécanisme d'échappement consiste à inclure dans les chaînes, des anti-slash (\) suivis d'un caractère choisi pour sa fonction. <br/>
 
les caractères échappés sont en nombre limités et facile à mettre en oeuvre : œuvre.
 
==== L'échappement des guillemets simples (\') ou double (\") ====
Précédé d'un anti-slash, les guillemets ne feront plus office de délimiteur de chaîne, et ceci permet de les inclure comme de simples symboles de ponctuation.
<source lang="javascript">
<pre>
alert("Mon nom est \"Personne\""); // affiche : Mon nom est "Personne"
</presource>
 
==== Le retour à la ligne avec \n ====
Il peut être utile de formater une chaîne en la présentant sur plusieurs lignes. La séquence d'échappement \n réalise celà. Elle inclut en effet le caractère de contrôle "linefeed" (valeur 10 en décimal, 0A en hexadécimal) qui réalise le retour à la ligne ave la plupart des navigateurs graphique.
 
<pre>
<source lang="javascript">
alert("première, \ndeuxième \net troisième ligne");
</presource>
... affiche <br/>:
première,<br/>
deuxième<br/>
et troisième ligne<br/>
 
==== La tabulation avec \t ====
La séquence d'échappement \t insère un caractère de tabulation dans la chaîne, et permet ainsi de formater l'affichage. Le caractère de tabulation est codé 9 en décimal et 09 en héxadécimal.
<source lang="javascript">
<pre>
alert("colonne 1 \tcolonne 2 \tcolonne 3");
</presource>
 
==== L'inclusion de caractères unicode avec \u ====
Javascript, quand il est codé dans un fichier distinct, ou quand il est codé entre les balises &lt;script&gt; &lt;/script&gt; ne supporte pas les entités de la forme &amp;lt; ou &amp;#160;, ou toute autre forme d'entité.<br/>
 
L'échappement '''\u''' offre un mécanisme de remplacement dont la mise en oeuvreœuvre nécessite de se référer à une table associant les codes héxadécimauxhexadécimaux au symboles correspondant. [[w:fr:Table des caractères unicodeUnicode, de 0 à 4095|(par exemple)]].
<br/>
 
Ces codes '''héxadécimauxhexadécimaux''' sont présentés avec '''4 digit''', et la séquence d'échappement \u nécessite d'écrire les 4 digit sous peine d'un déclenchement d'erreur.<br/>
<pre>
 
<source lang="javascript">
alert("Rodrigue as-tu du c\u0153ur?");
</presource>
... affiche Rodrigue as-tu du c'''œ'''ur?<br/>
 
ce qui est plus conforme à l'original que l'anti-typographique "coeur", utilisé à longueur d'internet.<br/>
L'inclusion de caractères unicode permet l'accès aux symboles et à la citation de fragments utilisant d'autres alphabets que le nôtre. <br/>De plus, il permet également l'inclusion ds caractères de contrôle. Ainsi, \n et \u000A sont équivalents.<br/>
 
[[w:fr:Table des caractères unicode, de 0 à 4095|Table unicode (wikipedia)]]
L'inclusion de caractères unicodeUnicode permet l'accès aux symboles et à la citation de fragments utilisant d'autres alphabets que le nôtre. <br/>De plus, il permet également l'inclusion ds caractères de contrôle. Ainsi, \n et \u000A sont équivalents.<br/>
 
De plus, il permet également l'inclusion ds caractères de contrôle. Ainsi, \n et \u000A sont équivalents.
 
[[w:fr:Table des caractères unicodeUnicode, de 0 à 4095|Table unicodeUnicode (wikipediawikipédia)]]
 
== Les nombres sous forme littérale ==
Les nombres sont constitués de chiffres et de signes à l'exclusion du caractère espace. JavaScript permet d'exprimer littéralement les nombres entiers, réels, octals, héxadécimauxhexadécimaux, exponentiels, sous forme positive ou négative.
 
=== Les nombres négatifs ===
En plaçant le signe moins ( - ) devant le nombre, on obtient ce nombre en négatif, et ceci qu'il soit noté comme entier, réel, octal, hexadécimal ou exponentiel.
<source lang="javascript">
<pre>
ma_var = -5;
</presource>
 
=== Les entiers ===
Ils s'écrivent tel quel, c'est la représentation par défaut, employant les chiffres 0 à 9.
<source lang="javascript">
<pre>
ma_var = 12;
</presource>
 
=== Les réels ===
Le signe de séparation de la partie entière est le point ( . )
<source lang="javascript">
<pre>
ma_var = 8.65;
</presource>
 
=== L'octal ===
Un nombre commençant par zero et ne comprenant que les chiffres de 0 à 7 sera interprété en octal.
<source lang="javascript">
<pre>
ma_var = 0257;
</presource>
 
=== L'hexadécimal ===
Un nombre commençant par 0x (ou 0X) comprenant les chiffres et les lettres abcdef en minuscule, majuscule ou les deux, sera interprété en hexadécimal.
<source lang="javascript">
<pre>
ma_var = 0xf044;
</presource>
 
=== La notation scientifique ===
En faisant suivre un nombre entier ou réel de la lettre e (ou E), elle-même suivie d'un entier positif ou négatif, on obtient un nombre en '''notation scientifique'''.
<source lang="javascript">
<pre>
ma_var = 2.5e40; // Un grand nombre : 2,5 * 10 exposant 40
ma_var = 50e-30 // Un tout petit nombre
</presource>
 
=== Taille des nombres ===
Ligne 105 ⟶ 127 :
 
== Les chaînes littérales dans les expressions associées aux évènements ==
A l'intérieur des balises html, il est possible d'intégrer du code JavaScript associé aux évènements, (comme onclick, onmouseover...). Javascript est à ce moment là interprété en dehors de son territoire propre, c'est à dire entre les balises &lt;script&gt; et &lt;/script&gt; ou dans un fichier séparé. <br/>
Sa rédaction obéit alors aux règles de rédaction des attributs des balises, qui n'autorisent pas tout.<br/>
 
<pre>
<source lang="html">
<div onclick="alert('Je suis cliqué')">cliquez moi!</div>
</presource>
 
Html, comme xhtml, ne reconnaitreconnaît pas les séquences de type \uHHHH. Nous devons nous limiter aux caractères échappés classiques, amputés de ( \" ) et ( \' ). En effet, ces deux caractères ne seront pas interprétables comme valeur de la propriété de la balise.<br/>
Si nous voulons afficher '''Je suis "cliqué"''', nous devons recourir aux entités.<br/>
 
Si nous voulons afficher '''Je suis "cliqué"''', nous devons recourir aux entités.<br/>
 
Les entités sont un mécanisme permettant d'insérer n'importe quel caractère dans une chaîne.<br/>
 
Selon la référence du doctype html, nous aurons accès à des entités munies d'un identificateur. Sinon, sous réserve de disposer d'une '''table adéquate''', nous pouvons reproduire n'importe quel caractère.<br/>
 
Sans aller plus-avant dans la description des entités, nous pouvons les décriresdécrire comme suit :<br/>
 
L'entité commence par le caractère & (éperluetteesperluette ou "et commercial") et finit par un point-virgule. Entre ces deux symboles, on rencontre soit un identificateur ( &'''lt'''; &'''gt'''; &'''amp''';), soit le code du caractère exprimé en '''décimal''' et précédé du signe sharp (#). (&amp;#160; &amp;#339;)<br/>.
 
<source lang="html">
Les entités sont un mécanisme permettant d'insérer n'importe quel caractère dans une chaîne.<br/>
Selon la référence du doctype html, nous aurons accès à des entités munies d'un identificateur. Sinon, sous réserve de disposer d'une '''table adéquate''', nous pouvons reproduire n'importe quel caractère.<br/>
Sans aller plus-avant dans la description des entités, nous pouvons les décrires comme suit :<br/>
L'entité commence par le caractère & (éperluette ou "et commercial") et finit par un point-virgule. Entre ces deux symboles, on rencontre soit un identificateur ( &'''lt'''; &'''gt'''; &'''amp''';), soit le code du caractère exprimé en '''décimal''' et précédé du signe sharp (#). (&amp;#160; &amp;#339;)<br/>
<pre>
<div onclick="alert('Je suis &amp;#34;cliqué&amp;#34;')"> // Affiche: Je suis "cliqué"
cliquez moi!
</div>
</presource>
... Mission accomplie.