Premier script à faire soi‐même

Il faut bien débuter un jour, alors allons‐y ! Avec un script simplissime :
alert("C'est mon 1er script");

Ce qui a pour effet d’afficher un message d’alerte :

Votre éditeur HTML
Pour écrire des scripts Javascript, vous devez utiliser votre éditeur HTML en mode Source ou HTML et non en mode Normal. Vous pouvez copier‐coller directement les codes de cette page dans votre éditeur HTML en mode HTML.

Le script
1. Créez une page HTML vide. 2. Avant la balise </HEAD>, écrivez les balises d’ouverture et de fermeture d’un script Javascript :
<script language="JavaScript">  <!­­ Debut script  //  Fin script ­­>  </script>

Les commentaires <!­­ et // ­­> sont indispensables afin que les navigateurs ne supportant pas Javascript ne retournent pas une erreur ("Debut script" et "Fin script" sont optionnels).

3. Intégrer votre instruction dans le script :
<script language="JavaScript">  <!­­ Debut script  alert("C'est mon 1er script");  //  Fin script ­­>  </script>

Voici à quoi doit ressembler votre page HTML :
<html>  <head>

<title>mon 1er script</title>  <script language="JavaScript">  <!­­ Debut script  alert("C'est mon 1er script");  //  Fin script ­­>  </script>  </head>  <body> 

</body>  </html>

4. Afficher votre page dans un navigateur Voilà, vous voilà un de plus dans le monde de Javascript !

Ecrire dans la page HTML
On va continuer dans la même veine, mais avec quelques difficultés.
document.write("C'est mon 2ème script");

Ce qui a pour effet d’écrire dans la page Web : « C’est mon 2ème script »

document.write simple
Voici votre page Web avec le script :
<html>  <head>  <title>mon 2ème script</title>  <script language="JavaScript">  <!­­ Debut script  document.write("C'est mon 2ème script");

//  Fin script ­­>  </script>  </head>  <body> 

</body>  </html>

Afficher‐la dans un navigateur et vous aurez une ligne simple qui affiche « C’est mon 2ème script »

Intégrer des balises HTML
Vous pouvez intégrer des balises HTML dans votre texte, ce qui vous permet de choisir la police, la couleur, de centrer... 1er essai Choisissons la police Arial en gras, une couleur bleue et de centrer le tout. Notre instruction document.write devient :
document.write("<center><font  color="#0000ff"><b>C'est mon 2ème script</b></font></center>"); face="Arial" 

(tout est sur la même ligne, mais pour des raisons d’affichage la ligne est coupée) Essayez d’intégrer cette instruction à la place de la précédente, ça donne une erreur :‐( Pourquoi ?
document.write (comme alert, d’ailleurs) a comme argument une chaîne de caractères

délimitée par des guillemets ("). Si vous rajoutez d’autres guillemets ("), Javascript ne comprend plus où commence et où finit la chaîne. Comment faire ? Remplacer les guillemets (") à l’intérieur de la chaîne par des apostrophes (’) :
document.write("<center><font  color='#0000ff'><b>C'est mon 2ème script</b></font></center>"); face='Arial' 

Et là, ça marche ! Ca donne la même chose que l’image en haut. Guillemets et apostrophes sont interchangeables
document.write('<center><font  color="#0000ff"><b>C'est mon 2ème script</b></font></center>'); face="Arial" 

On a interverti guillemets (") et apostrophes (’) et ‐ en théorie ‐ le résultat devrait être le même. En théorie, seulement, car il y a un problème avec l’apostrophe de "C’est". Pour remédier à ça on doit remplacer ’ par \’ :

document.write('<center><font  color="#0000ff"><b>C

est mon 2ème script</b></font></center>');

face="Arial" 

Et là, on obtient le résultat précédent. De même, on aurait pu écrire :
document.write("<center><font  color=###BOT_TEXT###quot;#0000ff###BOT_TEXT###quot;><b>C'est mon 2ème script</b></font></center>"); face=###BOT_TEXT###quot;Arial###BOT_TEXT###quot; 

Règle usuelle pour les chaînes de caractères
On utilise en général la 1ère forme :
document.write("<center><font  color='#0000ff'><b>C'est mon 2ème script</b></font></center>"); face='Arial' 

Soit des guillemets (") pour délimiter la chaîne et des apostrophes (’) à l’intérieur, surtout à cause des nombreuses apostrophes (’) du français. Mais sachez que les deux sont interchangeables.

Aperçu de la page définitive :
<html>  <head>  <title>mon 2ème script</title>  <script language="JavaScript">  <!­­ Debut script  document.write("<center><font face='Arial'  color='#0000ff'><b>C'est mon 1er script</b></font></center>");  //  Fin script ­­>  </script>  </head>  <body> 

</body>  </html>

Comment modifier une image au passage de la souris
On va continuer par quelque chose de très demandé, le survol d’image (ou rollover en anglais) ou comment modifier l’aspect d’une image au passage de la souris. C’est très simple ! Mais on va quand même y consacrer 2 leçons.

Les images d’origine
On va commencer par placer les 3 images par défaut dans notre page. C’est du HTML pur et vous pouvez faire ça en mode normal dans votre éditeur HTML :
<img border="0" src="images/bleu_p.gif" width="38" height="20">  <img border="0" src="images/rouge_p.gif" width="38" height="20">  <img border="0" src="images/vert_p.gif" width="38" height="20">

Ce qui donne l’aspect des 3 boutons ci‐dessus (sans le survol) Avant de continuer ; vous devez avoir créé les autres images, celles qui seront visibles lorsque la souris passera dessus. Voici l’ensemble des images que vous pouvez copier‐coller si vous n’en avez pas d’autres sous la main... Copiez ces images ou celles de votre choix dans un sous‐répertoire "images". (images par défaut) (images de survol) Les objets‐images Une page HTML est constituée d’objets (voir la page "Objets d’une page HTML"). Chaque fois que vous ajoutez une image à votre page, il se crée un objet‐image supplémentaire. Ainsi lorsque vous écrivez en HTML :
<img border="0" src="images/bleu_p.gif" width="38" height="20">

vous créez un objet image ayant les propriétés suivantes : bordure = 0 (border="0") source = "images/bleu_p.gif" (le fichier image) largeur = 38 (width="38") hauteur = 20 (height="20") Il existe encore d’autres propriétés qui n’ont pas été initialisées, mais on verra ça plus loin. Changer le fichier source de l’image Comme vous l’avez écrit, le fichier‐image associé à l’image "image1" est "images/bleu_p.gif", c’est ce que veut dire :
<img name="image1" src="images/bleu_p.gif">

Si on change le src (le source) :
<img name="image1" src="images/bleu_a.gif">

on aura la même image, mais en creux :

C’est le principe du survol. Mais pour que ça fonctionne en passant la souris, il faut indiquer quel événement déclenchera ce survol.

Les événements
onMouseOver et onMouseOut [1]

Il existe 2 événements : onMouseOver (réagit au passage de la souris sur un objet) et onMouseOut (réagit lorsque la souris quitte un objet). Lorsqu’on écrit
onMouseOver="this.src = 'images/bleu_a.gif'"

cela a pour effet d’afficher l’image "bleu_a.gif" lorsque la souris passe sur l’image Et :
onMouseOut="this.src = 'images/bleu_p.gif'"

a pour effet de réafficher l’image "bleu_p.gif" lorsque la souris quitte l’image. this Ca signifie « ceci » en anglais, et désigne l’objet en cours. Si vous écrivez l’instruction précédente telle quelle, le navigateur pensera que « this » représente la page, et ne fera rien, car l’objet « document » (la page) n’a pas d’attribut « src ». Par contre, ici « this » est dans l’objet image, et « this.src » désigne le fichier source de cet objet image :
<img  src="images/bleu_p.gif"  border="0"  onMouseover="this.src='images/bleu_a.gif'"  onMouseout="this.src='images/bleu_p.gif'"> width="38"  height="20" 

donnera ceci :

Le code complet pour les 3 boutons
Ce code est à écrire en l’état dans votre page HTML (donc pas dans un script Javascript) :
<img src="images/bleu_p.gif" border="0" width="38" height="20"  onMouseover="this.src='images/bleu_a.gif'"  onMouseout="this.src='images/bleu_p.gif'">  <img src="images/rouge_p.gif" border="0" width="38" height="20"  onMouseover="this.src='images/rouge_a.gif'"  onMouseout="this.src='images/rouge_p.gif'">  <img src="images/vert_p.gif" border="0" width="38" height="20"  onMouseover="this.src='images/vert_a.gif'"  onMouseout="this.src='images/vert_p.gif'">

ce qui donne :

Ca ne fonctionne pas avec Netscape 4 Ce code fonctionne sous Internet Explorer 4/5/6+, sous Netscape 6/7+, sous Mozilla 1+, mais pas sous Netscape 4 ou Internet explorer 3. On verra comment faire, dans le prochain article.

Netscape 4 n’accepte pas d’événement onMouseOver ou onMouseOut dans les images. Donc on va faire autrement. Et les versions 3 de Netscape et d’Internet Explorer n’acceptent pas d’objets image, donc de toute façon, le survol ne fonctionnera jamais avec ces navigateurs, qui se font de plus en plus rares.
Notes : [1] Ces événements font partie non de Javascript, mais du DOM (Document Object Model), qui, contrairement à Javascript, n’est pas sensible à la casse. Ce qui veut dire que vous pouvez écrire « onmouseover » ou « OnMouseOver » ou « ONMOUSEOVER », vous obtiendrez le même résultat.

Comment réaliser un survol d’image avec la compatibilité Netscape 4
Netscape 4 n’accepte pas les événements onMouseOver et onMouseOut dans les objets image. Par contre, ils fonctionnent dans un lien. On va créer une fonction Javascript, qui marchera pour toutes les images à survol, quelque soit la version du navigateur (les versions 3 de IE et Netscape ne verront pas ce survol, et les images seront fixes). Toujours nos 3 boutons :

onMouseOver et onMouseOut dans un lien
Ces événements seront intégrés dans le lien <a href=...>...</a>, au lieu de les mettre dans l’image. Mais le code this.src = ... ne fonctionnera plus, puisque ici « this » représente le lien et un lien n’a pas d’attribut « src ».

Il faut indiquer à la page quel objet va avoir son source modifier. Pour ça il faut donner un nom aux images. Nommer les images Pour nommer les images, on utilise l’attribut « name », attribut qu’on verra aussi dans toutes sortes d’objets.
<img name="image1" src="images/bleu_p.gif" border="0" width="38" height="20">

Et pour modifier son source, on écrira :
document.images["image1"].src = "images/bleu_p.gif";

où document.images est la collection des images de la page, et document.images["image1"] représente l’objet image du bouton bleu.

Fonction de survol
On va créer une fonction Javascript spéciale, qui modifiera le source de tout objet image :
<script language="JavaScript">  <!­­  var rep = "images/";  function survol(Objet, Fichier) {  if (!document.images) {}

document.images[Objet].src = rep + Fichier;  }  //­­>  </script>

La fonction sera appelée ainsi :
survol("image1", "bleu_a.gif");

L’argument « Objet » est le nom de l’objet image, celui qui est indiqué par l’attribut « name » de l’image. Et « Fichier » est le fichier source à changer. La variable « rep » est le répertoire des images. L’instruction if (!document.images) {} permet de ne rien faire, pour les navigateurs ne supportant pas les objets images.

Le code de l’image
Donc dans notre page HTML, on écrire notre image bleue ainsi :
<a href="#" onMouseOver="survol('image1', 'bleu_a.gif')"  onMouseOut="survol('image1', 'bleu_p.gif')">  <img name="image1" border="0" src="../images/bleu_p.gif" width="38"  height="20"></a>

Le code complet
<html>  <head>  <title></title>  <script language="JavaScript">  <!­­  var rep = "images/";  function survol(Objet, Fichier) {  if (!document.images) {}  document.images[Objet].src = rep + Fichier;  }  //­­>  </script>  </head>  <body>  <a href="#" onMouseOver="survol('image1', 'bleu_a.gif')"  onMouseOut="survol('image1', 'bleu_p.gif')">  <img name="image1" border="0" src="images/bleu_p.gif" width="38" height="20"></a>  <a href="#" onMouseOver="survol('image2', 'rouge_a.gif')"  onMouseOut="survol('image2', 'rouge_p.gif')">  <img name="image2" border="0" src="images/rouge_p.gif" width="38" height="20"></a>  <a href="#" onMouseOver="survol('image3', 'vert_a.gif')"  onMouseOut="survol('image3', 'vert_p.gif')">  <img name="image3" border="0" src="images/vert_p.gif" width="38" height="20"></a>  </body>  </html>

Ce qui donnera :

Lire le contenu d’un champ texte de formulaire

Page HTML et objets
Une page HTML est constituée d’objets : le contenu de la page (qui correspond à ce qui se trouve entre les balises et , les images, un formulaire, une case texte dans un formulaire, etc... Javascript sait manipuler tout ça à condition de leur donner un nom, de façon à ce qu’il sache sur quel objet il doit agir.

Lire le contenu d’une boîte de texte
Voici un exemple : Indiquez votre nom : Indiquez votre nom :

Indiquez votre nom, puis cliquez sur OK. Une boîte d’alerte indique le texte que vous avez saisi dans la boîte de texte. Voici le script :
<form method="POST" name="formulaire">  <p>Indiquez votre nom :<br>  <input type="text" name="nom" size="40">  <input type="button" value="OK" onClick="alert('Texte saisi : ' +  document.formulaire.nom.value)"></p>  </form>

Nommer les objets
Le formulaire Son nom est « formulaire ». On fait référence à ce formulaire en écrivant :
document.formulaire ou document["formulaire"]

Exemple : connaître le nom du formulaire :
document.formulaire.name; // donnera « formulaire »

La boîte de texte Son nom est "nom". On lui fait référence ainsi :
document.formulaire.nom

car c’est un objet inclus dans le formulaire. Exemple : lire sa valeur :
document.formulaire.nom.value;

« value » est une propriété des boîtes texte de formulaire. Le bouton « OK » On n’a pas besoin de son nom mais on lui a associé un événement.

Les événements
Chaque fois que vous bougez la souris, que vous cliquez quelque part dans la page, que vous modifiez la taille de la fenêtre.. un événement est déclenché. Chaque objet supporte un certain nombre d’événements. Les boutons déclenchent un événement "onClick" lorsqu’on clique dessus. Si on "associe" une fonction particulière à un événement, on déclenche cette fonction lorsque l’événement se produit. Exemples d’événements : onMove : mouvement de la souris onMouseover : passage de la souris sur un objet onMouseout : la souris quitte un objet onClick : on a cliqué sur un objet onChange : la valeur d’un objet a été changée onFocus : un objet a le "focus" (le curseur est sur l’objet) [1] Pour associer une fonction à un événement, il suffit d’écrire :
onEvenement="la_fonction()";

Tout simplement. Dans notre cas, on a associé la fonction « alert » (fonction prédéfinie du langage Javascript qui affiche une boîte d’alerte). Si on écrit dans la balise du bouton OK : onClick="alert(’Vous avez cliqué sur le bouton’)" ; le message « Vous avez cliqué sur le bouton » s’affichera à chaque fois que vous cliquez sur le bouton. Maintenant, pour indiquer le contenu de la boîte de texte "nom" dans le message d’alerte :
onClick="alert(document.test1.nom.value)"; Notes : [1] les événements sont des objets du DOM (Document Object Model), insensible à la casse, contrairement à Javascript. Donc on peut « onclick » ou « OnClick » ou « ONCLICK », le résultat sera le même.

Lire et écrire le contenu d’une boîte texte de formulaire

On va lire le contenu d’une boîte de texte et l’écrire dans une autre boîte de texte

Exemple
Indiquez votre nom ici, pluis cliquez sur OK Boîte texte « nom » :

Boîte texte « resultat »

Voilà le travail ! Voici le script :
<form method="POST" name="formulaire">  <p>Boîte texte « nom » :<br>  <input type="text" name="nom" size="40"></p>  <p>Boîte texte « resultat »<br>  <input type="text" name="resultat" size="40">  <input type="button" value="OK" onClick="document.formulaire.resultat.value =  document.formulaire.nom.value"></p>  </form>

Affecter une valeur à une boîte de texte
C’est facile :
document.formulaire.resultat.value = "voici le résultat";

a pour effet d’afficher « voici le résultat » dans la 2ème boîte de texte Maintenant, affecter la valeur d’une boîte de texte à une autre :
document.formulaire.resultat.value = document.formulaire.nom.value;

Il suffit ensuite d’associer cette action à l’événement onClick du bouton OK, et ça donne
onClick = "document.formulaire.resultat.value = document.formulaire.nom.value";

Petits calculs entre éléments de formulaire

Multiplier 2 boîtes de texte
On va multiplier le contenu de 2 boîtes de texte, et donner le résultat dans une troisième : Indiquez 2 chiffres, un dans chaque case de cette ligne : x

Voilà le résultat de la multiplication !

Voici le script :
<form method="POST" name="formulaire">  <p>Indiquez 2 chiffres, un dans chaque case de cette ligne :<br>  <input type="text" name="chiffre1" size="40"> x  <input type="text" name="chiffre2" size="40"></p>  <p>Voilà le résultat de la multiplication !<br>  <input type="text" name="resultat" size="40">  <input type="button" value="OK"  onClick="document.formulaire.resultat.value = document.formulaire.chiffre1.value *  document.formulaire.chiffre2.value"></p>  </form>

Calcul Si vous avez lu les 2 leçons précédentes, l’expression
onClick="document.formulaire.resultat.value  document.formulaire.chiffre1.value + document.formulaire.chiffre2.value"; = 

ne doit pas vous surprendre ; seulement au lieu d’affecter une simple valeur à une boîte de texte, on lui affecte la somme de la valeur de 2 boîtes de texte.

Division d’une boîte de texte par une valeur
Voici un exemple pour convertir des Francs en Euros Indiquez une valeur (en Francs) ‐ n’indiquez que des chiffres :

Voici la valeur convertie en euros :

Bon, ça ne donne pas un résultat très élégant, mais c’est le principe qui compte. script 1
<form name="formulaire1" method="POST">  <p>Indiquez une valeur (en Francs) ­ n'indiquez que des chiffres :<br>  <input type="text" name="francs" size="20">  <input type="button" value="OK" onClick="document.formulaire1.euros.value =  document.formulaire1.francs.value / 40.3399"></p>  <p>Voici la valeur convertie en euros :<br>  <input type="text" name="euros" size="20"></p>  </form>

On a le même principe qu’auparavant, mais on divise la valeur de la boîte francs par 6.55957 (le taux de conversion de francs en euros)
document.formulaire1.euros.value = document.formulaire1.francs.value / 6.55957;

script 2

On va utiliser une fonction de conversion, qui pourra éventuellement servir à d’autres cases.
<script language="JavaScript">  <!­­  function conversion(valeur) {  return valeur / 40.3399;  }  //­­>  </script>  </head>  <body>  <form name="formulaire1" method="POST">  <p>Indiquez une valeur (en Francs) ­ n'indiquez que des chiffres :<br>  <input type="text" name="francs" size="20">  <input type="button" value="OK"  onClick="document.formulaire1.euros.value =  conversion(document.formulaire1.francs.value)"></p>  <p>Voici la valeur convertie en euros :<br>  <input type="text" name="euros" size="20"></p>  </form>

Cette fonction ne fait que multiplier une valeur par 40.3399 et retourne le résultat.
document.formulaire1.euros.value = conversion(document.formulaire1.francs.value);

a pour effet d’affecter à la boîte de texte "euros" le résultat de la conversion de la valeur de la boîte francs, c’est‐à‐dire sa division par 40.3399

Calculs avec sélection dans une liste

Sélection de l’opérateur par une liste
On indique les 2 opérandes de l’opération (les 2 nombres). Lorsqu’on sélectionne l’opération, le résultat s’affiche directement dans la boîte résultat :
Indiquez 2 chiffres : Choisissez
addition  soustraction  multiplication  division 

l’opération : 

Voilà le résultat de l’opération

Voici le script :
<script language="JavaScript">  <!­­  function operation(val1, val2, operateur) {  switch (operateur) {  case 0 : return parseInt(val1) + parseInt(val2); break;  case 1 : return val1 ­ val2; break;  case 2 : return val1 * val2; break;  case 3 : if (val2 != 0) return val1 / val2;  else return "division par 0";  }

}  //­­>  </script>  </head>  <body>  <form method="POST" name="test5">  <table border="0" cellpadding="3" cellspacing="0" width="100%">  <tr>  <td width="55%" valign="top">Indiquez 2 chiffres  :<br>  <input type="text" name="chiffre1" size="10">  <input type="text" name="chiffre2" size="10">  <p>Voilà le résultat de l'opération<br>  <input type="text" name="resultat" size="20">  </td>  <td width="45%" valign="top">Choisissez l'opération :<br>  <select size="4" onChange="document.test5.resultat.value =  operation(document.test5.chiffre1.value,  document.test5.chiffre2.value, this.selectedIndex)">  <option>addition</option>  <option>soustraction</option>  <option>multiplication</option>  <option>division</option>  </select>  </td>  </tr>  </table>  </form>

Choix de l’opération dans la boîte de liste
La boîte de liste est un objet <SELECT>, dans lequel on a une liste d’options (<OPTION>). L’événement « onChange » se déclenche lorsqu’on sélectionne une option de cette liste. De plus, la propriété selectedIndex indique quelle option a été sélectionnée (0 pour la 1ère, 1 pour la 2ème, etc.). En associant l’instruction
onChange="document.formulaire.resultat.value = une valeur"

on déclenche l’affichage d’une valeur dans la boîte de texte « resultat ».

Fonction operation()
Elle a 3 arguments : val1 et val2 qui sont les valeurs transmises et operateur qui est le numéro de l’opérateur (0, 1, 2 ou 3). L’événement onChange lui transmet comme valeurs : document.formulaire.chiffre1.value pour val1, document.formulaire.chiffre2.value pour val2 this.selectedIndex pour operateur selectedIndex vaut 0 si on choisit l’addition, 1 si on choisit la soustration, etc.

Que signifie ce this ? On a vu ça dans la première leçon. On aurait pu remplacer this par document.formulaire.nom_liste (si on avait donné « nom_liste » comme nom à la boîte de liste), et on aurait écrit document.formulaire.nom_liste.selectedIndex. Comme l’instruction « onChange... » se trouve justement à l’intérieur de la balise <SELECT>, on peut utiliser this (pour faire plus court) qui indique l’objet en cours.

Les différentes parties d’une page HTML

Délimiteurs HTML La page est délimitée par les balises <HTML> et </HTML> En‐tête Limité par les balises <HEAD> et </HEAD>, cet en‐tête recevra la plupart de vos scripts, des fichiers .js ou des feuilles de styles inclus. Corps de la page Il est délimité par les balises <BODY> et </BODY> et contient tout votre code HTML ainsi que les scripts qui s’exécutent dans ce code.

Dans quelle partie de la page HTML doit‐on écrire son script ?
Réponse : là où c’est nécessaire...
Mais un principe de base : si votre script écrit dans la page (document.write() ), mettre le script à l’endroit de la page où il doit écrire ; sinon l’installer dans l’en‐tête (avant la balise </HEAD>) de la page

Dans la page, mais où ?
Voici un exemple :

<HTML>  avant la balise </HEAD>  <HEAD>  <SCRIPT LANGUAGE="Javascript">// script lu à l'ouverture de la page  <!­­ début de script  /* cette fonction sera lue et définie en début de page, mais elle ne sera  exécutée que lorsqu'on l'appelera (en appuyant le bouton, voir plus bas) */  function camarche() {  alert("oui, ça marche!");  }  // ligne exécutée en début de page  document.write("<font color='#FF0000'>la page commence à s'ouvrir (texte écrit  avant la balise </HEAD></font>");  ­­> // fin de script  </SCRIPT>  </HEAD>  dans la balise <BODY>  <!­­ la fonction appelée par onLoad est exécutée au chargement de la page ­­>  <!­­ et celle appelée par onUnload est exécutée lorsqu'on quitte la page ­­>  <BODY onLoad="camarche()" onUnload="alert('salut et à la prochaine')">  dans le corps de la page  <!­­ un formulaire ­­>  <FORM>  <INPUT TYPE=button VALUE="est­ce que ça marche?" onClick="camarche()">  <!­­ la fonction camarche() ne sera exécutée qu'en appuyant sur le bouton ­­>  <!­­ on aurait pu aussi bien se passer de la fonction camarche()  et écrire onClick="alert('oui, ça marche!')" ­­>  </FORM>  <p>Texte HTML dans la page</p>  <SCRIPT LANGUAGE="Javascript"> // script lu en fin de chargement de la page  <!­­ début de script  document.write("<font color='#FF0000'>texte écrit en milieu de page</font>");  ­­> // fin de script  </SCRIPT>  </BODY>  après la balise </BODY>  <SCRIPT LANGUAGE="Javascript"> // script lu en fin de chargement de la page  <!­­ début de script  document.write("<font color='#FF0000'>la page est chargée (texte écrit après la  balise </BODY></font>");  ­­> // fin de script  </SCRIPT> 

</HTML>

voir l’exemple On a utilisé un script dans le corps de la page (<INPUT TYPE=...>). Ce script est déclenché par un bouton, donc il ne sera utilisé qu’à ce moment‐là. Mais ce script fait appel à une fonction, qu’on a définie au début de la page. C’est une bonne méthode de définir les fonctions en tête de page : une fonction n’est exécutée que si elle est appelée. Le script défini dans le corps de la page sera exécuté au moment de sa lecture par le navigateur. Généralement, on peut dire qu’on place dans le corps de la page les scripts qui doivent écrire à cet endroit précis, les autres scripts devant être placés avant la balise
</HEAD>

Enfin, le dernier script est situé en fin de page, car il se déclenchera dès que la page est finie de charger.

Dans un fichier .js séparé
On peut également écrire son code Javascript dans un fichier séparé de la page qui l’utilise. C’est très utile lorsqu’on appelle les mêmes fonctions dans plusieurs pages de son site. Syntaxe Le fichier séparé est un fichier Javascript, d’extension .js, et qui ne contient que le code Javascript (définition de variables, de fonctions...), sans aucune balise HTML. On peut tout à fait écrire un fichier .js avec un éditeur texte comme le bloc‐notes de Windows. Il suffit de sauvegarder son fichier avec l’extension .js au lieu de .txt. Voici comment on appelle un fichier séparé dans sa page HTML :
<SCRIPT LANGUAGE="JavaScript" SRC="votre_fichier_javascript.js"></SCRIPT>

On peut le placer n’importe où, comme précédemment, mais de préférence avant la balise
</HEAD>

Évidemment, les appels aux fonctions définies dans ce fichier séparé devront se faire dans la page HTML. On peut également avoir le fichier séparé dans un autre répertoire :
<SCRIPT LANGUAGE="JavaScript" SRC="mon_rep/votre_fichier_javascript.js"></SCRIPT>  <SCRIPT LANGUAGE="JavaScript"  SRC="../mon_rep/votre_fichier_javascript.js"></SCRIPT>

Tous les navigateurs ne reconnaissent pas les fichiers .js séparés Jusqu’aux versions Netscape 3.04 et Internet Explorer 3.02 la définition d’un fichier .js séparé n’est pas reconnue ; certaines versions de Netscape 3.04 et Internet Explorer 3.02 le reconnaissent, pas d’autres... Après ces versions, pas de problème. Peut‐on utiliser plusieurs fichiers .js séparés ? Oui :

<SCRIPT  LANGUAGE="JavaScript"  SRC="votre_fichier_javascript1.js"></SCRIPT>  <SCRIPT LANGUAGE="JavaScript" SRC="votre_fichier_javascript2.js"></SCRIPT>

On peut aussi utiliser des fichiers .txt Vous pouvez aussi écrire vos scripts dans des fichiers .txt. Ca peut être utile si vous n’avez pas d’éditeur HTML pouvant sauvegarder vois fichiers en .js. Un exemple de fichier .js
// commentaire  var une_variable = "ma variable";  function ma_fonction1() {  document.write("<h3>Salut</h3>");  }  function ma_fonction2() {  $chaine = "<center>Salut</center>";  document.write(chaine);  }

Donc, rien d’autre dans ce fichier que du code Javascript. Pas d’en‐tête quelconque comme en HTML. On peut écrire des balises HTML mais dans un document.write() ou dans des variables qui doivent être affichées par un document.write().

3 remarques en passant
On a vu 2 méthodes de sortie :
alert("un message") qui affiche un message d’avertissement et document.write("un  texte") qui écrit dans la page en cours (mais uniquement au chargement de la page).

Les commentaires HTML et les commentaires Javascript :
<!­­ ce texte est un commentaire HTML ­­>  // ce texte est un commentaire Javascript, à ne mettre que dans un script  /* ce texte est encore un commentaire Javascript  qu'on peut écrire sur plusieurs lignes, à ne mettre que dans un script */

A quoi servent les lignes <!­­ début de script et ­­> // fin de script ? Elles permettent aux navigateurs ne reconnaissant pas le javascript d’ignorer le script (comme si c’était un commentaire) et de ne pas retourner d’erreur. De plus Netscape 4 renvoie une erreur Javascript si ces 2 signes de commentaires sont absents.

Les objets prédéfinis utilisés par le langage Javascript

L’organisation en objets
Le document HTML ou la page c’est la même chose. En Javascript on l’appelle « document ».

Le principe des objets (formulaires, images, liens, etc...) du document est la hiérarchisation. On peut comparer ça aux poupées russes. Le document a un formulaire appelé « nom_formulaire ». Ce formulaire a un champ (case) texte appelé « Nom » (dans lequel vous devez taper votre nom). Ce champ « Nom » a une propriété « value », qui est votre nom quand vous l’aurez saisi. Donc, en Javascript, la valeur de ce champ s’écrira :
document.nom_formulaire.Nom.value

Le point « . » sert de symbole de « filiation » entre objets et sous‐objets ou propriétés. de la même manière :
document.title vous donne le titre de la page (qui se trouve dans <TITLE>titre de la  page</TITLE>) document.nom_formulaire.name donnera « nom_formulaire », car c’est le nom du

formulaire
document.screen.width donnera la largeur de votre écran

Les collections
Le document possède une collection « images ». Ce sont toutes les images de la page. Par exemple les champs d’un formulaire ne font pas partie des "elements" de la page, mais ils font partie des "elements" du formulaire. document.images[0] est la première image de la page, document.images[1] est la deuxième, etc. En plus de la collection « images », il y a des collections comme « links » qui sont tous les liens hypertextes, « forms » représente tous les formulaires, etc. Exemple :
document.forms[0].name donnera « nomFormulaire »

De même les formulaires possèdent une collection « elements », qui sont tous les objets d’un formulaire, champs texte, boutons, cases à cocher, etc. Autre exemple de collection, si vous avez une série de boutons radio (boutons ronds parmi lesquels un seul ne peut être coché) appelés "boutonsronds", pour savoir lequel a été coché, il vous faudra utiliser la formule document.Formulaire.boutonsronds[i].checked ("i" étant un indice de recherche).

Les méthodes
En programmation objet, cela signifie les fonctions qui sont intégrées à un objet. Le document possède des méthodes, ainsi que les objets du document. On utilise toujours le point "." pour lier une méthode à son objet :

Exemple : le très courant document.write() qui écrit dans la page ou document.nomFormulaire.submit() qui envoie le formulaire. Les parenthèses sont indispensables, même s’il n’ya rien dedans. Cela indique à Javascript qu’il s’agit d’une fonction.

Les objets hors page
Dans une page HTML, il faut parfois s’occuper de se qui se passe en dehors... Par exemple, l’objet window caractérise la fenêtre du navigateur, différente de la page. Si vous avez des cadres dans votre fenêtre, chaque cadre contiendra une page (un document), et tous les cadres seront inclus dans la fenêtre (window). Vous pouvez ouvrir une autre fenêtre avec window.open(), et la refermer avec window.close(). L’objet location caractérise l’adresse Internet (l’URL) de votre page, mais il ne fait pas partie du document. location.href représente l’URL de la page ouverte. Si vous voulez charger la page "page2.htm", vous écrivez
location.href = "page2.htm

Pour revenir aux cadres : les cadres sont définis dans une "page de cadres", dans laquelle vous avez les balises

Les objets utilisateur
Vous pouvez vous aussi créer des objets à l’intérieur de la page et leur ajouter des propriétés et des méthodes, en utilisant le même principe.

Les types de données de base du langage Javascript et les tableaux

Les types de base en Javascript
page_chargee = true;  // vrai en anglais  x = 1;  y = x + page_chargee;  // donnera y = 2  texte = "2 v'là les flics!";  alerte = y + texte;  // donnera alerte = "22 v'là les flics!"

Voilà une horreur selon les « spécialistes » qui ont connu d’autres langages, mais bon, c’est possible en Javascript. On dit que Javascript est un langage à typage faible, c’est à dire qu’on peut affecter à peu près n’importe quoi à une variable. On distingue quand même 3 types de données de base : les booléens qui ne prennent que 2 valeurs « vrai » ou « faux » (true / false) les numériques, comme le nom l’indique les chaînes de caractères Exemples :
document.nom_formulaire.checkbox1.checked = true; a pour effet de cocher le bouton appelé « checkbox1 » du formulaire « nom_formulaire » (false aurait l’effet inverse)

var pi = 3.1416; affecte la valeur 3.1416 à la variable « pi » var nombre_jours = 365; affecte la valeur 365 à « nombre_jours » (le tiret « ‐ » est interdit dans le nom des variables, il faut utiliser le caractère de soulignement « _ ») var monNom = "Bernard Martin­Rabaud"; (on peut mettre n’importe quel caractère ‐ sauf quelques exceptions ‐ dans une chaîne de caractères) var vide = ""; c’est une chaîne de caractère vide, très utile... var tonNom = "je m'appelle 'Tania', et toi?";  var tonNom1 = 'je m

Related Interests

appelle "Tania", et toi?'; on peut mettre aussi une chaîne de caractères entre aopstrophes, dans ce cas les guillemets font partie de la chaîne, mais si on laisse l’apostrophe de « m’appelle » telle que, Javascript croira que la chaîne est ’je m’ et inquera une erreur car il ne comprendra pas ce qui suit. C’est pour cette raison qu’il faut placer un « \ » avant. var tonNom2 = "je m'appelle ###BOT_TEXT###quot;Tania###BOT_TEXT###quot;, et toi?"; on a conservé les guillemets autour

de "Tania", mais en les faisant précéder d’un « \ »
var fichier = "c:\images\image.gif"; lorsqu’on doit utiliser un antislash « \ » dans la

chaîne, il faut en mettre 2.

Les tableaux
Les tableaux sont des séries de données, généralement du même type (booléens, numériques ou chaînes de caractères), indicées de 0 jusqu’à ce qu’on veut. Peut‐on créer un tableau à 2 dimensions ? Non. Du moins pas directement. Il faut créer un tableau de tableaux. Pour créer un tableau, on utilise la fonction new et la donnée Array :
var tableau1 = new Array();  var tableau2 = new Array(10);

Dans le 1er tableau, le nombre d’éléments du tableau n’est pas défini, dans le second il y a 10 éléments. Contrairement au C, les valeurs à stocker dans le tableau ne sont pas définies à l’avance. On peut aussi copier un tableau à partir d’un autre :
var tableau3 = tableau2

C’est une copie "dynamique" : c’est‐à‐dire que si tableau2 est modifié, tableau3 le sera aussi automatiquement.
var tableau4 = eval(tableau2.toSource());

Ici c’est une copie "statique" : après la copie, les modifications ultérieures de tableau2 n’ont plus aucune influence sur tableau4.

On accède aux éléments du tableau de cette manière tableau1[0] ou tableau2[3]. Le premier élément de tableau1 est tableau1[0] et le dernier élément de tableau2 sera tableau[9] et non pas tableau2[10]. On peut donc affecter des valeurs aux tableaux :
tableau1[0] = 15;  tableau1[1] = "javascript";  tableau1[2] = 3.5;

Oui, on peut affecter des valeurs de différents types à un tableau. Ce n’est pas recommandé, car on ne sait plus très bien à quoi correspondent tel ou tel tableau, mais c’est possible. On peut également créer un tableau en lui affectant directement des valeurs :
var jours = new Array("lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi",  "dimanche");

Tableau à 2 dimensions Pour créer un tableau à 2 dimensions (plus de 2, c’est très rare), on crée un simple tableau. Puis on crée un tableau pour chaque élement.
var tableau = new Array();  tableau[0] = new Array("valeur01", "valeur02", ...);  tableau[1] = new Array("valeur11", "valeur12", ...);  etc.

Pour accéder à un élément du tableau à 2 dimensions :
var valeur = tableau[1][1]; // donne "valeur12"

Exemple : le tableau des visites de votre site par mois et par année.
var visites = new Array(12); // pour les 12 mois de l'année  visites[0] = new Array();  // tableau des visites du mois de janvier  visites[1] = new Array();  // tableau des visites du mois de février  visites[0][0] = 1000;  // nombre de visites du mois de janvier pour la  1ère année  visites[0][1] = 1250;  // nombre de visites du mois de janvier pour la  2ème année  visites[1][0] = 900;  // nombre de visites du mois de février pour la  1ère année

Les instructions conditionnelles « if ... else ... », « while »...
Il y en a de 4 sortes : le if et if...else (« si » et « si...sinon ») les boucles l’instruction switch les instructions de continuation ou de rupture

If et if...else
Voici des exemples

si la boîte de texte "Nom" du formulaire "NomFormulaire" est vide, on envoie un message d’alerte
if (document.NomFormulaire.Nom.value == "")  // condition toujours entre ()  alert("Vous avez oublié de donner votre nom");

si le navigateur du visiteur supporte les objets images (Netscape 4+ et Internet Explorer 4+), on appelle la fonction changerImages(), sinon on envoit un message d’alerte
if  (document.images)  changerImage();  else  alert("Votre navigateur ne peut visualiser le changement d'images");

si l’adresse e‐mail saisie dans la boîte de texte "Email" du formulaire "NomFormulaire" en contient pas de "@", on envoit un message d’alerte et on remet le curseur dans la boîte Email. Lorsque if (ou else) contient plusieurs instructions il faut mettre des accolades .
if (document.NomFormulaire.Email.value.indexOf("@") == ­1) {  alert("Votre adresse e­mail n'est pas valide);  document.NomFormulaire.Email.focus();  }

Forme raccourcie Dans certains cas où la condition est relativement simple, on peut utiliser ce raccourci : Cette fonction rajoute un "0" avant un nombre s’il est < 10, utile pour indiquer une date, du style 01/01/2000

function ajoute0si (nombre) {  if (nombre < 10)  var resultat = "0" + nombre;  else  var resultat = nombre;  return resultat;  }

On peut écrire plus simplement :

function ajoute0si (nombre) {  var resultat = (nombre < 10) ? "0" + nombre : nombre;  return resultat;  }

La syntaxe est :
(condition) ? résultat si condition vraie : résultat si condition fausse

Les boucles
Il y a l’instruction « for » (« pour ») et l’instruction « while » (« tant que »)

L’instruction « for » sert lorsqu’on veut parcourir totalement une série comme un tableau, tous les éléments d’un document ou d’un tableau L’instruction « while » sert lorsqu’on parcourt une série mais que l’on veut sortir si l’un des éléments de la série satisfait à une condition. Boucle for Cette boucle parcourt tous les éléments du tableau "tableau" sauf le dernier et a pour effet de supprimer le 1er élément et de déplacer tout le tableau d’un indice
for (i=0;i<tableau.length­1;i++)  tableau[i] = tableau[i+1];

Comme avec "if", s’il y a plusieurs instructions dans la boucle "for", il faut les encadrer par des accolades Boucle for...in Une autre boucle « for » : la boucle « for in ». Elle permet de parcourir les éléments d’un objet. C’est en particulier, la seule façon de parcourir un tableau dont les éléments ne sont pas indicés, mais indiqués par des valeurs alphabétiques. Exemple :
var age = new Array();  age["julie"] = 14;  age["nicolas"] = 15;  for (var i in age)  alert("l'âge de " + i + " est " + age[i]);

Cette boucle, pas souvent utilisée, peut fréquemment remplacer une boucle for (var i=0 ;i<fin ;i++). Boucle while Cette instruction parcourt un tableau "Prenoms" contenant des prénoms classés dans l’ordre alphabétique à la recherche du prénom "Tania" : si elle le trouve la boucle s’arrête
var i = 0;  while  (Prenoms[i] != "Tania") // "!=" veut dire différent de  i++; // "i++" signifie "i = i + 1"

En fait cette boucle peut tourner indéfiniment si le prénom "Tania" n’est pas trouvé ; il faut écrire :
var i = 0;  while  ((Prenoms[i] != "Tania") && (i < Prenoms.length))  i++;

Noter le "&&" qui signifie ET dans une condition Noter aussi les doubles () On peut écrire encore plus simplement :
var i = 0;  while  ((Prenoms[i] != "Tania") && (i++ < Prenoms.length))

car "i" est incrémenté (augmenté de 1) après la condition Boucle do...while Il existe aussi l’instruction « do ... while », qui est similaire à « while », mais on teste la condition à la fin de la boucle, au lieu de la tester au début. Exemple précédent :
var i = ­1;  do {  i++;  }  while  ((Prenoms[i] != "Tania") && (i < Prenoms.length));

Attention les boucles sont dangereuses ! Si, d’une manière ou d’une autre, votre boucle risque de boucler sans fin, vous allez planter votre machine et éventuellement celle de vos visiteurs.

L’instruction « switch »
Très utile lorsqu’on doit traiter les différentes valeurs d’une même donnée. Exemple : Cette fonction effectue la conversion en francs les valeurs de conversion ne sont pas garanties !
function conversion (somme, monnaie) {  if (monnaie == "euros")  somme *= 6.57;  else if (monnaie == "dollars")  somme *= 6.80;  else if (monnaie == "marks")  somme *= 3.35;  else if (monnaie == "livres")  somme *= 9.50;  else;  return somme;  }

Utilisation de "switch" :
function conversion (somme, monnaie) {  switch (monnaie) {  case "euros" :  somme *= 6.57;  break;  case "dollars" : somme *= 6.80;  break;  case "marks" :  somme *= 3.35;  break;  case "livres" :  somme *= 9.50;  break;  default :  somme = somme;  }  return somme;  }

La forme avec switch n’est pas nécessairement plus courte, mais elle est plus claire. La partie "default" sert lorsqu’aucune valeur ne correspond aux valeurs précédentes : elle est facultative. L’instruction break à la fin de chaque case est indispensable. Mais on peut l’omettre dans certains cas. Voici un exemple, qui indique comment accéder à un objet identifié par son id en fonction du navigateur :
function accesObjet(id, nav) {  switch (nav) {  case "nn4" : var obj = document.layers[id]; break;  case "ie4" : var obj = document.all[id]; break;  case "gecko" :  case "ie6" : var obj = document.getElementById(id);  }  }

Si le navigateur est "nn4", on exécute le premier case, si c’est "ie4" on exécute le second. Si c’est "gecko", comme on n’a pas de break, on passe au 4e case et on l’exécute. Si c’est "ie6" on exécute directement le 4e case. Notez qu’on n’a pas besoin de break au dernier case.

Les instructions de continuation et de rupture
break L’instruction break permet de sortir d’une boucle. On vient de la voir dans l’instruction switch. Voici un exemple d’une boucle de recherche d’un nom dans un tableau de noms :
var listeNoms = {"Marie", "Nicolas", "Gwenaël", "Pierre", "Julie"};  var continuer = true;  var i = 0;  while (continuer) {  if (nom == listeNoms[i]) continuer = false;  else if (i < listeNoms.length ­1) i++;  else continuer = false;  }  if (i < listeNoms.length) var trouve = true;  else var trouve = false;

et en utilisant "break" :
var i = 0;  while (i < listeNoms.length) {  if (nom == listeNoms[i]) break;  else i++;  }  if (i < listeNoms.length) var trouve = true;  else var trouve = false;

Si le nom est égal à listeNoms[i], l’instruction break permet de sortir de la boucle. L’utilisation de break permet un code plus succinct et plus rapide, car on économise la variable "continuer" et le test de cette variable à chaque boucle.

Notez que la numérotation d’un tableau commence à 0, et que le dernier élément vaut 4 ici, alors que listeNoms.length vaut 5 (5 éléments). continue L’instruction continue retourne directement au début de la prochaine boucle. Son utilisation est plus rare. Elle a l’effet inverse de break. Comme exemple, on va reprendre notre liste de noms et ajouter "Jean‐" seulement devant "Pierre".
var i = 0;  for (i=0;i<listeNoms.length;i++) {  if (listeNoms[i] != "Pierre") continue;  listeNoms[i] = "Jean­" + listeNoms[i];  } 

continue permet de retourner directement à la boucle suivante, sans exécuter l’instruction qui suit.

return l’instruction return, dans une fonction : permet de sortir (prématurément ou pas) de la fonction Voici le même exemple que précédemment, dans une fonction :
var listeNoms = {"Marie", "Nicolas", "Gwenaël", "Pierre", "Julie"};  function recherche(nom) {  var i = 0;  while (true) {  if (nom == listeNoms[i]) return true;  else i++;  }  return false;  }

Le premier return sort directement de la fonction, en retournant la constante true (vrai). Le second return retourne la constante false (faux), puisqu’on n’a pas trouvé l’argument « nom » dans la boucle while

Portée des variables en Javascript
Une variable javascript peut avoir une portée globale, elle est alors disponible dans la page en cours, ou une portée locale, elle n’est disponible que dans la fonction qui l’a déclarée. Voici un petit script où on trouve 2 déclarations d’une variable x :
<script language="Javascript">  <!­­  var x = 10; // variable globale  function increment(argument) {  // variable locale redéfinie  var x = argument + 1;

return x;  }  x = increment(x); // variable globale  // ­­>  </script>

L’identificateur x représente en fait 2 variables différentes : Une variable globale qui vaut 10 au début du script et vaut 11 à la fin, Une variable locale dans la fonction increment qui vaut argument + 1. C’est une variable locale, car elle a été redéfinie par le mot‐clé var. L’instruction x = increment(x) ; commence par affecter la valeur de la variable globale x (10) à l’argument de la fonction. Puis cet argument est augmenté de 1 pour être affecté à la variable locale x, qui vaut donc 11. Cette valeur est retournée par la fonction et affectée à la variable globale x. Dans cette autre version, on travaille directement avec la variable globale :
<script language="Javascript">  <!­­  var x = 10; // variable globale  function increment(argument) {  // variable globale  x = argument + 1;  }  increment(x);  // ­­>  </script>

On n’a pas de redéfinition de la variable x dans increment, donc il s’agit de la variable globale. On n’a pas besoin de return, puisque x est modifié "globalement" (pour tout le script). Et donc faire simplement increment(x) ; suffit pour modifier la variable.

Variables globales
Ce sont des variables définies dans le corps du script, en général tout au début. En dehors de toute fonction. On peut ensuite les utiliser dans tout le script, même à l’intérieur des fonctions. Leur valeur évolue au cours du déroulement du script.

<html>  <head>  <script language="Javascript">  <!­­  var x = 10; // variable globale  x = x + 1;  // ­­>  </script>  </head>  <body>  <script language="Javascript">

<!­­  // cette instruction doit afficher "x = 11"  alert("x = " + x); // toujours notre même variable globale  // ­­>  </script>  </body>  </html>

Ce code montre qu’une variable globale est également valide dans toute la page, même définie à l’intérieur de balises <script> différentes. Evidemment, une fois la page fermée, la variable est perdue.

Variables locales
Elles sont définies dans une fonction. Elles ne sont valables qu’à l’intérieur de cette fonction, elles sont détruites ensuite. Leur valeur n’est plus disponible en dehors. Si une variable, dans une fonction porte le même nom qu’une variable globale et est créée avec var, alors elle est considérée comme une nouvelle variable locale. C’est le cas dans le tout premier exemple. Si une variable dans une fonction porte le même nom qu’une variable globale et n’est pas créée avec var, alors il s’agit toujours de la même variable globale (2e exemple). Contrairement au C, une variable définie au sein d’un bloc (zone de code entre 2 accolades ) n’est pas une variable locale.

Autre exemple
Dans la fonction :
y définie avec var est une variable locale qui n’a rien à voir avec le y défini plus haut. par contre x est toujours la même variable globale définie au début, et x vaut 10 + 10 = 20

Après la fonction : x y vaut toujours 100 vaut maintenant 20

<script language="Javascript">  <!­­  var x = 10; // variable globale  var y = 100; // variable globale  function ajoute10() {  var y = 10; // variable locale  x = x + y; // variable globale x  }  ajoute10();  alert(x);  alert(y); // variable globale  // ­­>  </script>

Généralement, on ne s’amuse pas à redéfinir une variable locale de même nom qu’une variable globale. C’est une source de confusion. Par contre, il est préférable, si possible, d’utiliser des variables locales qui sont détruites après utilisation, plutôt que des variables globales qui restent en mémoire tant que la page est affichée.

Fonctions, arguments et appels de fonction
C’est un élément très important, car il y en a dans pratiquement tout script.

La syntaxe
function une_fonction(argument1, argument2...)  {  // corps de la fonction  }

Une fonction peut ne pas avoir d’arguments, mais on laisse les parenthèses vides. Ceux qui viennent du Basic seront un peu désarçonnés au départ :
sub une_fonction

donne en Javascript (la syntaxe vient de celle du C) :
function une_fonction() {  ....  }

Les arguments
Les arguments, situés dans les parenthèses à la suite du nom de la fonction, permettent au script de transmettre des variables à la fonction. Voici un exemple
// Exemple 1  var nombre = 10;  var carre = 0;  function carre_de (x) {  return x*x;  }  carre = carre_de(nombre);  nombre = carre_de(2);  document.write("carré = " + carre); // donnera "carré = 100"  document.write("nombre = " + nombre); // donnera nombre = 4

Dans cet exemple x est un argument de la fonction carre_de(). On peut appeler cette fonction en utilisant n’importe quelle variable numérique ou un nombre comme carre_de(2). La fonction utilise l’instruction return qui lui permet de retourner une valeur (une fonction ne peut retourner qu’une valeur).
// Exemple 2

var nombre = 10;  var carre = 0;  function carre_de (x) {  x = x*x;  }  carre = carre_de(nombre);  document.write("carré = " + carre); // donnera "carré = 0"

Dans ce 2ème exemple, la fonction fait un calcul interne. Si on écrivait l’instruction alert("x = " + x) ; à l’intérieur de la fonction, on afficherait "x = 100", mais la fonction ne retourne aucune valeur. Comme x n’est pas défini à l’extérieur de la fonction, si on écrivait cette instruction à l’extérieur, on aurait une erreur Javascript "x est inconnu".
// Exemple 3  var nombre = 10;  var carre = 0;  function carre_de () {  carre = nombre*nombre;  }  carre_de();  document.write("carré = " + carre); // donnera "carré = 100"

Dans ce 3ème exemple, on utilise ce qu’on appelle une "variable globale". Ce type de variable est définie à l’extérieur de la fonction, mais celle‐ci peut les utiliser et les modifications seront valides pour l’extérieur de cette fonction. Une fonction peut avoir comme arguments des variables booléennes, numériques, chaînes de caractère, des tableaux, des objets.

Valeur de retour
Une fonction peut retourner une valeur. Elle utilise pour cela le mot‐clé return, comme dans l’exemple 1. La fonction peut donc être appelée ainsi :
var valeur = fonction(arguments);

où valeur prend la valeur de retour de la fonction. Une valeur de retour peut être évidemment une chaîne de caractère, un nombre, mais aussi un tableau, ou un objet.
function jour_daujoudhui() {  return new Date();  }  var jour = jour_daujoudhui();  jour sera un objet Date() à la date du jour.

Retourner plus d’une valeur

Malheureusement une fonction ne peut retourner qu’une seule valeur. C’es parfois génant, si par exemple on veut retourner des coordonnées x et y. Il suffit alors de retourner un tableau ou un objet. Exemple :

function lireCoordonnees() {  var xcoord = 0;  var ycoord = 100;  var coords = new Array(xcoord, ycoord);  return coords;  }  var position = lireCoordonnees();  var x = position[0];  var y = position[1];

La fonction lireCoordonnees retourne un tableau. Voici le même exemple en retournant un objet :

function lireCoordonnees() {  var xcoord = 0;  var ycoord = 100;  var coords = {x:xcoord, y:ycoord);  return coords;  }  var position = lireCoordonnees();  var x = position.x;  var y = position.y;

L’instruction {x:xcoord, y:ycoord) est un façon rapide de créer un objet en Javascript (on utilise des accolades et non des parenthèses).

En Javascript les arguments sont passés par valeur
... et non par référence (pour ceux qui viennent du C ou du C++). Ca veut dire si un argument est modifié au sein de la fonction, cette modification n’a aucun effet à l’extérieur de celle‐ ci. C’est la valeur de la variable qui est transmise à la fonction, mais pas la variable elle‐ même. Exemple :
var nombre = 2;  document.write("Avant la fonction produit() nombre = " + nombre + "<br>");  function produit (nombre) {  nombre = nombre * 10;  document.write("Dans la fonction produit() nombre = " + nombre + "<br>");  return nombre;  }  document.write("Après la fonction produit() nombre = " + nombre");

Ca donne :

Avant la fonction produit() nombre = 2  Dans la fonction produit() nombre = 20  Après la fonction produit() nombre = 2

Si vous voulez modifier par fonction une variable : soit vous retournez une valeur, comme le 1er exemple carre = carre_de(nombre); soit il faut en faire une variable globale

Mais vous ne pouvez retourner qu’une seule variable Les objets Il en va autrement pour les objets et pour les tableaux en particulier, dont les modifications au sein d’une fonction sont conservées en dehors de celle‐ci.
var tab = Array(0, 1, 2);  function incremente(tableau) {  for (var i=0:i<tableau.length;i++) tableau[i]++;  }  incremente(tab);  document.write("tab = " + tab.join());

affichera : tab = {1,2,3}

Nombre variable d’arguments
En Javascript une fonction a un nombre fixe d’arguments. Mais dans certaines situations, on ignore à l’avance combien il y en aura. Voici un exemple : Cette fonction déclare les enfants d’un parent : celui‐ci est le 1er argument, les enfants viennent ensuite, mais on ignore combien ils sont. Le but de cette fonction est de créer une "classe" famille, d’où le mot‐clé this 
function famille () {  // nom_de_fonction.arguments est un tableau contenant les arguments de la  fonction  var args = famille.arguments;  this.nombre_enfants = args.length ­ 1; // args.length est le nombre d'arguments  this.parent = args[0]; // le premier argument est le parent  // on crée un tableau où on mettra tous les enfants  this.enfants = new Array();  // une boucle parcourt les arguments contenus dans "args" (à partir  // du second ­ 1 ­ jusqu'au dernier) pour ajouter les enfants au tableau  for (var i=1;i<args.length;i++)  this.enfants[i­1] = args[i];  }  var Martin = new famille("Olivier", "Nicolas", "Gaëlle", "Quentin", "Charlotte",  "Chloé");  var Scholz = new famille("Sabine", "Anja", "Elise");  document.write(Martin.parent + " a " + Martin.nombre.enfants + " enfants");  // donnera : "Olivier a 5 enfants"  document.write(Scholz.parent + " a " + Scholz.nombre.enfants + " enfants");  // donnera : "Sabine a 2 enfants"

document.write("L'ainé de " + Martin.parent + " est " + Martin.enfants[0]);  // donne "L'ainé de Olivier est Nicolas"

Valeur par défaut Pour ceux qui connaissent PHP, Javascript ne permet pas d’affecter une valeur par défaut à un argument. Il faut utiliser le même système du nombre variable d’arguments. Voici un exemple :

<?php  function ajouter($x, $valeur=1) {  $x += $valeur;  return $x;  }  $x = 10;  echo "\$x = " . ajouter($x, 10); // écrit "$x = 20"  echo "\$x = " . ajouter($x);  // écrit "$x = 11"  ?>

Equivalent Javascript :

function ajouter(x) {  if (arguments.length == 2) var valeur = arguments[1];  else var valeur = 1;  x += valeur;  return x;  }  var x = 10;  alert("x = " + ajouter(x, 10)); // affiche "x = 20"  alert("x = " + ajouter(x));  // affiche "x = 11"

Dans la fonction ajouter, si on a 2 arguments, la variable valeur prend la valeur de cet argument, sinon valeur prend la valeur 1 par défaut.

Appels de fonctions
L’appel de fonction se fait comme dans l’exemple :
carre = carre_de(nombre);

ou carre_de(nombre) ; si la fonction ne retourne aucune valeur Une fonction peut en appeler une autre. Mais pour qu’une fonction soit appelée, il faut qu’elle soit définie, c’est‐à‐dire écrite, avant d’être appelée. Ici, la fonction "calculeTVA" appelle la fonction "monetaire"
// cette fonction formatte un nombre au format monétaire  function monetaire (x) {  var cents = Math.round(x*100) ­ Math.floor(x)*100;  if (cents < 10) cents = "0" + cents;  x = Math.floor(x) + "," + cents + " €";  return x;

}  function calculeTVA (somme, tauxTVA) {  return monetaire(somme * tauxTVA);  }

La récursivité
Une fonction peut éventuellement s’appeler elle‐même, ce qui est une exception à ce qui vient d’êtrre écrit... C’est ce qu’on appelle la "récursivité", à manipuler avec précautions. L’utilisation principale de la récursivité est la manipulation de données structurées en "arbre" : très employé dans les recherches. Mais voici l’exemple classique de la factorielle : factorielle(1) = 1, factorielle(2) = 2*1 = 2, factorielle(3) = 3 * factorielle(2) = 3*2 = 6, etc.
function factorielle(n) {  if (n > 1)  return n * factorielle(n­1);  else return 1;  }

Voici comment cela fonctionne, avec factorielle(4) : n instruction
4 appel de factorielle(3); 3 appel de factorielle(2); 2 appel de factorielle(1); 1 return 1; 2 return 2 * factorielle(1); // = 2 * 1 = 2 3 return 3 * factorielle(2); // = 3 * 2 = 6 4 return 4 * factorielle(3); // = 4 * 6 = 24

La fonction appelle successivement factorielle(4) jusqu’à factorielle(1), puis les appels remontent de factorielle(1) à factorielle(4). Souvent la forme récursive est 3 à 4 fois plus courte que la forme non récursive (ce qui n’est pas le cas ici), mais le problème est l’appel de la même fonction en cascade, ce qui bouffe de la mémoire... Si vous avez une grosse fonction récursive ou une fonction récursive qui manipule de gros données, vous risquez un « dépassement de pile » (ou « stack overflow »), car les fonctions (récursives ou pas) sont placées en mémoire dans une pile au moment de leur appel, et retirées de la pile dès qu’elles ont terminé. Et ici dans le cas des factorielles, lorsque n = 1 ; on aurait 4 fonctions factorielle() empilées.

Les fonctions prédéfinies
Javascript possède un certain nombre de fonctions prédéfinies dont le nombre enfle à mesure de la sortie de nouvelles versions du langage. Les fonctions Objet.méthode() Ces fonctions sont généralement liées à un objet (document, fenêtre, formulaire, bouton...) et elles doivent être écrites derrière l’objet. Ex :

document.write('écrit un texte dans la page');

qui est la fonction "write" utilisée uniquement avec l’objet "document" (la page en cours). Du fait que ces fonctions sont liées ou plutôt intégrées à un objet, on les appelle des "méthodes" (terminologie orientée‐objet). Vous trouverez toutes les méthodes Javascript dans la référence du langage sur le site de Netscape (en anglais) : http://developer.netscape.com/docs/manuals/js/client/jsguide/index.htm Les méthodes qui s’écrivent indépendamment d’un objet Quelques méthodes ne sont pas liées à un objet (on devrait dire alors "fonctions") :
escape(), unescape(), eval(), taint() et untaint(). et doivent être écrites seules.

D’autres méthodes sont liées à la fenêtre en cours :
alert(), prompt(), confirm() et peuvent également être écrites seules : alert("ce message est affiché sur la fenêtre; cliquez OK pour le refermer");

Les méthodes de l’objet Math Enfin, une série de méthodes est liée à l’objet Math qui n’est pas un objet "palpable" comme une fenêtre ou un bouton. Ce sont toutes les méthodes de calcul :
Math.sin(), Math.cos(), Math.floor(), Math.round()....

Cet objet Math possède aussi des propriétés, par exemple Math.PI qui vaut 3.14159...

Créer ses propres objets en Javascript
Javascript met à votre disposition une panoplie d’objets qui sont, en fait, basés sur les constituants d’une page HTML : document, image, browser... Vous apprendrez à les connaître. Il est également possible de créer ses propres objets. AMHA, c’est là l’intérêt principal du langage. Et c’est le propos de cette modeste page...

Pourquoi créer des objets ?
Ils permettent de créer des entités indépendantes : modifiables sans pour autant toucher au reste du script réutilisables telles quelles dans d’autres scripts Exemple Je veux gérer des articles que je désire vendre en ligne. Ces articles serviront dans un script permettant au visiteur de trouver de l’information et de visualiser une photo de cet article, et dans un autre script lui permettant de les commander.

Définition de l’objet Voici la fonction qui crée une "classe" d’articles. Le mot réservé "this" indique que les propriétés "nom", "libelle"... appartiennent à l’objet en cours.
function typeArticle(nom, libelle, prix, tauxTVA, image, description) {  this.nom = nom;  this.libelle = libelle;  this.prix = prix;  this.tauxTVA = TauxTVA[tauxTVA];  this.image = "images/" + image + ".gif";  this.descro = "articles/" + description + ".htm";  }

Ajouter des méthodes à l’objet Voici quelques "méthodes" (fonctions liées à un objet) :
function calculeTVA(valeur) {  return valeur * this.tauxTVA;  }  function montantHT(quantite) {  return quantite * this.prix;  }  function montantTTC(quantite) {  var valeur = this.montantHT(quantite);  return valeur + this.calculeTVA(valeur);  }  function description() {  location.href = this.descro;  }  function afficheArticle() {  document.write(this.nom + unescape("%09") + this.libelle +  unescape("%09") + this.prix + " FF");  }

unescape("%09") permet d’écrire un car de tabulation (TAB) On remarquera qu’on peut appeler d’autres fonctions ou méthodes liées à typeArticle en les faisant précéder de "this". De même les propriétés de typeArticle sont aussi précédées de "this". Mais ces fonctions ne sont pas liées à typeArticles. Il faut déclarer ensuite :
typeArticle.prototype.calculeTVA = calculeTVA;  typeArticle.prototype.montantHT = montantHT;  typeArticle.prototype.montantTTC = montantTTC;  typeArticle.prototype.description = description;  typeArticle.prototype.affiche = afficheArticle;

Quelques observations :
Il n’est pas indispensable de donner le même nom que la fonction d’origine Il ne faut pas mettre de () aux fonctions. Voilà, les 5 fonctions sont maintenant réellement des méthodes de typeArticle

Une collection d’objets L’intérêt des objets est de pouvoir traiter des ensembles d’objets. On utilise pour ça un tableau :
var Articles = new Array();  function creeArticle(nom, libelle, prix, tauxTVA, image, description) {  Articles[Articles.length] = new typeArticle(nom, libelle, prix, tauxTVA, image,  description);  }  creeArticle("vélo­enfant", "vélo pour enfant", 1000, 2, "enfant", "enfant");  creeArticle("vélo­dame", "vélo pour dame", 1500, 2, "dame", "dame");  creeArticle("vélo­homme", "vélo pour homme", 1500, 2, "homme", "homme");  function listeArticles() {  var i = 0;  for (i=0;i<Articles.length;i++)  Articles[i].affiche();  }  function factureTTC() {  var i, total = 0;  var args = factureTTC.arguments;  for (i=0;i<args.length;i++)  total += Articles[i].montantTTC(args[i]);  }

La fonction creeArticles :
elle utilise la propriété length de tout tableau = le nombre d’éléments qu’il contient. dans chaque élément de ce tableau Articles, on crée un objet typeArticle Ensuite, on appelle creeArticle pour créer autant d’objets typeArticle qu’on veut. Ces objets sont ajoutés au tableau de l’indice 0 à 2 (ici).

La fonction listeArticles :
parcourt tout le tableau Articles et pour chaque élément affiche les infos de cet article en faisant appel à la méthode "affiche" de typeArticle, puisque chaque élément du tableau est un objet typeArticle.

La fonction factureTTC :
Elle est un peu plus complexe, quoique sur le même principe. Elle s’utilise ainsi :
factureTTC(0, 1)

où les arguments sont les quantités commandées : soit ici 0 vélo homme, 1 vélo femme, 0 vélo enfant. Ca revient au même d’écrire
factureTTC(0, 1, 0)

mais pas d’écrire :
factureTTC(1)

car on penserait que c’est un vélo homme qui a été commandé. On utilise pour cela une fonction à nombre variable d’arguments : voir pour cela le tutoriel précédent.

Intérêt des objets
Espérons que ce rapide survol des objets vous donnera une idée de la technique. L’intérêt de cette technique est de séparer les entités. Tout ce qui concerne les articles est implémenté dans la classe typeArticle et ses méthodes. Ensuite, on peut faire appel aux méthodes de la classe sans s’occuper de ce qu’il y a dedans. Un exemple un peu plus spectaculaire des objets se trouve dans les scripts avec les boules qui rebondissent ou qui entrent en collision : il suffit d’implémenter le comportement de l’objet boule, ensuite on peut créer autant de boules qu’on veut, chacune vit sa propre vie indépendamment des autres et en intéraction avec les autres.

La programmation objet en Javascript
Javascript n’est pas vraiment un langage objet, comme C++ ou Java, et même PHP. Mais les fonctionnalités objets de ce langage permettent de créer des simili‐classes, des méthodes et même d’utiliser l’héritage.

Bref historique de la programmation
Le code au kilomètre... Au début, on écrivait son code ligne par ligne, avec des renvois à un numéro de ligne. Les programmes étaient heureusement courts, mais dès qu’ils se sont allongés, c’était illisible. La programmation fonctionnelle On a eu idée de créer des fonctions, qui permettaient de ne pas écrire plusieurs fois les mêmes sections de code, et surtout de concentrer des actions du programme dans de petites unités. La programmation orientée‐objet (POO) On s’est aperçu que notre mode de pensée fonctionne par objets : un stylo qui permet d’écrire, qui a telle couleur, une feuille de papier qui contient tel texte ou qui est vide... Un objet est constitué de propriétés (la couleur, la marque du stylo) et de méthodes, c’est‐à‐ dire, les fonctions qui décrivent le comportement de l’objet ou les actions qu’on peut lui faire faire (écrire avec un stylo, remplir sa recharge, le ranger...). Les avantages de la POO un code plus clair à lire et et plus facile à modifier réutilisation des classes pour d’autres scripts

Définitions

On va commencer par quelques définitions pour ceux qui ne connaissent rien à la POO (programmation orientée objet). Classe Une classe décrit un catégorie d’objets, comme des personnes ou des voitures... La classe contient des propriétés inhérentes à l’objet décrit, plus des méthodes ou fonctions qui définissent le comportement de l’objet. On a souvent tendance à confondre classe et objet. La classe est un concept, elle décrit l’objet, tandis que l’objet est un élément concret. On verra avec les exemples. En Javascript, la classe n’existe pas en temps que définition. Dans les véritables langages objets, on définit une classe et ses objets ainsi :
class MaClasse {  propriete1;  propriete2;  // constructeur de la classe  function MaClasse() {  ...  }  function methode1() {  ...  }  }

fin de la classe
monObjet = new MaClasse(); // création de l'objet monObjet

On verra comment on fait en Javascript Objet Une fois la classe définie, on peut créer des objets sur le modèle de cette classe. Le langage crée alors une copie de la classe (avec les propriétés et les méthodes) pour chaque objet créé. Propriété Une propriété est une variable qui décrit un aspect de la classe. Ainsi document.title décrit la propriété « titre » du document (la page). Méthode Une méthode n’est rien d’autre qu’une fonction incluse dans une classe. Ainsi document.write() est une méthode de la classe document, alors que new() (qui permet de créer un objet à partir d’une classe) est une fonction du langage, donc rattachée à aucun objet. Constructeur Un constructeur est une méthode spéciale, qui est appelée à chaque fois qu’on crée un objet avec la fonction new().

Javascript n’a pas de type « classe », mais il le remplace par un constructeur. Et c’est le constructeur qui décrit la classe. En fait, constructeur et création de classe est mélangé. Destructeur Un destructeur est une fonction qui permet de supprimer un objet. Il n’est pas possible d’en créer un en Javascript : le destructeur par défaut est appelé par la fonction delete(objet) Héritage Dans certains cas, on peut définir une hiérarchie d’objets, des plus simples aux plus complexes. On a une classe de base, qui contient le minimum de propriétés et de méthodes. Puis des classes dérivées, contenant des propriétés et des méthodes plus spécialisées. Ces classes dérivées peuvent hériter alors des propriétés et des méthodes de la classe de base, sans les redéfinir. Le mécanisme d’héritage de Javascript est assez sommaire, mais il a le mérite d’exister.

Créer une classe et des objets en Javascript
On veut gérer un parc de voitures. Voici comment on peut s’y prendre (les voitures sont définies plutôt sommairement pour l’exemple).

Définition de la classe
Constructeur
function clVoiture(la_marque, le_modele, le_numero, kilometrage, le_prix) {  this.marque = la_marque;  this.modele = le_modele;  this.numero = le_numero;  this.km = kilometrage;  this.prix = le_prix;  }

« marque », « modele », « annee », « km » et « prix » sont les propriétés de la classe clVoiture. L’opérateur « this » indique que ces variables sont des variables rattachées à clVoiture. Les noms des paramètres (« la_marque », etc. sont différents des noms des propriétés, pour montrer que ce sont 2 choses différentes. Mais on aurait pu donner les mêmes noms, Javascript sachant quels sont les paramètres et quelles sont les propriétés :
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  }

On a dit (page précédente) que Javascript n’a pas de type classe. En effet, et cette fonction clVoiture n’est pas une classe, mais le constructeur de la classe clVoiture. Javascript n’a besoin que du constructeur pour créer une classe.

On peut mettre du code dans le constructeur, par exemple, indiquer directement le prix en euros :
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix + " €";  }

Instancier des objets
Voilà un terme qui vous paraît peut‐être étranger... On dit aussi créer une « instance » de classe, c’est‐à‐dire créer un objet réel, à partir de la définition du constructeur. On utilise pour ça l’opérateur new constructeur(params).

Pour créer des voitures :
var voiture1 = new clVoiture("Renault", "Safrane", "1245 AAA 34", 25000, 10000);  var voiture2 = new clVoiture("Opel", "Vectra", "7894 XS 30", 40000, 8000);

Assigner un objet à une variable ou à un argument de fonction C’est facile :
var ma_voiture = voiture1;  ma_voiture.modele; // donnera "Safrane"

Passer un objet en tant qu’argument de fonction, idem :
function modele_de_voiture(voiture) {  return voiture.modele;  }  modele_de_voiture(voiture1); // donnera "Safrane"

Autre façon de créer des objets
Il existe une autre manière de créer des objets, sans passer par un constructeur. C’est plus simple, mais on verra plus tard que c’est plus limité, car on ne peut pas leur rattacher de méthode.
var voiture1 = {marque:"Renault", modele:"Safrane", numero:"1245 AAA 34", km:25000,  prix:10000};  var voiture2 = {marque:"Opel", modele:"Vectra", numero:"7894 XS 30", km:40000,  prix:8000};

Attention : ce sont des accolades { } et non plus des parenthèses ( ).

Accès aux objets et à leurs propriétés
On utilise la « syntaxe à points » comme pour les objets prédéfinis :

document.write(voiture1.numero); // écira "1245 AAA 34"  document.write(voiture2.marque); // écrira "Opel"

Unicité des propriétés
Supposons qu’on veuille aussi définir une classe clClient, avec un numéro, un nom et un numéro de téléphone (la notation clXXX est une notation personnelle conforme à la notation hongroise)
function clClient(numero, nom, tel) {  this.numero = numero;  this.nom = nom;  this.tel = tel;  }  var client1 = new clClient("1245", "Pierre Sachard", "0412345678");  document.write(client1.numero); // donnera "12345"  document.write(voiture1.numero); // donnera "1234 AAA 34"

Javascript ne confond pas les 2 numéros, sachant bien que le 1er appartient à client1 de la classe clClient et le 2e à voiture1 de la classe clVoiture.

Les tableaux d’objets
Le principal intérêt des classes est de créer une structure (la classe ou le constructeur de classe pour Javascript) et d’instancier une série d’objets à partir de cette classe. D’où l’utilisation presque systématique de tableaux d’objets. Voici une façon de faire que j’utilise couramment :
var t_voitures = new Array();  function voiture(marque, modele, numero, km, prix) {  t_voitures[t_voitures.length] = new clVoiture(marque, modele, numero, km, prix);  }  voiture("Renault", "Safrane", "1245 AAA 34", 25000, 10000);  voiture("Opel", "Vectra", "7894 XS 30", 40000, 8000);

On crée ainsi un tableau de 2 objets clVoiture. Et par exemple pour afficher un listing de toutes les voitures :
function listing_voitures() {  for (var i=0;i<t_voitures.length;i++)  document.write(t_voitures[i].affiche());  }

Définir le comportement des ses objets avec des méthodes
En POO, il existe en gros 2 sortes de méthodes, les méthodes privées, qui sont appelées au sein de la classe et inacessibles en dehors et les méthodes d’interface ou publiques, qu’on peut appeler du dehors de la classe. En Javascript tout est public, propriétés et méthodes. Mais pour avoir vraiment des objets indépendants, il est préférable de ne pas accéder directement aux propriétés des objets, et d’utiliser des méthodes pour cela.

Les 3 manières de créer des méthodes
On va créer une méthode qui affiche les infos d’une voiture, pour l’utiliser dans un listing. On va l’appeler simplement affiche(). Définition dans le constructeur
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  this.affiche = clVoiture_affiche;  }  function clVoiture_affiche() {  return this.marque + " " + this.modele + " " + this.numero + " " + this.km + " kms  " + this.prix + " €<br>";  }

Remarques :
dans la définition this.affiche  =  clVoiture_affiche;, on n’indique pas de (), dans la définition de la fonction clVoiture_affiche(), on fait référence aux propriétés de l’objet en utilisant l’opérateur « this », parce que cette fonction est une méthode.

Appel de la méthode
On utilise la même notation que pour les propriétés :
document.write(voiture1.affiche());  //  écrira  "Renault  Safrane  1245  AAA  34  25000  kms 10000 €"

Utilisation de la propriété « prototype »
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  }  function clVoiture_affiche() {  return this.marque + " " + this.modele + " " + this.numero + " " + this.km + " kms  " + this.prix + " €<br>";  }  clVoiture.prototype.affiche = clVoiture_affiche;

Remarques :
le résultat est exactement le même que dans la définition précédente : on crée une méthode affiche(), mais la définition est faite à l’extérieur du constructeur, grâce à la propriété « prototype », dans le prototype : à gauche du signe « = » le nom de la méthode, à droite le nom de la fonction correspondante,

cette façon de faire est la plus souple, car on peut définir le prototype n’importe où dans le script. Définition de la méthode directement dans le prototype
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  }  clVoiture.prototype.affiche = new function() {  return this.marque + " " + this.modele + " " + this.numero + " " + this.km + " kms  " + this.prix + " €<br>";  }

Remarques :
cette façon de faire est plus simple que la précédente, puisqu’on ne crée plus de fonction
clVoiture_affiche(),

cependant, il faut écrire la méthode avant le code qui l’appellera, contrairement à la façon précédente qui permet plus de liberté à ce niveau‐là, les 2 dernières façons de créer des méthodes sont les seules utitlisables, si on veut ajouter de nouvelles méthodes à des objets Javascript prédédinis. 

String  Bibliothèque de méthodes additionnelles à l’objet String (chaînes de caractères) 

alphanumer ique 
­ Détermine si une chaîne de caractères est alphanumérique  Cette méthode retourne "true" si la chaîne ne contient aucun caractère non alphanumérique,  sinon elle retourne "false". L’espace et les caractères « ’ » (apostrophe) et « ­ » (tiret) sont  acceptés comme caractères alphabétiques.  Syntaxe : chaine.alphanumerique();  Exemple : 
var chaine = "Les 2 fenêtres d'à côté";  if (chaine.alphanumerique()) alert(chaine + "est alphanumérique");  else  alert(chaine + "n'est pas alphanumérique");  var chaîne = "15 €";  if (chaine.alphanumerique()) alert(chaine + "est alphanumérique");  else  alert(chaine + "n'est pas alphanumérique"); 

Donnera "Les 2 fenêtres d’à côté est alphanumérique"  et "15 € n’est pas alphanumérique" 
String.prototype.alphanumerique = function() {  re = /^[\s0­9A­Za­zéèêëàâäçîïôöùûüÉÈÊËÀÂÄÎÏÔÖÙÛÜ

Related Interests

­]+$/;  if (this.search(re) != ­1) return true;

else return false;  } 

Compatibilité Netscape 4  Cette méthode n’est pas compatible Netscape 4. En effet, la fonction search() (ainsi que  match()) avec des caractères accentués provoque un plantage de cette version de Netscape (ce  qui n’est pas le cas avec les versions suivantes).  Voici un correctif qui fonctionne avec tout navigateur : 
String.prototype.est_alphanum = function() {  re = /^[\s0­9A­Za­  z&eacute;&egrave;&ecirc;&euml;&agrave;&acirc;&auml;&ccedil;&icirc;  &iuml;&ocirc;&ouml;&ugrave;&ucirc;&uuml;&Eacute;&Egrave;&Ecirc;&Euml;&Agrav  e;  &Acirc;&Auml;&Icirc;&Iuml;&Ocirc;&Ouml;&Ugrave;&Ucirc;&Uuml;

Related Interests

­]+$/;  if (this.search(re) != ­1) return true;  else return false;  } 

(tous les codes doivent être sur la même ligne, ici le passage à la ligne a été fait pour la  lecture)  Il est nécessaire que la chaîne à analyser soit aussi codée en caractères équivalents HTML. Et  pour que votre éditeur HTML affiche ces caractères en équivalents HTML, il doit être en  codage 7 bits, c’est­à­dire enlever la directive META : <meta http­equiv="Content­Type"  content="text/html; charset=iso­8859­1">  (qui normalement dispense de ce codage). 

bin_en_decimal 
­ convertit une chaine binaire en nombre décimal  La solution la plus simple pour convertir une chaîne binaire en décimal est : 
var decimal = parseInt(chaine, 2); 

Exemple : 
var chaine = "0101";  parseInt(chaine, 2); // donne 5 

Cette méthode permet d’utiliser des valeurs signées. Elle convertit une chaîne de caractères  sous la forme binaire (ex. : "0101" = 5) en nombre décimal.  Elle prend un argument optionnel "signed", "vrai" si le nombre est signé, "faux" s’il ne l’est  pas ou si l’argument est omis. Par exemple "1111" vaut 15 si le nombre est non signé ou ­1  s’il l’est. 

Syntaxe

chaine.bin_en_decimal([signed]); 

Exemples 
var chaine = "0101";  chaine.bin_en_decimal(); // donnera 5  chaine.bin_en_decimal(true); // donnera encore 5  var chaine = "1111";  chaine.bin_en_decimal(); // donnera 15  chaine.bin_en_decimal(true); // donnera ­1 

Code 
String.prototype.bin_en_decimal = function() {  if ((arguments.length) && arguments[0]) signed = true;  else signed = false;  var chaine = this;  var nombre = 0;  for (var i=0;i<chaine.length;i++) nombre = nombre * 2 +  parseInt(chaine.charAt(i));  if (signed) return ­1 ­ ~nombre;  else return nombre;  } 

ch_r epeter  
­ répète une chaîne  Retourne une chaîne de caractères constituée de « nombre » fois la « sous­chaîne »  syntaxe : var chaine = ch_repeter(sous_chaine, nombre);  exemple : var chaine = ch_repeter("_|", 20);  donnera "_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|" 
function ch_repeter(sous_chaine, nombre) {  var ch = "";  for (var i=0;i<nombre;i++) ch += sous_chaine;  return ch;  } 

contient_car s 
­ fonctionne comme indexOf, mais avec plusieurs caractères  Cette méthode indique si une chaîne de caractères contient un des caractères en argument.  Mais contrairement à indexOf, la méthode ne retourne que "true", si un des caractères a été  trouvé, et "false" sinon.  Syntaxe : chaine.contient_cars(cars);  Exemples :

var chaine = "l'abat­jour";  chaine.contient_cars("­'"); // retourne "true"  chaine.contient_cars("x­"); // retourne "true" (puisque la chaîne contient  "­")  chaine.contient_cars("xyz"); // retourne "false"  String.prototype.contient_cars = function(cars) {  for (var i=0;i < cars.length;i++) {  if (this.indexOf(cars.charAt(i)) != ­1) return true;  }  return false;  } 

contr oler _taille 
­ détermine si la longueur d’une chaîne est comprise entre min et max  Cette méthode retourne « vrai » si la longueur de chaîne de caractères est comprise entre les  valeurs « min » et « max » en argument, et si la chaîne n’est pas vide. Si l’argument « max »  est omis, ou s’il est nul, la chaîne n’aura pas de limite maximum.  Cette méthode pourra être utile pour contrôler les champs texte d’un formulaire.  Syntaxe : chaine.controler_taille(min[, max]);  Exemples sur 
var chaine = "Ceci est un commentaire de 40 caractères";  if (chaine.controler_taille(10, 50)); // retourne vrai, car la taille de la  chaîne est comprise entre 10 et 50 caractères  if (chaine.controler_taille(10); // retourne vrai, car la chaine a plus de  10 caractères  if (chaine.controler_taille(0, 50); // retourne vrai, car la chaine a moins  de 50 caractères  if (chaine.controler_taille(10, 30); // retourne faux, car la chaine a plus  de 30 caractères  String.prototype.controler_taille = function(min) {  if (this.length < min) return false;  else {  if (arguments.length == 2) return this.length <= arguments[1];  else return true;  }  } 

dr oite 
­ retourne les derniers caractères d’une chaîne  Si l’argument "nombre" est nul ou n’est pas un nombre, la méthode retourne la chaîne en  entier.  Si l’argument "nombre" est positif, la méthode retourne les "nombre" derniers caractères de la  chaîne (si "nombre" est plus grand que la longueur de la chaîne, c’est toute la chaîne qui est  retournée).  Si l’argument "nombre" est négatif, la méthode retourne la chaîne amputée des "nombre"

premiers caractères (si "nombre" est plus grand, en valeur absolue, que la longueur de la  chaîne, une chaîne vide retournée).  Syntaxe : chaine.droite(nombre);  Exemples avec 
var chaine = "abcdefghij"; // 10 caractères  machaine = chaine.droite(2); // donne machaine = "ij"  machaine = chaine.droite(­8); // donne aussi machaine = "ij"  machaine = chaine.droite(20); // donne machaine = "abcdefghij"  machaine = chaine.droite(­20); // donne machaine = ""  machaine = chaine.droite("2"); // donne machaine = "abcdefghij" ("2" n'est  pas un nombre)  String.prototype.droite = function(nombre) {  if (!nombre || isNaN(nombre)) return this;  else if (nombre >= 0) {  if (nombre >= this.length) return this;  else return this.substring(this.length­nombre, this.length);  }  else if (Math.abs(nombre) >= this.length) return "";  else return this.substring(this.length+nombre);  } 

email_valide 
­ fonction vérifiant si une adresse e­mail est valide  Retourne "true" si l’adresse e­mail est valide, "false" sinon. Ne vérifie pas si l’adresse est  réelle.  syntaxe : email_valide(adresse);  exemple : 
adresse = "untel@domaine.fr";  if (email_valide(adresse)) alert("Votre adresse e­mail est valide");  else alert("Votre adresse e­mail est erronée);  function email_valide(adresse) {  return (adresse.search("^[_a­z0­9­]+(\.[_a­z0­9­]+)*@[a­z0­9­]+([\.][a­z0­  9­]+)+$") != ­1);  } 

gauche 
­ retourne les premiers caractères de la chaîne  Si l’argument "nombre" est nul ou n’est pas un nombre, la méthode retourne la chaîne en  entier.  Si l’argument "nombre" est positif, la méthode retourne les "nombre" premiers caractères de  la chaîne (si "nombre" est plus grand que la longueur de la chaîne, c’est toute la chaîne qui est  retournée).  Si l’argument "nombre" est négatif, la méthode retourne la chaîne amputée des "nombre"

derniers caractères (si "nombre" est plus grand, en valeur absolue, que la longueur de la  chaîne, une chaîne vide retournée).  Syntaxe : chaine.gauche(nombre);  Exemples avec 
var chaine = "abcdefghij"; // 10 caractères  machaine = chaine.gauche(2); // donne machaine = "ab"  machaine = chaine.gauche(­8); // donne aussi machaine = "ab"  machaine = chaine.gauche(20); // donne machaine = "abcdefghij"  machaine = chaine.gauche(­20); // donne machaine = ""  machaine = chaine.gauche("2"); // donne machaine = "abcdefghij" ("2" n'est  pas un nombre)  String.prototype.gauche = function(nombre) {  if (!nombre || isNaN(nombre)) return this;  else if (nombre >= 0) {  if (nombre >= this.length) return this;  else return this.substr(0, nombre);  }  else if (Math.abs(nombre) >= this.length) return "";  else return this.substr(0, this.length+nombre);  } 

hexa_en_decimal 
­ traduit un nombre héxadécimal en décimal  La solution la plus simple pour convertir une chaîne hexadécimale en décimal est : 
var decimal = parseInt(chaine, 16); 

Exemple : 
var chaine = "FC";  parseInt(chaine, 16); // donne 252 

Cette méthode permet d’utiliser des valeurs signées. Elle convertit la chaîne hexadécimale et  retourne un nombre décimal. Si l’argument optionnel "signed" est "true", la chaîne est  considérée comme une valeur signée (utile pour les nombres négatifs), sinon si "signed" est  "false" ou omis la chaine est considérée comme une valeur non signée. 

Syntaxe 
chaine2 = chaine1.hexa_en_decimal([signed]); 

Exemples 
chaine1 = "FC";  chaine2 = chaine1.hexa_en_decimal(); // chaine2 = "252"  chaine1 = "FFFFFF04";  chaine2 = chaine1.hexa_en_decimal(); // chaine2 = "4294967044"  chaine1 = "FFFFFF04";  chaine2 = chaine1.hexa_en_decimal(true); // chaine2 = "­252"

Code 
String.prototype.hexa_en_decimal = function() {  var nombre = eval("0x" + this);  if ((arguments.length) && arguments[0]) {  if (!(this.charAt(0) < "8")) {  var compl = ­1;  for (var i=0;i<this.length;i++) compl <<= 4;  nombre |= compl;  }  }  return nombre;  } 

Un peu d’explications sur ce code "tordu" : 
if ((arguments.length) && arguments[0])  prend en compte l’argument "signed" s’il 

est donné "true" : dans ce cas on considère le nombre comme signé  if (!(this.charAt(0) < "8"))  : si le nombre à décoder est "FF04", le script comprend  "0000FF04" (65284), alors que vous attendez ­252, c’est­à­dire "FFFFFF04"  dans les 3 instructions qui suivent, on crée le nombre ­1 ("FFFFFFFF") qu’on décale  d’autant de chiffres hexadécimaux que de chiffres dans la chaîne fournie ("FF04"), ce qui  donnera "FFFF0000", puis on fait un OU entre ce dernier nombre et "0000FF04", ce qui  donne "FFFFFF04" ou plutôt 0xFFFFFF04 

http_get_var s 
­ récupère les informations transmise dans l’URL et les retourne dans un tableau  Retourne un tableau contenant les valeurs des variables transmises par l’URL, en particulier  dans le cas de l’envoi d’un formulaire par la méthode GET. Retourne null si l’URL ne  contient aucune variable.  syntaxe : var tableau = http_get_vars();  exemple 1 : "http://www.mon­domaine.fr/mapage.htm?debut=50&nombre=10"  var tab = http_get_vars();  donnera tab["debut"] = 50  et tab["nombre"] = 10  exemple 2 : "http://www.mon­domaine.fr/mapage.htm?50&10"  var tab = http_get_vars();  donnera tab[0] = 50  et tab[1] = 10 
function http_get_vars() {  if (location.search) {  var params = location.search.substring(1);  if (params.indexOf("&") != ­1) var variables = params.split("&");  else var variables = params.split("%26");  var get_vars = new Array();  for (var i in variables) {  var pos = variables[i].indexOf("=");  if (pos != ­1)  get_vars[trim(variables[i].substring(0, pos))] =  trim(variables[i].substring(pos+1));  else get_vars[i] = trim(variables[i]);  }

return get_vars;  }  else return null;  } 

Cette fonction utilise la fonction trim() implémentée plus loin dans cette page. 

inter cale_car  
­ intercale dans une chaîne un caractère tous les x caractères  Cette méthode retourne une chaîne dans laquelle on a intercalé un caractère (ou une chaîne) à  intervale fixe.  Syntaxe : chaine.intercale_car(car, intervale);  Exemple : 
var hexa = "11000000";  hexa.intercale_car(" ", 4); retournera "1100 0000" 

Code 
String.prototype.intercale_car = function(car, intervale) {  var chaine = "";  for (var i=0;i<this.length;i+=intervale) {  chaine += (i ? car : "") + this.substr(i, intervale);  }  return chaine;  } 

multi_decoupe 
­ découpe une chaîne de caractères comme split() mais avec plusieurs séparateurs  La méthode split(séparateur) permet de découper une chaîne en tronçons séparés par un  séparateur. Elle retourne le tableau constitué de ces tronçons.  La méthode multi­decoupe() fait la même chose, mais avec plusieurs séparateurs possibles.  Un exemple : 
var chaine = "c'est­à­dire";  var tableau = chaine.multi­decoupe("'­");  // donne ["c", "est", "à", "dire"] 

Attention, le tableau peut contenir des valeurs vides.  Exemple :

var chaine = "c'est­à­dire";  var tableau = chaine.multi­decoupe("'­à");  // donnera ["c", "est", "", "", "dire"] 

puisqu’il n’y a rien entre "­" et "à" et entre "à" et "­".  L’ordre des séparateurs est indifférent. Le résultat sera le même si on écrit  chaine.multi­  decoupe("­'").  Syntaxe : chaine.multi_decoupe(separateurs); 
String.prototype.decoupe_multiple = function(sepas) {  var sepa = sepas.charAt(0);  var tab = this.split(sepa);  if (sepas.length == 1) return tab;  else {  var result = new Array();  for (var i=0;i<tab.length;i++)  result =  result.concat(tab[i].decoupe_multiple(sepas.substring(1)));  return result;  }  } 

numer ique 
­ Indique si une chaîne est numérique et retourne sa valeur numérique  Cette méthode vérifie qu’une chaîne est numérique, si c’est le cas retourne cette valeur, sinon  retourne faux.  Elle utilise isNaN, mais contrairement à cette fonction la virgule décimale est acceptée, et si  des caractères alphabétiques suivent les chiffres, ils sont supprimés.  Syntaxe : var valeur = chaine.numerique();  Exemples : 
var chaine = "1.5"; chaine.numerique(); // donne "1.5"  var chaine = "1,5"; chaine.numerique(); // donne "1.5"  var chaine = "1.5E+2"; chaine.numerique(); // donne "1.5E+2"  var chaine = "1.5 €"; chaine.numerique(); // donne "1.5"  var chaine = ",5 €"; chaine.numerique(); // donne "0.5"  var chaine = "$1.5"; chaine.numerique(); // donne "false"  var chaine = "blabla"; chaine.numerique(); // donne "false"  var chaine = "10blabla"; chaine.numerique(); // donne "10"  String.prototype.numerique = function() {  if (isNaN(this)) {  var mot = this.replace(",", ".");  if (isNaN(mot)) {  var mot = parseFloat(mot);  if (isNaN(mot)) return false;  else return mot;  }  else return mot;

}  else return this;  } 

sans_accents 
­ Supprime les caractères accentués d’une chaîne de caractères  Il est parfois utile de supprimer les caractères accentués d’une chaîne et de les remplacer par  les caractères non accentués correspondants.  Cette fonction retourne la chaîne de caractères sans accents :  Syntaxe : chaine = chaine.sans_accents();  Exemple : 
var chaine = "La fenêtre d'à côté";  alert(chaine.sans_accents()); 

affichera : "La fenetre d’a cote" ;  Malheureusement cette fonction fait (massivement) appel aux expressions régulières, ce qui  n’est pas trop recommandé, car lourd, mais j’ai testé d’autres méthodes qui se sont révélées  moins rapides que celle présentée ici. 
String.prototype.sans_accents = function() {  var ch = this.replace(/é|è|ê|ë/g, "e");  ch = ch.replace(/à|â|ä/g, "a");  ch = ch.replace(/ç/g, "c");  ch = ch.replace(/î|ï/g, "i");  ch = ch.replace(/ô|ö/g, "o");  ch = ch.replace(/ù|û|ü/g, "u");  ch = ch.replace(/À|Â|Ä|Å/g, "A");  ch = ch.replace(/Ç/g, "C");  ch = ch.replace(/É|È|Ê|Ë/g, "E");  ch = ch.replace(/Ô|Ö/g, "O");  ch = ch.replace(/Ù|Û|Ü/g, "U");  return ch;  } 

tel_formate 
­ reformate un numéro de téléphone fourni sous différents formats  Cette fonction accepte en argument un numéro de téléphone sous forme de chaîne de  caractères, et retourne une chaine.  Elle accepte 2 arguments facultatifs :  le séparateur entre chiffres (espace si cet argument est omis)  le format territorial, si l’argument est "0" (numéro commençant par un "0") ou le format

international, si l’argument est "1" (numéro commençant par "(33)") ; si l’argument est omis  le numéro est laissé tel qu’il est saisi. 

Syntaxe 
var numero = tel_formate(numero_saisi[, sepa, mode]); 

Exemples 
Les formats acceptés sont les mêmes que ceux de la fonction tel_valide()  ci­dessous 
tel_formate("0123456789"); // donne "01 23 45 67 89"  tel_formate("123456789"); // donne "" (numéro non valide, il manque un  chiffre)  tel_formate("(33)123456789"); // donne "(33)1 23 45 67 89"  tel_formate("01­23­45­67­89"); // donne "01 23 45 67 89"  tel_formate("0123456789", "­"); // donne "01­23­45­67­89"  tel_formate("01 23 45 67 89", "­"); // donne "01­23­45­67­89"  tel_formate("0123456789", "­", 0); // donne "01­23­45­67­89"  tel_formate("01 23 45 67 89", "­", 1); // donne "(33)1­23­45­67­89"  tel_formate("(33)1 23 45 67 89", "­", 0); // donne "01­23­45­67­89" 

Code 
function tel_formate(chaine) {  var indefini;  if (arguments.length > 1) {  var sepa = arguments[1];  if (arguments.length > 2) var mode = parseInt(arguments[2]);  else mode = indefini;  }  else sepa = " ";  var tab = chaine.match("^([\(]33[\)]|0)([0­9])[ |\.|­]?([0­9]{2})[ |\.|­  ]?([0­9]{2})[ |\.|­]?([0­9])[ |\.|­]?([0­9])[ |\.|­]?([0­9]{2})$");  if (tab) {  if (mode != indefini) {  if ((mode>0) && (tab[1] == "0")) tab[1] = "(33)";  else if ((mode==0) && (tab[1] == "(33)")) tab[1] = "0";  }  return tab[1] + tab[2] + sepa + tab[3] + sepa + tab[4] + sepa + tab[5]  + tab[6] + sepa + tab[7];  }  else return "";  } 

tel_valide 
­ détermine si un numéro de téléphone en France est valide  Cette méthode retourne "true" si le numéro de téléphone est valide, "false" sinon. Elle reçoit  comme argument un numéro de téléphone sous forme de chaîne de caractères. 

Syntaxe 
tel_valide(numero);

Formats acceptés 
"0123456789"  "01 23 45 67 89"  "01­23­45­67­89"  "01.23.45.67.89"  "01 23 456 789" ou avec les séparateurs : "­", "."  "0123 456 789" ou avec les séparateurs : "­", "."  ou les mêmes avec "(33)" à la place du "0" 

Code 
function tel_valide(chaine) {  if (chaine.search("^([\(]33[\)]|0)[0­9][ |\.|­]?[0­9]{2}[ |\.|­]?[0­  9]{2}[ |\.|­]?[0­9][ |\.|­]?[0­9][ |\.|­]?[0­9]{2}$") != ­1)  return true;  else return false;  } 

tr im, ltrim et r trim 
­ Supprime les espaces au début et à la fin d’une chaîne 
trim  supprime les espaces au début et en fin de la chaîne  ltrim  supprime les espaces au début de la chaîne  rtrim  supprime les espaces en fin de la chaîne. 

Ces 3 fonctions retournent une nouvelle chaîne de caractères.  syntaxe : chaine2 = trim(chaine1);  exemple : chaine2 = trim("  salut à tous !  "); // chaine2 = "salut à 
tous!" 

La première instruction permet de transformer les codes spéciaux "%XX" en leur caractère  équivalent, par exemple "%20" en " " (espace). Vous pouvez la supprimer, si vous n’en avez  pas besoin. 
function trim (chaine) {  chaine = unescape(chaine);  return chaine.replace(/(^\s*)|(\s*$)/g, "");  }  function ltrim (chaine) {  chaine = unescape(chaine);  return chaine.replace(/(^\s*)/, "");  }  function rtrim (chaine) {  chaine = unescape(chaine);  return chaine.replace(/(\s*$)/, "");  } 

typeOf

­ propriété de l’objet String, qui détermine si une variable est de type String (chaîne de  caractères)  C’est très simple : cette propriété retourne "String", si c’est une chaîne de caractères. La  même chose avec les autres types de variables permettra de déterminer quel est le type de  variable, au cas où une fonction admet plusieurs types.  Syntaxe : chaine.typeOf;  Exemple : 
var chaine = "ma chaîne";  alert("Cette variable est du type " + chaine.typeOf);  // retourne "Cette variable est du type String"  String.prototype.typeOf = "String"; 

Ar ray  Bibliothèque de méthodes additionnelles de l’objet Array (tableau) 

afficher  
­ méthode d’affichage simple d’un tableau  Cette méthode retourne une chaîne de caractère contenant l’affichage du tableau sur  "colonnes" nombre de colonnes.  syntaxe : var chaine = tableau.afficher(colonnes);  exemple : 
var tableau = new Array("val0, "val1"...);  document.write(tableau.afficher(10)); // affiche le tableau sur 10 colonnes  Array.prototype.<<b>>afficher<</b>> = function(colonnes) {  var texte = "<table width='100%' border='1'>";  var i = 0;  for (var i=0;i<this.length;i+=colonnes) {  var tab = this.slice(i, parseInt(i+colonnes­1));  texte += "<tr><td>" + tab.join("</td><td>") + "</td></tr>";  }  texte += "</table>";  return texte;  } 

afficher _multi 
­ affichage rapide d’un tableau bi­dimensionnel  La quasi­totalité des tableaux multi­dimensionnels sont bi­dimensionnels : voici une méthode  rapide pour les afficher.

Syntaxe : tableau.afficher_multi(tag_table);  L’argument tag_table est la balise "<table>" avec les attributs que vous désirez y mettre.  Voici un exemple : 
var tableau = new Array();  tableau[0] = new Array(2, 5, 78, 45);  tableau[1] = new Array(9, 15, 98, 67);  tableau[0] = new Array(20, 32, 99, 88);  document.write(tableau.afficher_multi("<table cellspacing='0'  border='1'>")); 

affichera :  2  5  78 45  9  15 98 67  20 32 99 88 
Array.prototype.<<b>>afficher_multi = function(tag_table) {  var chaine = this.join("</td></tr><tr><td>");  chaine = chaine.replace(/,/g, "</td><td>");  return tag_table + "<tr><td>" + chaine + "</td></tr></table>";  } 

contient 
­ détermine si le tableau contient une valeur  C’est la même fonction que « in_array() » en PHP, mais qui n’existe pas en Javascript.  Voici 2 façons de faire : une simple et une complexe...  La première  Syntaxe : tab.contient(valeur);  retourne "vrai" si "tab" contient "valeur", "faux" sinon. 
Array.prototype.contient = function(valeur) {  for (var i in this) {  if (this[i] == valeur) return true;  }  return false;  } 

La seconde  syntaxe : 
tab.en_chaine();  tab.contient(valeur);

Cette seconde méthode, bien qu’un peu plus complexe, est beaucoup plus rapide que la 1ère  (12 fois selon mes tests), car elle utilise la méthode indexOf des chaînes de caractères , au lieu  de faire une boucle.  Cela nécessite de transformer d’abord le tableau en chaîne : c’est ce que fait la méthode  enChaine(). Si vous avez plusieurs recherches à faire, cette transformation ne doit être faite  qu’une seule fois. 
// création d'une propriété "chaine" de l'objet Array, qui contiendra le  tableau en forme de chaîne, chaque élément séparé par un "|"  Array.prototype.chaine = "";  // fonction qui transforme le tableau en chaîne et affecte cette chaîne à  la propriété "chaine" ci­dessus  Array.prototype.en_chaine = function() {  this.chaine = "|" + this.join("|") + "|";  }  // méthode "contient" qui fait la recherche  Array.prototype.contient = function(valeur) {  if (this.chaine.indexOf("|" + valeur + "|") == ­1) return false;  else return true;  } 

is_ar r ay 
­ fonction permettant de vérifier si une variable est de type Array  Ce n’est pas une méthode de l’objet Array, puisqu’elle doit s’appliquer à toute variable.  Elle teste si la variable est un tableau, puis retourne true, si c’est le cas ou false  dans le cas  contraire.  Cette fonction utilise la méthode toSource()  commune à tous les objets Javascript. Puis elle  vérifie si la chaîne générée par toSource()  est de type "[element1, element2, ...]". Il est  impossible de confondre avec une chaîne de caractères qui aurait la même allure, car  chaine.toSource()  fait précéder la valeur de "String()"  Syntaxe : if (is_array(variable)) 
function is_array(variable) {  var source = variable.toSource();  return (source.search(/^\[([^,]*,)+[^,]*\]/) != ­1);  } 

r echer cher  
­ recherche basique d’une valeur dans un tableau quelconque

Cette méthode de recherche fonctionne sur n’importe quel tableau à une dimension. Elle  retourne « vrai » si elle a trouvé la valeur en argument, « faux » sinon.  Syntaxe : tableau.rechercher(valeur);  Exemple : 
var tableau = new Array("un", "deux", "trois");  tableau.rechercher("deux"); // retourne "true"  Array.prototype.rechercher = function(valeur) {  var i = 0;  while (i < this.length) {  if (this[i] == valeur) break;  else i++;  }  if (i == this.length) return false;  else return true;  } 

Cette méthode est la première d’une série de 4 méthodes de recherche, qui sont détaillées dans  l’article sur la recherche dans les tableaux. 

r echer cher _comp 
­ méthode de recherche dans un tableau quelconque mais trié  Cette méthode permet de faire une recherche dans un tableau quelconque, mais trié. La  comparaison pour la recherche se fait à l’aide d’une fonction de comparaison analogue à la  fonction de comparaison de la méthode sort(). Ce qui permet de l’utiliser pour des tableaux  complexes, comme des tableaux multidimensionnels ou des tableaux d’objets (voir exemple  dans l’article dans les tableaux). Mais il y a 2 différences :  le nom de fonction de comparaison doit s’écrire entre guillemets dans l’argument,  la fonction de comparaison prend 2 arguments : le 1er est un élément du tableau, le 2ème la  valeur à comparer.  Comme pour la méthode sort(), cette fonction de comparaison est facultative. Dans ce cas,  la méthode recherche_comp  est identique à la méthode recherche_en_ordre.  Syntaxe : tableau.rechercher_comp(valeur[, "fonction_de_comparaison"]);  Exemple : 
var tableau = new Array(12, 25, 46, 74);  function comparer_num(a, valeur) {  return a ­ valeur;  }  tableau.rechercher_comp(25, "comparer_num"); //donne "true"  Array.prototype.rechercher_comp = function(valeur) {  var fcomp = "";  if (arguments.length == 2) fcomp = arguments[1];  if (fcomp) fcomp += "(this[i], valeur)";  var i = 0;  var trouve = false;

while (!trouve && (i < this.length)) {  if (this[i] == valeur) trouve = true;  else if (fcomp) {  if (eval(fcomp) > 0) break;  else i++;  }  else {  if (this[i] > valeur) break;  else i++;  }  }  return trouve;  } 

r echer cher _dicho 
­ recherche dichotomique dans un tableau trié  Cette méthode est beaucoup plus rapide que les méthodes de recherche standard, mais il faut  que le tableau soit trié. Voici 2 versions : la 1ère sans fonction de comparaison, la 2e avec une  fonction de comparaison.  Dans les 2 cas, si la méthode a trouvé la valeur elle retourne son indice dans le tableau. Si elle  ne l’a pas trouvée, elle retourne ­1.  Syntaxe : var indice = tableau.rechercher_dicho(valeur); 
Array.prototype.rechercher_dicho = function(valeur) {  var debut = 0; // début du tableau  var fin = this.length ­ 1; // fin du tableau  var milieu = 0;  var trouve = false;  while (!trouve) {  milieu = Math.floor((debut + fin ) / 2);  if (this[milieu] == valeur) trouve = true;  else if (fin ­ debut <= 1) break;  else if (this[milieu] > valeur) fin = milieu;  else debut = milieu;  }  if (trouve) return milieu;  else return ­1;  } 

De la même façon que la méthode de recherche recherche_comp, on utilise ici une fonction  de comparaison.  Syntaxe : var indice = tableau.rechercher_dicho(valeur, 
"fonction_de_comparaison");  Array.prototype.rechercher_dicho = function(valeur, fcomp) {  fcomp += "(this[milieu], valeur)";  var debut = 0; // début du tableau  var fin = this.length ­ 1; // fin du tableau  var milieu = 0;  var trouve = false;

while (!trouve) {  milieu = Math.floor((debut + fin ) / 2);  if (this[milieu] == valeur) trouve = true;  else if (fin ­ debut <= 1) break;  else if (eval(fcomp) > 0) fin = milieu;  else debut = milieu;  }  if (trouve) return milieu;  else return ­1;  } 

r echer cher _en_or dr e 
­ recherche dans un tableau trié en ordre alphabétique croissant  Cette méthode est plus rapide que la méthode de recherche basique, mais plus restreinte,  puisqu’elle ne fonctionne que sur les tableaux triés en ordre alphabétique croissant.  Syntaxe : tableau.rechercher_en_ordre(valeur);  Exemple : 
var tableau = new Array("ananas", "banane", "châtaigne");  tableau.rechercher_en_ordre("mangue"); // retourne "false"  Array.prototype.rechercher_en_ordre = function(valeur) {  var i = 0;  var trouve = false;  while (!trouve && (i < this.length)) {  if (this[i] == valeur) trouve = true;  else if (this[i] > valeur) break;  else i++;  }  return trouve;  } 

tr i_num 
­ trie un tableau dans l’ordre numérique  Retourne un tableau de nombres triés par ordre numérique. Il existe une méthode de tri  sort(), mais par défaut elle trie dans l’ordre alphabétique, par exemple 1, 15, 18, 2, 26, 4,  44... au lieu de 1, 2, 4, 15, 18, 26, 44.... Heureusement, cette méthode accepte une fonction de  tri en argument, qui permet de trier comme on le désire.  Syntaxe : var tab2 = tab1.tri_num();  Exemples : 
var tableau = new Array{52, 7, 12, 20};  tableau = tableau.sort(); // donne {12, 20, 52, 7}  tableau = tableau.tri_num(); // donne {7, 12, 20, 52}  tableau = tableau.reverse(); // donnera ensuite {52, 20, 12, 7}

// fonction de comparaison utilisée par sort()  function compare_num(a, b) {  return a ­ b;  }  Array.prototype.tri_num = function() {  this.sort(compare_num);  } 

var _dump 
­ affichage du tableau pour test  Il existe en PHP une fonction var_dump() bien pratique pour afficher un tableau, au cours du  développement d’un script.  Le résultat de cette fonction n’est pas présentable dans un site, mais cela permet de vérifier la  structure d’un tableau sur lequel vous travaillez. 
Array.prototype.var_dump = function() {  if (arguments.length) var indent = arguments[0];  else var indent = "  "; // indentation des éléments du tableau  html = "a{";  var i = 0;  for (var elt in this) {  var typeelt = typeof this[elt];  if (typeelt == "function") continue;  html += i ? ", " : "";  if (typeelt == "object") html += "\n" + indent + "[" + elt + "]:" +  this[elt].var_dump(indent + indent);  else {  html += "[" + elt + "]:";  if (typeelt == "string") html += "###BOT_TEXT###quot;" + this[elt] + "###BOT_TEXT###quot;";  else html += this[elt];  }  i++;  }  html += "}";  return html;  } 

Voici un exemple : 
var tab0 = new Array("a", "b", "c");  var tab10 = new Array("d", "e");  var tab11 = new Array("f", "g");  var tab12 = new Array("h", "i");  var tab1 = new Array(tab10, tab11, tab12);  var tab2 = new Array("j", "k", "l");  var tab = new Array(tab0, tab1, tab2);  document.write(tab.var_dump()); 

Donnera :

a{ [0]:a{[0]:"a", [1]:"b", [2]:"c"}, [1]:a{ [0]:a{[0]:"d", [1]:"e"},  [1]:a{[0]:"f", [1]:"g"}, [2]:a{[0]:"h", [1]:"i"}}, [2]:a{[0]:"j", [1]:"k",  [2]:"l"}} 

Et entre 2 balises <pre>  et </pre>  : 
a{  [0]:a{[0]:"a", [1]:"b", [2]:"c"},  [1]:a{  [0]:a{[0]:"d", [1]:"e"},  [1]:a{[0]:"f", [1]:"g"},  [2]:a{[0]:"h", [1]:"i"}},  [2]:a{[0]:"j", [1]:"k", [2]:"l"}} 

vider  
­ vide un tableau  Cette méthode peut être parfois nécessaire, pour être sûr qu’un tableau, qu’on a déjà utilisé,  est vide.  Syntaxe : mon_tableau.vider(); 
Array.prototype.vider = function() {  this.splice(0, this.length); 

Date  Méthodes et fonctions additionnelles pour l’objet Date  Variables globales utilisées dans les méthodes 
var H24 = 24*60*60*1000; // un jour en millisecondes  var tmois = new Array("janvier", "février", "mars", "avril", "mai", "juin",  "juillet", "août", "septembre", "octobre", "novembre", "décembre");  var tsemaine = new Array("lundi", "mardi", "mercredi", "jeudi", "vendredi",  "samedi", "dimanche"); 

afficher  
­ affiche l’objet date au format "JJ/MM/AAAA"  Retourne une chaîne affichant l’objet date au format "JJ/MM/AAAA". Le séparateur est  indiqué en argument. Si aucun séparateur n’est indiqué, c’est le slash "/" qui est utilisé.  syntaxe : chaine = madate.afficher([separateur]);  exemples :

madate = new Date(2003, 0, 1); // Jour de l'An 2003  madate.afficher(); // donnera "01/01/2003"  madate.afficher("­"); // donnera "01­01­2003"  Date.prototype.afficher = function() {  var sepa = "/";  if (arguments.length) sepa = arguments[0];  return formate2(this.getDate()) + sepa + formate2(eval(this.getMonth() +  1)) + sepa + this.getFullYear();  }  // rajoute un "0" devant un nombre s'il est < 10  function formate2(nombre) {  return (nombre < 10) ? "0" + nombre : nombre;  } 

ch_date_valide 
­ contrôle si une date est valide  Fonction vérifiant si une date est valide. Les mêmes formats que la fonction ch_en_date sont  acceptés.  syntaxe : ch_date_valide(chaine);  exemple : ch_date_valide("25/12/2002"); 
// vérifie seulement le format de la date  function ch_date_valide(chaine) {  re = /^(\d\d?)(\/|­|\.)(\d\d?)(\/|­|\.)(\d\d)(\d\d)?$/;  return (chaine.search(re) != ­1);  } 

Autre implémentation : vérifie si la date existe vraiment. Par exemple, si vous saisissez  "29/02/2003", Javascript va traduire "01/03/2003". Dans ce cas, la fonction retourne "false".  Si la variable "pivot" vaut 30, par exemple, les années ­indiquées sur 2 chiffres ­ inférieures à  30 sont comptées dans le 21e siècle (+2000), les autres dans le 20e siècle (+1900). Vous  pouvez modifier cette variable selon vos besoins (pivot=100 : toutes les dates seront au 21e  siècle). 
function ch_date_valide(chaine) {  var pivot = 30;  ctl = /^(\d\d?)(\/|­|\.)(\d\d?)(\/|­|\.)(\d\d)(\d\d)?$/;  var tab = chaine.match(ctl);  if (!tab) return false;  else {  if ((tab.length == 6) || (!tab[6]))  tab[5] = ((tab[5] < pivot) ? 2000 : 1900) + parseInt(tab[5]);  else tab[5] = parseInt(tab[5].concat(tab[6]));  var unedate = new Date(tab[5], parseInt(tab[3])­1, tab[1]);  return ((unedate.getFullYear() == tab[5]) && (unedate.getMonth() ==  tab[3]­1) && (unedate.getDate() == tab[1]));  }  }

ch_en_date 
­ convertit une chaîne en objet date  Fonction convertissant une chaîne de la forme "JJ/MM/AAAA" en objet date. La chaine peut­  être de la forme "J[J].M[M].AA[AA]" ou "J[J]/M[M]/AA[AA]" ou "J[J]­M[M]­AA[AA]" (les  parties entre [] sont optionnelles).  Si la variable "pivot" vaut 30, par exemple, les années ­indiquées sur 2 chiffres ­ inférieures à  30 sont comptées dans le 21e siècle (+2000), les autres dans le 20e siècle (+1900). Vous  pouvez modifier cette variable selon vos besoins (pivot=100 : toutes les dates seront au 21e  siècle).  syntaxe : madate = ch_en_date(chaine);  exemple : madate = ch_en_date("25/12/02") ; 
function ch_en_date(chaine) {  var pivot = 30;  ctl = /^(\d\d?)(\/|­|\.)(\d\d?)(\/|­|\.)(\d\d)(\d\d)?$/;  var tab = ctl.exec(chaine);  if ((tab.length > 6) && (tab[6])) tab[5] += tab[6];  else tab[5] = (tab[5] < pivot) ? "20" : "19") + tab[5];  var unedate = new Date(tab[5], tab[3]­1, tab[1]);  return unedate;  } 

dans_inter valle 
­ détermine si l’objet date est compris entre 2 dates  Méthode retournant "true" si l’objet date est compris entre la date de "debut" et la date de  "fin", "false" sinon. "debut" et "fin" sont aussi des objets Date.  syntaxe : madate.dans_intervalle(debut, fin); 
Date.prototype.dans_intervalle = function(debut, fin) {  return ((this.getTime() >= debut.getTime()) && (this.getTime() <=  fin.getTime()));  } 

date 
­ affiche la date de l’objet date selon un format libre  Cette méthode est analogue à la fonction date() du PHP, mais elle ne fonctionne qu’avec la  date et non l’heure.  Elle retourne une chaîne de caractères, en fonction du format indiqué. A l’aide du format, la  méthode transforme les variables suivantes ainsi :

"J" : jour du mois ("JJ" jour affiché sur 2 chiffres)  "JS" : jour de la semaine ("JJJS" jour de la semaine abrégé à 3 caractères)  "M" : mois en chiffres ("MM" mois affiché sur 2 chiffres)  "ML" : mois en lettres ("MMML" mois abrégé sur 3 caractères, sauf juin et juillet qui sont  sur 4)  "AAAA" : année ("AA" sur 2 chiffres, "AAAA" sur 4 chiffres)  Les autres caractères du format sont transcrits tels quels.  Syntaxe : madate.date(format);  Exemples avec le 14 juillet 2003 : 
var FetNat = new Date(2003, 6, 14); attention : en JS janvier = 0,....,  décembre = 11  FetNat.date("J/M/AA"); // donnera "14/7/03"  FetNat.date("AAAA­MM­JJ"); // donnera "2003­07­14" (format date MySql)  FetNat.date("JS J ML AAAA"); // donnera "lundi 14 juillet 2003"  FetNat.date("JJJS J MMML AAAA"); // donnera "lun 14 juil 2003"  FetNat.date("J ML"); // donnera "14 juillet"  FetNat.date("MMML AAAA"); // donnera "juil 2003"  FetNat.date("Le J ML AAAA tombe un JS"); // donnera "Le 14 juillet 2003  tombe un lundi"  FetNat.date("Je suis né en ML"); // donnera "14e suis né en juillet" (le  "J" de "Je" est pris pour un jour)  écrire plutôt : "Je suis né en " + FetNat.date("ML");  FetNat.date("Aujourd'hui nous sommes le XXX"); // donnera "" (rien)  // pour un affichage complet avec l'heure utiliser la méthode heure() plus  loin :  FetNat.date("JJ/MM/AAAA) + " " + FetNat.heure("HH:MM"); // donnera  "14/07/2003 10:12"  // fonction utilisée par la méthode sort()  function compare_num(a, b) {  return a ­ b;  }  Date.prototype.date = function(format) {  var texte = "";  // recherche un "j" en début de format (jour de la semaine)  // recherche ensuite les chaînes "LS" (jour de la semaine), "J" (jour du  mois),  // "M" (mois en chiffres), "ML" (mois en lettres) et "A" (année), qui  peuvent être dans un ordre quelconque  var posJS = format.indexOf("JS");  var posJ = format.indexOf("J");  if ((posJ != ­1) && (posJ == posJS)) posJ = format.indexOf("J", posJS+1);  var posML = format.indexOf("ML");  var posM = format.indexOf("M");  if ((posM != ­1) && (posM == posML)) posM = format.indexOf("M", posML+1);  var posA = format.indexOf("AA");  var tpos = new Array(posJS, posJ, posM, posML, posA);  // on met les positions de ces chaînes dans un tableau, qu'on trie et  qu'on purge des valeurs ­1 (chaînes absentes)  tpos.sort(compare_num);  var i = 0;  while (i < tpos.length) {  if (tpos[i] == ­1) tpos.shift();  else break;  }  // puis on traite les chaînes "JS", "J", "M", "ML" ou "AA" dans l'ordre du

format  i = 0;  var pos = 0;  while (i < tpos.length) {  pos1 = tpos[i];  // on écrit la chaîne se trouvent avant la chaîne "JS", "J", "M", "ML"  ou "AA"  texte += format.substring(pos, pos1);  pos = pos1 + 1;  if (pos1 == posJS) {  if (format.indexOf("JJJS") == ­1) {  texte += tsemaine[this.quel_jour()];  pos++;  }  else {  texte += tsemaine[this.quel_jour()].substr(0, 3);  pos += 3;  }  }  if (pos1 == posJ) {  if (format.indexOf("JJ") == ­1) texte += (this.getDate() == 1) ? "1er"  : this.getDate();  else {  texte += formate2(this.getDate());  pos++;  }  }  else if (pos1 == posM) {  if (format.indexOf("MM") == ­1) texte += parseInt(this.getMonth() +  1);  else {  texte += formate2(parseInt(this.getMonth() + 1));  pos++;  }  }  else if (pos1 == posML) {  if (format.indexOf("MMML") == ­1) {  texte += tmois[this.getMonth()];  pos++;  }  else {  texte += mois_court(this.getMonth());  pos+=3;  }  }  else if (pos1 == posA) {  if (format.indexOf("AAAA") == ­1) {  texte += this.getFullYear().toString().substring(2);  pos++;  }  else {  texte += this.getFullYear();  pos+=3;  }  }  i++;  }  return texte;  }  // affiche le mois sur 3 lettres, sauf pour juin (5) et juillet(6) qui sont  affichés sur 4 lettres

function mois_court(num_mois) {  if ((num_mois < 5) && (num_mois > 6)) return tmois.substr(0, 3);  else return tmois.substr(0, 4);  }  // retourne 0 pour un lundi, 1 pour mardi... 6 pour dimanche  Date.prototype.quel_jour = function() {  return this.getDay() ? (this.getDay()­1) : 6;  } 

Les tableaux tsemaine et tmois sont en haut dessus.  Number   Bibliothèque de méthodes additionnelles à l’objet Number (nombres) 

ar r ondir  
­ arrondit un nombre avec un nombre de décimales donné  Cette fonction arrondit un nombre en fonction du nombre de décimales indiqué. Si le nombre  de décimales indiqué est négatif, le nombre est arrondi à la puissance de 10.  Si le signe décimal est la virgule, le point décimal sera remplacé par la virgule. Ce signe  décimal est indiqué par cette instruction : 
Number.prototype.signe_decimal = ","; 

(à mettre en début de code, mais pas dans la fonction)  Syntaxe : arrondir(nombre, decimales);  Exemples : 
arrondir(15.3, 2); // ­> 15.30  arrondir(15, 2); //­> 15.00  arrondir(15.001, 2); // ­> 15.00  arrondir(1.5, 0); // ­> 2  arrondir(0.009, 2); // ­> 0.01  arrondir(112.1, ­2); // ­> 100  arrondir(15, 2); //­> 15,00 si nombre.signe_decimal = ","  function arrondir(nombre, decimales) {  if (isNaN(nombre)) return "";  if (decimales == 0) {  var n = Math.round(nombre);  return n.toString();  }  else if (decimales > 0) {  if (document.all) var undefined; // Netscape 4 ne connaît pas la  constante "undefined"  var p10 = Math.pow(10, decimales);  var n = Math.round(nombre * p10);  n = n.toString();  var point = n.length ­ decimales;  if (point >= 0) n = n.substring(0, point) + "." + n.substring(point);  else n = "0." + formater(n, decimales);

}  else {  var p10 = Math.pow(10, ­decimales);  var n = Math.round(nombre / p10) * p10;  n = n.toString();  }  if (nombre.signe_decimal == undefined) return n;  else return n.replace(".", nombre.signe_decimal);  } 

binair e 
­ convertit un nombre décimal en binaire  Cette méthode retourne une chaîne de caractères représentant le nombre en binaire (base 2).  Syntaxe : nombre.binaire([taille, mode]) ;  La méthode admet 2 arguments optionnels :  la taille, c’est­à­dire le nombre de bits affichés, éventuellement complétés à gauche par des  0  le mode qui peut être "unsigned" pour les valeurs non signées (toujours positives), "signed"  pour les valeurs signées (positives ou négatives) ou "auto" (valeur par défaut) : le script met  automatiquement "signed" si le nombre est négatif.  Exemples : 
var x = 6;  x.binaire(); // donnera "101"  x.binaire(4); // donnera "0101"  var x = ­6;  x.binaire(); // donnera "11111111111111111111111111111010"  x.binaire(8); // donnera "11111010"  Number.prototype.binaire = function() {  if (isNaN(this)) return null;  // pour l'instruction suivante, voir min_max_int() plus bas  if ((this > Number.MAXINT) || (this < Number.MININT)) return null;  if (arguments.length) var lim = parseInt(arguments[0]);  else var lim = 0;  var tab_bin = new Array("0", "1");  var result = "";  var nombre = this;  var i = 0;  while (nombre) {  if (lim && (lim == i++)) break;  result = tab_bin[(nombre & 1)] + result;  nombre >>>=  1;  }  if (lim) {  while (result.length < lim) result = "0" + result;  }  return result;  }

ecar t_type 
­ calcule l’écart­type d’une série de nombres  Cette fonction retourne un nombre, qui est l’écart­type des nombres fournis en arguments.  L’écart­type est utilisé en statistiques et représente la racine carrée de la variance. En clair, si  la série de nombres est proche de la moyenne, l’écart­type sera faible, si au contraire les  nombres s’écartent de la moyenne, l’écart­type sera élevé.  Les valeurs non numériques seront ignorées (le calcul se fera entre les valeurs numériques).  Les arguments peuvent être sous 2 formes possibles :  une liste de nombre,  ou un tableau de nombres  Syntaxe : ecart_type(nombre1, nombre2....);  ou ecart_type(tableau_de_nombres);  Exemples : 
ecart_type(1, 2, 3); // ­> 0.81649658  var tableau = new Array(1, 2, 3);  ecart_type(tableau);  // ­> 0.81649658  ecart_type("1 €", "2 €", "€ 3") // donnera 0.5 ("€ 3" sera ignoré, car  considéré comme non numérique)  function ecart_type() {  if (arguments.length == 1) {  var arg = arguments[0];  if ((typeof(arg) == "string") || (typeof(arg) == "number")) return 0;  }  else arg = arguments;  var quant = arg.length;  var n = 0;  var n2 = 0;  for (var i=0;i<quant;i++) {  if (!isNaN(arg[i])) {  var val = parseFloat(arg[i]);  n += val;  n2 += val * val;  }  }  return Math.sqrt(n2/quant ­ n*n/quant/quant);  } 

for mater  
­ rajoute des zéros devant un nombre s’il n’a pas la taille requise  Cette fonction retourne une chaîne de caractères, en rajoutant des zéros devant le nombre, si  taille est inférieure à la taille indiquée en argument.  Syntaxe : formater(nombre, taille);

Exemples : 
formater(12, 3); // donne "012"  formater(12, 1); // donne "12"  formater("xxx", 1); // donne "" ("xxx" n'étant pas un nombre)  formater("12", 3); // donne "012" ("12" étant un nombre sous forme de  chaîne)  function formater(nombre, taille) {  if (isNaN(nombre)) return "";  var chaine = nombre.toString();  while (chaine.length < taille) chaine = "0" + chaine;  return chaine;  } 

hexa 
­ transforme un nombre décimal en hexadécimal  Cette méthode fonctionne avec un nombre, sinon elle retourne null. Elle retourne une chaîne  de caractères hexadécimale. 

Syntaxe 
nombre.hexa([longueur]); 

l’argument longueur est optionnel et permet de rajouter des zéros devant la valeur  hexadécimale, pour compléter à la longueur voulue. 

Exemples 
var x = 10;  var hexa = x.hexa(); // donnera hexa = "A";  var hexa = x.hexa(2); // donnera hexa = "0A";  var x = ­10;  var hexa = x.hexa(); // donnera hexa = "FFFFFFF6";  var hexa = x.hexa(2); // donnera hexa = "F6"; 

Code 
Number.prototype.hexa = function() {  if (isNaN(this)) return null;  // pour l'instruction suivante, voir min_max_int() plus bas  // elle vérifie que le nombre est dans les limites acceptées par votre  système,  // (elle est inutile, si ce risque est nul)  if ((this > Number.MAXINT) || (this < Number.MININT)) return null;  if (arguments.length) var lim = parseInt(arguments[0]);  else var lim = 0;  var ch_hexa = "0123456789ABCDEF";  var result = "";  var nombre = this;  var i = 0;  while (nombre) {  if (lim && (lim == i++)) break;  result = ch_hexa.charAt(nombre & 15) + result;

nombre >>= 4;  }  if (lim) {  while (result.length < lim) result = "0" + result;  }  return result;  } 

int_log2 
­ partie entière du logarithme à base 2 d’un nombre  Dans certains calculs (par exemple la profondeur d’un arbre binaire), il est utile de connaître  la partie entière du logarithme à base 2. Cette méthode ajoutée à l’objet Number retourne cette  partie entière sous forme de nombre.  On utilise ici l’opérateur bit à bit  >>>  qui est moins gourmand en ressources et plus rapide que  le calcul Math.floor(Math.log(N) / Math.LOG2E). 

Syntaxe 
nombre.int_log2(); 

Exemples 
var x = 7;  x.int_log2(); // donnera 2  1024.int_log2(); // donnera 10 

Code 
Number.prototype.int_log2 = function() {  if (isNaN(this)) return null;  // pour l'instruction suivante, voir min_max_int() plus bas  if ((this > Number.MAXINT) || (this < Number.MININT)) return null;  var nombre = this;  var i = 0;  while (nombre) {  nombre >>>= 1;  i++;  }  return i­1;  } 

min_max_int 
­ définit l’entier mximum autorisé par le système  Cette méthode permet de définir les valeurs entières maximum et minimum autorisées par le  système. Evidemment, ça dépend du système, mais sur un système 32 bits ces valeurs seront  31  31  2147483647 et ­2147483648, soit 2  ­1 et ­2  ou 0x7FFFFFFF et 0x80000000 (en  hexadécimal).

Certaines méthodes de cette biblio font appel à ces valeurs (Number.MAXINT et  Number.MININT) pour éviter de planter le navigateur. Mais si vous êtes certains ne pas  dépasser ces limites, vous pouvez supprimer la ligne de ce contrôle dans chacune de ces  méthodes. 
Number.prototype.MAXINT;  Number.prototype.MININT;  Number.prototype.min_max_int = function() {  var min = ­1;  this.MAXINT = min >>> 1;  this.MININT = ~this.MAX_INT;  }  Number.min_max_int(); 

Les 2 premières instructions déclarent les 2 nouvelles propriétés MAXINT  et MININT  de l’objet  Number.  La méthode min_max_int()  définit ces propriétés.  Enfin, il faut appeler la méthode pour pouvoir utiliser ces propriétés MAXINT  et MININT, de  cette manière : 
if ((valeur > Number.MAXINT) || (valeur < Number.MININT)) return null; 

monétair e 
­ arrondit un nombre à 2 décimales et ajoute le signe monétaire  Cette fonction retourne une chaîne arrondissant le nombre à 2 décimales, suivie du signe  monétaire fourni en argument. Elle utilise la fonction "arrondir" (plus haut).  Syntaxe : monetaire(nombre, monnaie);  Exemples : 
monetaire(12.5, "€"); // ­> "12.50 €"  monetaire(1.158, "$"); // ­> "1.16 $"  function monetaire(nombre, monnaie) {  nombre = arrondir(nombre, 2);  return nombre + " " + monnaie;  } 

moyenne 
­ calcule la moyenne d’une série de nombres  Cette fonction retourne un nombre, qui est la moyenne des nombres fournis en arguments. Les  valeurs non numériques sont ignorées.

Les arguments peuvent être sous 2 formes possibles :  une liste de nombre,  ou un tableau de nombres  Syntaxe : moyenne(nombre1, nombre2....);  ou moyenne(tableau_de_nombres);  Exemples : 
moyenne(1, 2, 3); // ­> 2  var tableau = new Array(1, 2, 3);  moyenne(tableau);  // ­> 2  moyenne("1 €", "2 €", "€ 3") // donnera 1.5 ("€ 3" sera ignoré, car  considéré comme non numérique)  function moyenne() {  if (arguments.length == 1) {  var arg = arguments[0];  if ((typeof(arg) == "string") || (typeof(arg) == "number")) return  arg;  }  else arg = arguments;  var n = 0;  for (var i=0;i<arg.length;i++) {  if (!isNaN(arg[i])) n += parseFloat(arg[i]);  }  return n / arg.length;  } 

var iance 
­ calcule la variance d’une série de nombres  Cette fonction retourne un nombre, qui est la variance des nombres fournis en arguments. La  variance est utilisée en statistiques et représente la moyenne des carrés de la différence entre  chaque nombre et la moyenne. En clair, si la série de nombres est proche de la moyenne, la  variance sera faible, si au contraire les nombres s’écartent de la moyenne, la variance sera  élevée.  Les valeurs non numériques seront ignorées (le calcul se fera entre les valeurs numériques).  Les arguments peuvent être sous 2 formes possibles :  une liste de nombre,  ou un tableau de nombres  Syntaxe : variance(nombre1, nombre2....);  ou variance(tableau_de_nombres);  Exemples : 
variance(1, 2, 3); // ­> 0.666667  var tableau = new Array(1, 2, 3);  variance(tableau);  // ­> 0.666667

variance("1 €", "2 €", "€ 3") // donnera 0.25 ("€ 3" sera ignoré, car  considéré comme non numérique)  function variance() {  if (arguments.length == 1) {  var arg = arguments[0];  if ((typeof(arg) == "string") || (typeof(arg) == "number")) return 0;  }  else arg = arguments;  var quant = arg.length;  var n = 0;  var n2 = 0;  for (var i=0;i<quant;i++) {  if (!isNaN(arg[i])) {  var val = parseFloat(arg[i]);  n += val;  n2 += val * val;  }  }  return n2/quant ­ n*n/quant/quant;  }

Comparaisons
Le choix de l’une ou l’autre solution n’est pas complètement libre. Avec les objets Javascript prédéfinis C’est‐à‐dire : Array, Date, Number, String... Vous ne pouvez utiliser que le prototypage. De plus, vous ne pouvez appeler la méthode qu’après sa déclaration. Par exemple :

var valeur = document.forms[0].texte.value;  // supprime éventuellement les espaces avant et après  valeur.trim();  String.prototype.trim = function() {  var chaine = unescape(this);  this = chaine.replace(/(^\s*)|(\s*$)/g, "");  }

ne marchera pas. Il faut déclarer la méthode avant son appel. Avec vos objets persos On peut déclarer les méhodes dans le constructeur ou utiliser le prototypage. Mais : chaque objet encapsule les méthodes déclarées dans le constructeur, ce qui le rend plus lourd, surtout si vous en avez créé beaucoup, les méthodes déclarées avec prototype sont disponibles pour chaque objet, mais non encapsulées, c’est donc plus léger. Par contre :

si vous appelez une méthode avant sa déclaration, elle doit être obligatoirement encapsulée, sinon vous pouvez la prototyper. Exemple :

var ma_voiture = new clVoiture(...);  function clVoiture(...) {  ...  }  clVoiture.prototype.afficher = function() {  ...  }

donnera une erreur « function afficher is not defined ». Dans ce cas, il faut faire :

var ma_voiture = new clVoiture(...);  function clVoiture(...) {  ...  this.afficher = clVoiture_afficher;  }  function clVoiture_afficher() {  ...  }

Mais :

function clVoiture(...) {  ...  }  clVoiture.prototype.afficher = function() {  ...  }  var ma_voiture = new clVoiture(...);

fonctionnera bien.

Le mécanisme de l’héritage en Javascript
Il est possible en Javascript de créer des sous‐classes d’une classe et que ces sous‐classes héritent des propriétés et des méthodes de sa classe‐mère. Pourquoi faire des sous‐classes ? Supposons que votre application gère un parc de véhicules (tourisme, utilitaires, camions, motos...). Vous pouvez créer une classe de base Vehicule, avec un comportement de base. Puis des classes dérivées Tourisme, Utilitaire, Camion, Moto, qui auront le comportement de base, plus des infos et des comportement spécifiques. Javascript ne disposant pas réellement d’un langage objet, l’implémentation de l’héritage tient plutôt du bricolage. Vous pourrez trouver sur internet plusieurs façons d’implémenter

cette possibilité et même des gens qui prétendent que c’est impossible. Voici ici une implémentation qui a quelques avantages.

Un exemple
La classe Vehicule Reprenons notre exemple des véhicules :
function Vehicule(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.compteur = km;  this.prix = prix;  }  Vehicule.prototype.afficher = function() {  return this.marque + " " + this.modele + " " + this.numero + " (" + this.km + "  kms) " + this.prix + " €<br>";  }  // on rajoute au compteur les kms parcourus  Vehicule.prototype.parcourir = function(kms) {  this.compteur += kms;  }

La définition des méthodes en dehors du constructeur de classe a l’avantage de réduire la taille de celui‐ci, donc d’économiser de la mémoire. Puisqu’elles ne sont définies qu’une seule fois pour tous les objets instanciés par la classe. La sous‐classe Camion On va créer une nouvelle classe des camions qui sera une sous‐classe de la classe Vehicule : Camion.prototype = new Vehicule() ;
function Camion(marque, modele, numero, km, prix, PU, PTC) {  this.parent = Vehicule;  this.parent(marque, modele, numero, kms, prix);  this.PU = PU;  this.PTC = PTC;  }  function Camion_afficher() {  return this.marque + " " + this.modele + " " + this.numero + " " + this.km + "  kms " + this.prix + " € " + this.PU + " " + this.PTC + "<br>";

Le lien d’héritage Le lien d’héritage entre la classe Camion et la classe Vehicule a été créé par Camion.prototype = new Vehicule();. Ainsi que par les 2 premières lignes du constructeur Camion(). Héritage des propriétés et des méthodes La classe Camion a 2 propriétés spécifiques : PU (poids utile) et PTC (poids total en charge). Les autres propriétés (marque, modele, numero, km, prix) sont héritées de la classe Vehicule.

On peut donc écrire :
var mon_camion = new Camion("Volvo", "A47", "8888 AKZ 34", 30000, 180000, 15000,  25000);  alert("marque de mon camion : " + mon_camion.marque); // donnere "marque de mon  camion : Volvo"  mon_camion.parcourir(10000);  alert("Nouveau kilométrage = " + mon_camion.compteur);// donnera "Nouveau  kilométrage = 190000"

La classe Camion hérite aussi des méthodes afficher() et parcourir() de la classe Vehicule. Mais du fait qu’une méthode afficher() a été redéfinie dans la classe Camion, ce sera cette méthode qui sera appelée, et non la méthode de la classe Vehicule.

Par contre, appeler la méthode afficher() de la classe‐mère Vehicule n’est pas possible :
mon_camion.parent.afficher() produira une erreur ("Propriété non supportée par l’objet").

C’est pas compliqué, l’héritage en Javascript, non ?

Identificateurs, opérateurs et constantes Javascript
Pour ceux qui connaissent C, C++ ou Java, cette page n’est pas pour vous, car la syntaxe Javascript est la même. Par contre, pour les tout débutants, jetez‐y un coup d’oeil.

Les identificateurs
Ce sont les noms que vous donnez aux variables et aux fonctions. uniquement des caractères alphabétiques non‐accentués, des chiffres, le caractère de soulignement "_" ou le "$" sont autorisés, l’identificateur ne pouvant pas commencer par un chiffre sensibilité à la casse : MaVariable, mavariable et maVariable sont 3 variables différentes.
bon pas bon pourquoi ? ma_variable ma variable espace non autorisé pageChargee page‐chargée cars accentués et tirets interdits _aplus @+ cars spéciaux interdits _2000 2000 commence par un chiffre document$ document mot réservé [1]

Déclaration des identificateurs Il n’est pas (toujours) nécessaire en Javascript de déclarer une variable avant son utilisation, mais ça permet de savoir où la variable a été déclarée. On utilise pour ça le mot réservé var.

La règle est : si la variable est initialisée par une valeur, "var" n’est pas indispensable, si la variable est déclarée sans valeur (undefined), "var" est indispensable (vous aurez une erreur Javascript).
var an = 2000;  mois = "juillet";  var i, j = 0; // lorsque 2 variables sont initialisées à la même valeur  var prenom;  alert("prénom = " + prenom); // donne "prenom = undefined"  nom; // provoque une erreur Javascript

Lorsqu’une valeur (comme l’exemple de prenom) n’est pas initialisée, c’est‐à‐dire ne reçoit pas de valeur, elle est non définie (undefined = indéfini). On peut la tester ainsi :
if (prenom == undefined)...

Mais Netscape 4 ‐ contrairement à ce que dit la doc Netscape ! ‐ ne reconnaît pas cette instruction. Il faut créer une variable undefined :
var indefini; // "indefini" est undefined  if (prenom == indefini)...

Les instructions
Elles doivent toujours se terminer par un point‐virgule " ;" Exception pour les blocs d’instructions entre accolades " "
if (!document.images) {} // pas de point­virgule ici  else {  document.write("ce navigateur supporte les objets  images"); // point­virgule  document.images[i].src = "image" + i + ".gif";  // point­virgule  }

Les blocs d’instructions sont délimités par des accolades " ". Ils servent à délimiter un ensemble d’instructions et on les retrouve dans les instructions de saut conditionnel et dans les fonctions.

Les opérateurs
Voici les opérateurs les plus utilisés type
affectation

opérateur
= ‐ * / %

exemple
a = 12 ; addition soustraction multiplication division modulo [2] i++ ;

commentaire
affecte la valeur 12 à la variable "a" a = b + 12 ; a = b ‐ 12 ; a=b*c; a=b/c; a=b%c; revient à i = i + 1 ; (incrémentation)

mathématique +

concaténation + unaire ++

a = "bon" + "jour" ; donnera a = "bonjour"

— raccourci += ‐= *= /= += comparaison == != > < >= <= &&
||

i— ; a += 12 ; a ‐= 12 ; a *= 12 ; a /= 12 ; a += "plus" ; a == b a != b a>b a<b a >= b a <= b (a < b) && (a > c)

revient à i = i ‐ 1 ; (décrémentation) revient à a = a + 12 ; revient à a = a ‐ 12 ; revient à a = a * 12 ; revient à a = a / 12 ; revient à a = a + "plus" ; vrai si a égal à b vrai si a différent de b vrai si a supérieur à b vrai si a inférieur à b vrai si a supérieur ou égal à b vrai si a inférieur ou égal à b vrai si a < b ET a > c

(a == b) || (a == c) vrai si a égal à b OU a égal à c

Vous trouverez parfois une comparaison de ce type :
if  (variable) if (variable != "")

ce

qui

signifie :

if 

(variable 

!= 

0)

ou

Comparaisons de type Il existe également des opérateurs de comparaison particuliers qui comparent la valeur et le type de 2 variables. Ils ne sont pas supportés par Netscape 4.
var x = "10";  var y = 10;  if (x == y) // donne "vrai"  if (x === y) // donne "faux" car x est une chaîne et y est un nombre  if (x !== y) // donne "vrai" pour la même raison  var x = "10";  var y = "0";  if (x == y) // donne "faux"  if (x === y) // donne "faux" car x et y sont des chaînes mais de valeur différente  if (x !== y) // donne "vrai" car x et y sont de valeur différente  (x  ===  y) signifie que x et y sont égaux et (x !== y) signifie que x et y sont différents ou de types différents

de

même

type

Incrémentation On l’utilise très souvent dans Javascript et les autres langages dérivés du C. On distingue post‐incrémentation (i++) et pré‐incrémentation (++i) :
i = 0;  var x = tableau[i++];

dans ce cas x = tableau[0], puis i est incrémenté à 1 (post‐incrémentation)
i = 0;  var x = tableau[++i];

ici i est d’abord incrémenté à 1, puis x = tableau[1] (pré‐incrémentation) Même chose avec i— et —i (post‐décrémentation et pré‐décrémentation)

Les constantes
Il y en a beaucoup. Mais les 2 que vous rencontrerez souvent sont "true" (vrai) et "false" (faux) :
var page_chargee = false;

Les caractères spéciaux
caractère signification \b \f \n \r \t

Related Interests

###BOT_TEXT###quot; \ \XXX \xXX \uXXXX retour arrière (backspace) nouvelle page (form feed) nouvelle ligne retour à la ligne [3] caractère de tabulation apostrophe guillemet anti‐slash (\) caractère ISO‐latin‐1 indiqué par 3 chiffres en base octale (8) de 0 à 377, exemples 51 pour « © » (caractère de copyright) caractère ISO‐latin‐1 indiqué par 3 chiffres hexadécimaux, exemple \xA9 pour « © » caractère ISO‐latin‐1 indiqué par 4 chiffres hexadécimaux, exemple \xu20AC pour « € » (symbole euro)

Notes : [1] il existe une cinquantaine de mots réservés au langage : ce sont des mots en anglais que vous apprendrez. Donc si vous donnez des noms français à vos variables, il y a peu de chances que vous leur attribuiez un mot réservé. [2] Modulo = reste de la division. Exemple : 5 % 2 = 1. Le modulo 2 sert souvent à déterminer si un nombre est pair ou impair [3] sous Windows un retour à la ligne se compose de \r\n, sous Linux/Unix seulement \n

et surtout ce que ce langage ne sait pas faire

Javascript « client »
On distingue Javascript « client » de Javascript « serveur ». C’est le même langage, mais dans un cas le script s’exécute sur la machine du visiteur du site (le « client »), dans l’autre cas il s’exécute sur le serveur qui héberge le site. Pour des raisons évidentes de sécurité, Javascript « client » ne peut pas lire ou écrire dans des fichiers, que ce soit sur le serveur ou sur la machine du visiteur. Les cookies sont l’unique exception. Il ne peut pas non plus connaître l’adresse e‐mail, l’adresse IP du visiteur, à moins que celui‐ ci l’ait communiquée. Javascript, de plus, ne sait que manipuler les objets prédéfinis d’une page ou d’une fenêtre de navigateur, plus les variables et objets que vous définissez vous‐mêmes. Il n’est pas

possible, par exemple, de modifier le texte entre 2 balises ou dans les cellules d’un tableau HTML. Ce n’est plus vrai maintenant qu’il peut appeler des fonctions DOM (Document Object

Model).
Mais la fonction essentielle de Javascript est de réagir aux événements de la page : chargement de la page, clic sur un bouton, remplissage d’un champ de formulaire... Encore qu’il soit maintenant très concurrencé sur ce terrain par les CSS.

Une cervelle d’oiseau !
Une page HTML est un objet statique, même si un script vous permet de faire bouger des images, d’écrire dans la page. Si vous quittez cette page et y revenez ensuite, vous la trouverez dans son état initial. Par exemple, vous avez rempli un formulaire, mais vous voulez consulter une autre page avant de l’envoyer. Vous revenez au formulaire : il est vide ! Il existe des astuces pour éviter ça. Ce sont les limites inhérentes au HTML, et Javascript n’y peut rien. Autre exemple : vous avez des pages à accès réservé par un petit formulaire d’identification. Si vos visiteurs quittent les pages réservées et veulent y revenir, ils devront se ré‐identifier. Pour éviter ça, vous indiquez par une variable dans la page d’identification que le visiteur s’est déjà identifié. Malheureusement, quand le visiteur revient dans cette page d’identification, la variable ne contient plus l’info que vous lui avez donnée. Retenez ceci : les pages HTML n’ont aucune mémoire, avec ou sans Javascript.

Manipulateur d’objets
Une page HTML est un ensemble d’objets : fenêtre, cadres, le corps de la page, les images, les liens, les formulaires et ses boutons, listes déroutantes... etc. Javascript est très fort pour manipuler tout ça. Les objets ont 3 catégories de caractéristiques : des propriétés que Javascript sait lire ou modifier, par exemple la propriété "value’ d’une case de formulaire, c’est‐à‐dire le contenu de cette case ; des méthodes (ou fonctions) que Javascript peut appeler, comme la méthode submit() d’un formulaire qui agit comme si vous cliquez sur Envoyer des événements que capte Javascript pour lancer une fonction, exemple l’événement onLoad dans la balise qui permet de déclencher une fonction au chargement de la page.

Différentes versions et navigateurs
Aller voir sur la référence du langage Javascript sur le site de Netscape, la quantité d’objets et de méthodes à votre disposition vous donnera le vertige ! Et probablement des idées. Mais au risque d’être rabat‐joie, vous ne pourrez pas tout utiliser... En effet, les navigateurs implémentent différentes versions de Javascript (voir page sur les versions de Javascript

supportées par les navigateurs). Si vous voulez que vos pages soient compatibles avec la version 3 de Internet Explorer, il faudra vous limiter à la 1ère version de Javascript. Actuellement (en milieu d’année 2000 [1]), la dernière version est la version 1.5 supportée uniquement par Netscape 6. Mais elle ne sert pas à grand chose puisque les nouvelles fonctionnalités ne marchent pas avec les autres navigateurs.

Autres possibilités
Pour vous affranchir des limites HTML / Javascript, il faudra vous tourner vers d’autres techniques qui utilisent des scripts s’exécutant sur le serveur du site : commençons par les ASP (technologie propriétaire de Microsoft) qui peuvent être codées en Javascript ou en VBScript, et même avec beaucoup d’autres langages avec ASP.NET ; PHP est un concurrent des ASP, a différentes possibilités que les ASP, par contre fonctionne sur serveurs Linux ou Windows, contrairement aux ASP limitées à Windows. Vous trouverez beaucoup de sources et d’utilisateurs de PHP, ainsi que beaucoup d’hébergeurs. les CGI qu’on peut coder avec n’importe quel langage, Perl étant le plus utilisé : ce sont des exécutables ou des scripts. enfin Java et JSP sont un peu à part, mais Java pêche par sa lenteur et son manque d’universalité (nombreuses versions Java pas toujours compatibles entre elles). Dans un autre domaine, plus prêt de Javascript, les fonctionnalités du DOM (Document Object Model) permettent de manipuler tous les éléments d’un document HTML, donc ceux auxquels n’a pas accès Javascript. Mais le DOM est implémenté de façon différente d’un navigateur à l’autre, et parfois même entre 2 versions du même navigateur.
Notes : [1] et même début 2005, on en est toujours à la version 1.5, mais supportée par beaucoup plus de navigateurs.

Utilisation des fonctions eval(), parseInt(), parseFloat() et isNaN()
Il arrive parfois que vous récupériez des valeurs numériques et que Javascript donne des résultats fantaisistes. Par exemple, si vous récupérez des valeurs dans des champs de formulaire pour faire des calculs, ou si vous récupérez des valeurs GET (dans l’url de la page, avec location.search), les valeurs de ces champs seront toujours des chaînes de caractères. Si vous récupérez 2 champs a = "10" et b = "20", et faîtes "a + b", Javascript ne donnera pas "30" mais "1020". Car l’opérateur "+" est aussi l’opérateur de concaténation ("bon" + "jour" donne "bonjour"). Voici quelques fonctions utiles pour les valeurs numériques.

parseInt()
Syntaxe
parseInt(valeur[, base]);

l’argument "base" est optionnel et prend la valeur 10 par défaut. Cette fonction convertit une chaîne de caractères en valeur numérique entière. Exemples

Voici quelques exemples du résultat de cette fonction :
valeur parseInt(valeur) "10" 10 "blabla" "isNaN" "10blabla" 10 "balbla10" "isNaN" "10.5" 10 "10,5" 10

"isNaN" signifie "is Not a Number" (n’est pas un nombre). Si la valeur commence par des chiffres et continue par des caractères alphabétiques, parseInt tronque pour ne garder que les chiffres (ce qui est pratique pour récupérer la valeur de "10 €", par exemple). Si la valeur ne contient que des caractères alphabétiques ou commence par des caractères alphabétiques, parseInt() retourne "isNaN". Dans notre exemple précédent de 2 champs a et b, il faudrait écrire :
var c = parseInt(a) + parseInt(b);

Utilisation de l’argument base Cet argument peut servir à convertir une chaîne écrite dans une base quelconque en un nombre décimal. Voici des exemples :
parseInt("FF", 16); // donne 255 ("FF" en hexadécimal)  parseInt("11111111", 2); // donne également 255 ("1111 1111" en binaire)

parseFloat()
Syntaxe
parseFloat(valeur);

Cette fonction agit comme parseInt(), mais permet de récupérer des nombres avec décimales. Exemples
valeur parseFloat(valeur) "10" 10 "blabla" "isNaN" "10blabla" 10 "balbla10" "isNaN" "10.5" 10.5 "10,5" "isNaN"

"10e+2"

10E+2 (notation scientifique)

isNaN()
Syntaxe
isNaN(valeur);

Cette fonction détermine si une chaîne de caractères est numérique ou pas. Si la chaîne n’est pas numérique, la fonction retourne "true", sinon (si elle est numérique), elle retourne "false". Exemples
valeur isNaN(valeur) "10" false "blabla" true "10blabla" true "balbla10" true "10.5" false "10,5" true "10e+2" false

eval()
Syntaxe
eval(valeur);

Cette fonction est parfois utilisée à tort à la place de parseInt() ou de parseFloat() pour "évaluer" une valeur numérique. Elle permet principalement d’évaluer une chaîne de caractère. Voici un exemple :
var alerte = "alert('Ceci est un message');";

Si vous faîtes : eval(alerte);, vous avez une boîte d’alerte : « Ceci est un message ». A quoi ça sert ? Ca peut servir dans certains cas à générer du code Javascript à la volée. Voici un exemple : Voici une fonction qui tente de redimensionner une image en fonction de la largeur de l’écran et de l’écrire dans la page :
<script language="Javascript">  <!­­  var largeur_page = document.body.offsetWidth;  // ­­>  </script>  <body>  <script language="Javascript">  <!­­

if (largeur > largeur_page) {  hauteur *= parseInt(largeur_page / largeur);  largeur = largeur_page;  }  document.write('<img src="' + image + "' width="' + largeur + "' height="' +  hauteur + '" />");  // ­­>  </script>

Mais ça ne marche pas... Parce que document.body.offsetWidth n’est connu que lorsque la page a été chargée. Or dans le script, il est défini avant. Vous aurez donc une valeur "undefined" et votre image ne s’affichera pas. Il faudrait faire :
<script language="Javascript">  <!­­  var largeur_page = "document.body.offsetWidth";  // ­­>  </script>  <body>  <script language="Javascript">  <!­­  if (largeur > eval(largeur_page)) {  hauteur *= parseInt(eval(largeur_page) / largeur);  largeur = eval(largeur_page);  }  document.write('<img src="' + image + "' width="' + largeur + "' height="' +  hauteur + '" />");  // ­­>  </script>

La variable largeur_page est une chaîne de caractères. Et dans le 2e script, on utilise la fonction eval() pour évaluer cette chaîne. Evidemment, on pourrait définir largeur_page dans le 2e script. Mais dans un script plus compliqué, il est plus facile de manipuler des variables que des propriétés d’objets.

Ces boîtes de dialogue sont : la boîte d’alerte, la boîte de confirmation et la boîte de saisie
la boîte d’alerte alert("un  message") permet de communiquer une information au visiteur, la boîte de confirmation confirm("un  message"), peu utilisée, permet de proposer un choix vrai/faux au visiteur, et la boîte de saisie prompt("un  message",  "réponse  par  défaut"), rarement utilisée, permet à l’utilisateur de saisir des informations. alert C’est la boîte d’alerte classique que vous rencontrez dans tous les sites

<script language="JavaScript">  alert("Voici un message d'alerte");  </script>

Testez ici : confirm La fonction confirm() admet un argument qui est la question posée. Elle retourne vrai si l’utilisateur a cliqué sur OK, et faux s’il a cliqué sur Annuler

<script language="JavaScript">  if (confirm("Si vous confirmez, la boîte de réponse affiche 'confirmé', sinon  'refusé'"))  var reponse = "confirmé";  else  var reponse = "refusé";  </script>

Cliquez sur "tester confirm", votre réponse sera affichée dans la boîte texte :

prompt La fonction admet 2 arguments : la question posée une réponse par défaut qui sera affichée dans la case de réponse : mettre "" pour ne rien afficher

Elle retourne la réponse saisie.

<script language="JavaScript">  var reponse = prompt("Quel est votre nom ? (votre réponse sera affichée dans la  boîte de réponse)", "Zébulon");  </script>

Cliquez sur "tester prompt", votre réponse sera affichée dans la boîte texte :

Voici un autre exemple, qui permet de saisir une série de valeurs et de les stocker dans un tableau

<script language="JavaScript">  var reponse = prompt("Saisir une série de valeurs (séparer par une virgule)", "");  if (reponse) var valeurs = reponse.split(/,\s?/);  else var valeurs = null;  </script>

Les valeurs saisies doivent être séparées par une virgule. La fonction split() retourne un tableau de valeurs, résultat du découpage de reponse en prenant la virgule comme séparateur. Comme on a l’habitude de mettre un espace après la virgule, il faut aussi en tenir compte ("/,\s/" est une expression régulière). Cliquez sur "tester prompt", le tableau résultant sera affiché dans la boîte texte multiligne :

fonctions de conversion de caractères spéciaux
Ces 2 fonctions sont des fonctions du langage, elles ne dépendent d’aucun objet et sont donc appelées escape(x) et unescape(x).

Elles permettent de traiter les caractères dits « spéciaux », c’est‐à‐dire tous les caractères autres que les chiffres, les lettres non accentuées et les caractères "+‐*/_@ et . (point). Les lettres accentuées sont considérées comme des caractères spéciaux.

Escape
Cette fonction permet de convertir un caractère spécial ou ou chaque caractère spécial d’une chaîne de caractères en une chaîne contenant "%" + le code ASCII du caractère en hexadécimal. Exemples
escape(" "); // donne "%20"  escape("l'été"); // donne "l%27%E9t%E9"

Unescape
Cette fonction réalise l’inverse de escape() : elle prend en argument un code ou une chaîne de caractères et/ou de codes qu’elle convertit en lettres. Ces codes sont constitués de "%" suivi de 2 caractères hexadécimaux.

Exemples
unescape("%20"); // donne " "  unescape(""l%27%E9t%E9"); // donne "l'été"

Paramètres fournis dans une URL Pour récupérer les valeurs envoyées par un formulaire utilisant la méthode GET : traite_formulaire.htm?prenom=Bertrand&nom=Vicomte%20de%20la%20Margelle.
var params = unescape(location.search.substring(1));  var tab = params.split("&");  var prenom = tab[0].substring(tab[0].indexOf("=")+1);  var nom = tab[1].substring(tab[1].indexOf("=")+1);

Donne : prenom nom = "Vicomte de la Margelle"

=

"Bertrand"

Tableau des caractères ASCII
On lit le tableau de cette manière pour unescape("%H1H2") : H1 est le code hexadécimal à gauche H2 est le code hexadécimal en haut. Par exemple pour le caractère "é" on lit "E9" ("E" à gauche, "9" en haut). Les caractères non convertis par escape / unescape sont en italique sur fond grisé.

Caractères non ASCII Pour les caractères non ASCII, escape() et unescape() placent un "u" après le "%", pour indiquer qu’il s’agit d’un caractère Unicode. Exemples : escape("œ") ; unescape("%u20AC") ; donne "€" (euro) 

donne

"%u0153"

Normes ASCII, ANSI, ISO et Unicode  Pour l’ordinateur les caractères sont des groupes de bits, un bit étant l’unité de base, valant 0  ou 1. Il a fallu donner un code aux caractères. 

Code ASCII 
La première norme encore en usage a été le code ASCII, qui code les caractères sur 7 bits, soit  2 puissance 7 possibilités = 128 caractères. Les codes 0 à 31 correspondent à des touches de  fonctions (comme la tabulation, la touche Entrée...). Le code 32 est l’espace. Et les autres  codes correspondent aux caractères latins majuscules et minuscules, aux chiffres et à la  plupart des ponctuations.  Microsoft ayant eu besoin de plus de caractères, a créé pour le DOS un code ASCII étendu,  qui utilise 8 bits soit 256 caractères. Les codes qui suivent les codes ASCII standard  reprennent la plupart des caractères utilisés dans les langues d’Europe occidentale, plus des  caractères commerciaux, et des caractères utiles aux logiciels Microsoft. 

Code ANSI

Il a fallu créer un standard. Ca a été le code ANSI, qui utilise le code ASCII pour les 128  premiers caractères, mais avec un codage différent pour les 128 suivants, faisant plus de place  aux alphabets occidentaux. 

Codes ISO 
Pour coder les caractères utilisés dans toutes les langues, il a fallu trouver autre chose. D’où le  codage ISO ou iso­8859, qui utilise plusieurs jeux de caractères en fonction de la famille de  langues utilisée. En ce qui concerne les langues occidentales (français, allemand, espagnol,  italien, anglais, danois...), on utilise le code iso­8859­1 (cf précision d’Agnès Maunoury en  bas de page) que vous devez trouver en tête de vos pages HTML : charset=iso­8859­1  (voir en code source).  Les 128 premiers caractères d’un jeu ISO sont toujours les 128 caractères du code ASCII, et  les 128 suivants servent à la langue utilisée. Donc le code ISO se fait toujours sur 8 bits (ou  un octet).  Il existe un grand nombre de jeux de caractères ISO pour le grec, l’arabe, le chinois, le  japonais.... Pour ces 2 dernières langues en particulier, le code ISO se fait sur 2 octets, soit 16  bits, permettant de répertorier un maximum de 65536 caractères. 

Unicode 
Unicode a pour but d’unifier tout ça, et d’attribuer à tout signe un numéro unique, codé sur 2  octets, et ce pour toutes les écritures présentes et passées. Il n’est plus nécessaire de déclarer  quel type d’alphabet on utilise. On peut par exemple écrire quelques mots de chinois dans un  texte en français.  De plus chaque signe contient un certain nombre de propriétés, comme le sens de l’écriture,  pour l’arabe par exemple.  Unicode ne décrit pas comment les signes sont déssinés. Ce sont les logiciels et les polices qui  en ont la charge.  Pour écrire un caractère Unicode en HTML (et dans n’importe quel autre langage), par  exemple le « œ » : 
&#339  en décimal ou &#x153;  en hexadécimal, c’est­à­dire "&#" + le code (précédé de "x" si 

en hexadécimal) + " ;".  Et en Javascript : 
\uXXXX  où XXXX sont des caractères hexadécimaux.  Exemples : « œ » s’écrira \u0153  « € » s’écrira \u20AC  (&#x20AC;  en HTML, les navigateurs actuels ne semblent pas supporter 

le codage décimal pour cette valeur, soit "&#8264;").  Voici les 3 premiers tableaux Unicode (pour connaître le code d’un caractère, ajouter le  numéro de ligne et le numéro de colonne) :

setTimeout() et setInterval()

Recommandations
Ne pas abuser de ces fonctions, qui sollicitent plus ou moins le processeur de la machine cliente, le bonnet d’âne revenant à Netscape 4, qui paralyse quasiment la machine. Si vous utilisez ces fonctions, il faut prévoir de les arrêter à la sortie de la page, grâce aux fonctions clearTimeout() ou clearInterval() :

<body onUnload="clearTimeout(timer)">

Définition et syntaxe
setTimeout La fonction setTimeout() retarde l’exécution de la fonction en argument d’un delai exprimé en millisecondes et retourne un objet timer :
var timer = setTimeout("ma_fonction()", delai);

On peut très bien appeler la fonction :
setTimeout("ma_fonction()", delai);

mais on aura beoin de la variable timer pour tuer le timer. clearTimeout Cette fonction détruit l’objet timer, qui est retourné par la fonction setTimeout(). Même si setTimeout() n’est plus appelée, le timer existe toujours.
clearTimeout(timer);

setInterval
setInterval() a le même rôle que setTimeout(), mais se déclenche à intervalles réguliers.
var timer = setInterval("ma_fonction()", delai);

clearInterval
clearInterval() a le même effet que clearTimeout(), mais appliqé à setInterval() :
clearInterval(timer);

Appel par référence Sur les navigateurs récents, on peut appeler la fonction par référence et non à travers une chaîne de caractères. Ce qui est beaucoup plus efficace :
setTimeout(ma_fonction, delai);

Note : ma_fonction est indiqué sans parenthèses à la fin.

Fonctionnement
Contrairement à ce qu’on pourrait penser, ces 2 fonctions setTimeout() et setInterval() ne bloquent pas le script pendant le délai indiqué, comme peut le faire la fonction wait(delai) dans certains langages. Elle retarde la fonction en argument, mais continue le script.

Voici un exemple. Au chargement d’une page avec des cadres, on voudrait appeler une fonction d’un autre cadre. On a une erreur parce que la page de cet autre cadre n’était pas encore chargée, quand l’appel de la fonction a eu lieu. Donc on va retarder cet appel.
var valeur = 0;  // appelle "ma_fonction()" dans le cadre "autrecadre" et retourne sa valeur  function appel_fonction() {  valeur = location.autrecadre.ma_fonction();  }  // retarde l'appel de la fonction de 1 seconde  var timer = setTimeout("appel_fonction()", 1000);  // affiche la valeur générée par la fonction "ma_fonction()"  alert("La valeur = " + valeur);

Ce que fait le script : il retarde puis il continue ensuite, au bout ma_fonction() dans l’appel à "appel_fonction()" de 1 seconde le script et affiche immédiatement le contenu de valeur de 1 seconde, il appelle appel_fonction(), laquelle appelle le cadre "autrecadre".

Donc la valeur affichée sera la valeur initiale (0) et non pas celle retournée par "ma_fonction()". Evidemment, dans ce cas simple, il suffirait de mettre le traitement de la valeur (ici un affichage avec alert()) dans le corps de la fonction appel_fonction() pour que ça fonctionne (bien que ce système ne soit pas le meilleur pour être certain qu’un cadre soit chargé).

Différences entre setTimeout() et setInterval()
La différence est que setTimeout() n’est appelée qu’une seule fois, comme dans l’exemple précédent, et que setInterval() est appelée à intervalles réguliers, jusqu’à ce qu’on la "tue" avec clearInterval(). Exemple Déplacement d’un layer (on ne détaillera pas les fonctions de traitement des layers).

var timer = null;  function deplacer_layer(x){  ...  }  function position_layer() {  ...  }  function deplacement() {  if (position_layer() < 800)  deplacer_layer(10);  else clearInterval(timer);  }  timer = setInterval("deplacement()", 100);

setInterval() appelle la fonction deplacement() tous les 1/10 de seconde. Ce qui a pour effet de déplacer le layer de 10 pixels à chaque fois. Lorsque le layer arrive à 800, deplacement() appelle clearInterval() ce qui arrête setInterval(). Notre layer parcourt donc 800 pixels en 1,20 seconde.

Appel récursif à setTimeout() La fonction setInterval() a été implémentée dans la version Javascript 1.2, alors que setTimeout() l’a été dans la version 1.1. Donc par souci de compatibilité avec les navigateurs anciens, on trouve des appels récursifs à setTimeout() à la place de setInterval(). Mais les navigateurs ne supportant pas Javascript 1.2 étant maintenant rares, il n’y a plus lieu d’y avoir recours. Voici comment on fait :

var timer = null;  function deplacer_layer(x){  ...  }  function position_layer() {  ...  }  function deplacement() {  if (position_layer() < 800) {  deplacer_layer(10);  timer = setTimeout("deplacement()", 100);  }  else clearTimeout(timer);  }  deplacement(); 

deplacement() commence par déplacer le layer, puis appelle setTimeout() qui rappelle deplacement() au bout de 100 millisecondes, ou bien appelle clearTimeout() si le layer arrive à 800.

Passage de paramètres
Dans certains cas, il est nécessaire de passer des paramètres à la fonction appelée par la fonction retardateur (on utilisera ici setTimeout, mais c’est valable pour toutes ces fonctions). Passage de constantes Lorsqu’on ne passe que des constantes, c’est facile, il suffit de les placer entre les () de la fonction appelée :
setTimeout("ma_fonction(10, 100)", delai);

Si c’est une constante chaîne de caractère, vous devez l’entourer soit d’apostrophes, soit de guillemets échappés :
setTimeout("ma_fonction('ma valeur', 100)", delai);  setTimeout("ma_fonction(###BOT_TEXT###quot;c'est ma valeur###BOT_TEXT###quot;, 100)", delai);

Passage de variables Javascript évalue la chaîne de caractères en premier argument de la fonction setTimeout, comme le fait la fonction eval() ou comme fait alert(chaine). Par exemple pour passer var1 et var2 en argument :
setTimeout("ma_fonction(" + var1 + ", " + var2 + ")", delai);

Passage d’arguments avec les navigateurs récents On a vu qu’avec les navigateurs récents, on pouvait appeler la fonction par référence :
setTimeout(ma_fonction, delai);

Pour ajouter des arguments, c’est plus simple : il faut les indiquer après le délai.
setTimeout(ma_fonction, delai, var1, var2);

Introduction aux événements, liste des événements

Qu’est‐ce qu’un événement
Javascript est géré par des événements : le premier événement dans une page HTML est le chargement de la page, puis les diverses actions provoquées par l’utilisateur : clic sur un bouton, défilement de la page, déplacement de la souris..., enfin le dernier événement est la fermeture de la page. Un script Javascript est toujours déclenché par un événement, ne serait‐ce qu’au chargement de la page. On associe un événement à une fonction Javascript de cette manière :
<BALISE_HTML onEvenement = "fonction_javascript()">

Exemple : envoi d’un formulaire en cliquant sur un bouton
<input type="button" valeur="Envoyer" onClick="document.forms[0].submit()">

Mais au chargement de la page, le fait d’écrire directement son script en dehors d’une fonction, déclenche ce script ; exemple :
document.write("Salut !");

dans ce cas, « Salut ! » est écrit dans la page, au moment du chargement.

Liste des événements
Cette liste vaut pour Netscape. Internet Explorer est beaucoup plus riche en événements (voir Microsoft DHTML). Nom Objets concernés Objets concernés (IE) Déclenchement

(Netscape)
onAbort images fenêtre (window) et tous les éléments d’un formulaire champs text, textareas, listes déroulantes (select) boutons, boutons radio, cases à cocher, liens images L’utilisateur annule le chargement d’une image (par exemple en cliquant sur un lien ou en clliquant sur le bouton Arrêter) L’utilisateur quitte un élément de formulaire ou la fenêtre

onBlur

tout objet sauf corps du document (body)

onChange

champs text, textareas, Modification de la valeur d’un listes déroulantes (select) élément de formulaire tout objet ou balise, sauf fenêtre (window) n’existe pas chez IE, qui dispose de plusieurs événements onDrag (tout objet ou balise, sauf fenêtre) Clic de l’utilisateur sur un de ces éléments

onClick

onDragDrop

fenêtre (window)

L’utilisateur traîne un objet et le relâche dans la fenêtre

onError

images, fenêtre (window) fenêtre (window) et tous les éléments d’un formulaire document, images, liens, zones de texte document, images, liens, zones de texte document, images, liens, zones de texte corps du document (document body) document, boutons, liens

Le chargement de la page ou d’une image provoque une erreur (url images, fenêtre (window) erronée, page ou image manquante, image corrompue) tout objet sauf corps du document (body) tout objet ou balise, sauf fenêtre (window) tout objet ou balise, sauf fenêtre (window) tout objet ou balise, sauf fenêtre (window) applet, body, embed, frame, iframe, image, liens, scripts tout objet ou balise, sauf fenêtre (window) tout objet ou balise, sauf fenêtre (window) tout objet ou balise, sauf fenêtre (window) tout objet ou balise, sauf fenêtre (window) tout objet ou balise, sauf fenêtre (window) tout objet ou balise Le curseur est placé sur la fenêtre ou dans un élément de formulaire Enfoncement d’une touche du clavier Enfoncement d’une touche du clavier ou touche maintenue enfoncée Relâchement d’une touche du clavier Chargement de la page dans le navigateur Enfoncement du bouton de la souris Déplacement de la souris Déplacement de la souris en dehors de la zone de l’objet Déplacement de la souris dans la zone de l’objet Relâchement du bouton de la souris Déplacement de la fenêtre

onFocus

onKeyDown

onKeyPress

onKeyUp

onLoad onMouseDown

onMouseMove rien par défaut onMouseOut map areas, liens

onMouseOver map areas, liens onMouseUp onMove document, boutons, liens fênêtre (window)

onReset onResize onSelect onSubmit onUnload

formulaire fênêtre (window) champs text, textareas formulaire corps du document (document body)

formulaire tout objet sauf corps du document (body)

Annulation d’un formulaire (clic sur le bouton Annuler) Redimensionnement de la fenêtre

champs text, textareas, Sélection de la zone de texte d’un corps du document (body) champ de formulaire formulaire Envoi d’un formulaire corps du document (body), frameset, fenêtre Fermeture de la page (window)

constantes undefined, null, false, 0, "" et NaN

Ces constantes retournent « false »
Toutes les constantes suivantes retournent « false », ou plus précisemment, si x prend la valeur d’une des constantes suivantes, if (x) retourne « false » : undefined [1], null, false, 0, "" NaN (Not a Number [2]) Exemple :
var x; // x est indéfini (undefined)  var y = null;  var z = "";  if (x) alert("x est vrai");  else alert("x est faux);  if (y) alert("y est vrai");  else alert("y est faux);  if (z) alert("z est vrai");  else alert("z est faux);

(chaîne

vide)

retournera « x est faux, y est faux, z est faux ».

Equivalences entre constantes
Cependant 2 variables valant l’une de ces constantes ne sont pas nécessairement égales, et ça peut varier d’un navigateur à l’autre. Voici un tableau de ces constantes. En rouge, il n’y a pas équivalence, en bleu, il y a équivalence (en grisé la constante n’est pas supportée). Par exemple, si x  =  false et y  =  null, x et y ne sont pas égaux (if  (x  ==  y) donne « false ») avec IE6, par contre Netscape4 les considère comme égaux.

undefined null
IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7

null

false

0

chaîne vide

false

IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, (Ope6), K‐ m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7 IE6, Moz1.5, NN4.0, NN4.7, Ope7, K‐m0.7

0

chaîne vide

NaN

Les navigateurs testés (sous Windows) : IE 6 (Internet Explorer 6) Moz1.5 (Mozilla 1.5, équivalent à Netscape 7) NN4.0 (Netscape 4.00 à 4.05) NN4.7 (Netscape 4.7, versions 4.06 et suivantes) Ope7 (Opera 7) et Ope6 (Opera 6) mentionné lorsqu’il y a une différence avec la version 7 K_m0.7 (K_meleon 0.7, basé sur le moteur Gecko de Mozilla)

En conclusion
Lorsqu’une variable x a pour valeur l’une de ces 6 constantes, if (x) retourne « faux ». Par contre, 2 variables ayant pour valeur 2 constantes différentes sont considérées comme égales, si elles valent respectivement : "null" et "undefined", "false" et 0, "false" et "". Dans tous les autres cas, elles sont considérées comme différentes. Avec beaucoup de particularités pour Netscape 4.0.
Notes : [1] la constante « undefined » n’existe pas sous Netscape 4.0 à 4.05, il suffit de créer une variable sans valeur qui servira de constante « undefined » [2] valeur générée par la fonction isNaN(), qui teste si une chaîne est numérique

Comment faire en Javascript pour transmettre une ou des variables à une autre page HTML ?

Sommaire :
Principes, p1 Fonctions pratiques, p2

Principes
Pour transmettre une variable d’une page à une autre en Javascript, on utilise la méthode GET, c’est‐à‐dire qu’on passe la variable dans l’URL. Cette méthode a des inconvénients : manque de confidentialité : s’il s’agit d’un mot de passe, il vaut mieux éviter. limite à 2048 octets. Mais comme c’est la seule méthode, on fera avec. Transmettre une variable à une autre page via l’URL Si on n’a qu’une variable, on la transmet à la suite de l’URL, c’est‐à‐dire l’adresse de la page, et derrière un " ?" :
<a href="mapage.html?valeur">un lien</a>

Si on a plusieurs variables, on les sépare par des "&" :
<a href="mapage.html?valeur1&valeur2">un lien</a>

On ne doit pas mettre de guillemets autour des variables, même si ce sont des chaînes de caractères. On peut aussi transmettre le contenu de variables dans un script Javascript :

<script type="text/javascript">  document.write('<a href="mapage.html?" + variable1 + "&" + variable2 + ">un  lien</a>');  </script>

Récupérer la variable On se trouve dans la page réceptrice, mapage.html dans notre exemple. On veut récupérer la ou les variables transmises. Pour cela, il faut utiliser la propriété search de l’objet location qui retourne tout ce qui suit l’URL :
var query = location.search;

Dans le 1er exemple, query vaudra " ?valeur". Il faut donc éliminer ce " ?" :
var variable = location.search.substring(1);

Dans le 2e exemple, query vaudra " ?valeur1&valeur2". Il faut donc éliminer " ?" et découper le résultat en prenant "&" comme séparateur :

var chaine = location.search.substring(1);  var variables = chaine.split("&");

On aura nos valeurs dans variables[0] et dans variables[1].

Problème des caractères spéciaux Si les valeurs transmises contiennent des espaces, caractères accentués et autres caractères spéciaux, ils seront remplacés par leur code ASCII en hexadécimal, précédé d’un "%". Pour récupérer les bonnes valeurs, il faut utiliser unescape(). Dans notre dernier exemple, on pourra écrire, si les 2 valeurs représentent un nom et un prénom :

var nom = unescape(variables[0]);  var prenom = unescape(variables[1]);

Transmission de variables via un formulaire On peut transmettre des variables d’une page à l’autre via un formulaire, en utilisant la méthode GET. Voici un formulaire simplifié qui demande le nom et le prénom de l’utilisateur :

<form action="mapage.html" method="GET">  Votre nom : <input type="text" name="nom" value="" />  Votre prénom : <input type="text" name="prenom" value="" />  </form>

La page "mapage.html" recevra ces valeurs ainsi : "mapage.html ?nom=Zebulon&prenom=Kevin". Le traitement est un peu plus compliqué, car on a le nom des champs dans l’URL.

var params = location.search.substring(1).split("&");  var variables = new Array();  for (i in params) {  var segments_var = params[i].split("=");  variables[segments_var[0]] = unescape(segments_var[1]);  }

Vous variables["nom"] variables["prenom"] = "Kevin"

aurez =

donc : "Zebulon"

Ce petit code fonctionne quelque soit le nombre de variables. Évidemment, si vous êtes sûr de ne pas avoir de caractères spéciaux dans les variables, unescape est inutile. Note : les caractères " ?", "=" et "&" dans les variables sont respectivement codés "%3F", "%3D" et "%26" pour ne pas être confondus avec les mêmes caractères servant de séparateur dans l’URL.

Fonctions pratiques
Voici deux fonctions qui permettent de transmettre et de récupérer des variables dans une URL. Transmettre des variables

function transmettreParams(url) {  if (arguments.length == 2) {  url += (url.indexOf("?") == ­1) ? "?" : "&";  if (typeof arguments[1] != "object") url += arguments[1];  else {  var args = arguments[1];  var debut = true;  for (indice in args) {  if (debut) debut = false;  else url += "&";  url += (isNaN(indice) ? indice + "=" : "") + args[indice];  }  }  }  else if (arguments.length > 2) {  url += (url.indexOf("?") == ­1) ? "?" : "&";  for (i=1;i<arguments.length;i++) {  url += ((i == 1) ? "" : "&") + arguments[i];  }  }  location.href = url;  }

Comment utiliser cette fonction ? Voici plusieurs exemples : envoi d’un constante :
<a  href='javascript.transmettreParams("mapage.html",  mapage.html</a> "aaa")'>aller  à 

ce qui donnera : mapage.html ?aaa envoi d’une variable :

<script type="text/javascript">  var variable = "aaa";  </script>  <a href='javascript.transmettreParams("mapage.html", variable)'>aller à  mapage.html</a>

ce qui donnera : mapage.html ?aaa envoi d’une liste de constantes :
<a href='javascript.transmettreParams("mapage.html", "aaa", "bbb", "ccc")'>aller à  mapage.html</a>

ce qui donnera : mapage.html ?aaa&bbb&ccc envoi d’un tableau énuméré :

<script type="text/javascript">  var tab1 = new Array("aaa", "bbb", "ccc");  </script>  <a href='javascript.transmettreParams("mapage.html", tab1)'>aller à mapage.html</a>

ce qui donnera : mapage.html ?aaa&bbb&ccc envoi d’un tableau associatif :

<script type="text/javascript">  var tab2 = new Array();  tab2["a"] = "aaa";  tab2["b"] = "bbb";  tab2["c"] = "ccc";  </script>  <a href='javascript.transmettreParams("mapage.html", tab2)'>aller à mapage.html</a>

ce qui donnera : mapage.html ?a=aaa&b=bbb&c=ccc Récupération des paramètres

function recupererParams() {  var query = location.search.substring(1);  if (query.indexOf("&") == ­1) return query;  var params = query.split("&");  var associatif = (location.search.search(/([?|&]\w+=[^&]+)+/) != ­1);  var variables = new Array();  for (i in params) {  if (associatif) {  var segments_var = params[i].split("=");  variables[segments_var[0]] = unescape(segments_var[1]);  }  else variables.push(unescape(params[i]));  }  return variables;  }

Cette fonction récupère les paramètres dans l’URL. S’il n’y a qu’un seul paramètre, elle retourne une valeur unique. S’il y en a plusieurs, elle retourne un tableau. Dans les exemples 3 et 4, la fonction retourne un tableau énuméré :

variables[0] = "aaa";  variables[1] = "bbb";  variables[2] = "ccc";

Dans l’exemple 5 (le dernier), la fonction retourne un tableau associatif :

variables["a"] = "aaa";  variables["b"] = "bbb";  variables["c"] = "ccc";

Related Interests

est mon 2ème script</b></font></center>');

face="Arial" 

Et là, on obtient le résultat précédent. De même, on aurait pu écrire :
document.write("<center><font  color=###BOT_TEXT###quot;#0000ff###BOT_TEXT###quot;><b>C'est mon 2ème script</b></font></center>"); face=###BOT_TEXT###quot;Arial###BOT_TEXT###quot; 

Règle usuelle pour les chaînes de caractères
On utilise en général la 1ère forme :
document.write("<center><font  color='#0000ff'><b>C'est mon 2ème script</b></font></center>"); face='Arial' 

Soit des guillemets (") pour délimiter la chaîne et des apostrophes (’) à l’intérieur, surtout à cause des nombreuses apostrophes (’) du français. Mais sachez que les deux sont interchangeables.

Aperçu de la page définitive :
<html>  <head>  <title>mon 2ème script</title>  <script language="JavaScript">  <!­­ Debut script  document.write("<center><font face='Arial'  color='#0000ff'><b>C'est mon 1er script</b></font></center>");  //  Fin script ­­>  </script>  </head>  <body> 

</body>  </html>

Comment modifier une image au passage de la souris
On va continuer par quelque chose de très demandé, le survol d’image (ou rollover en anglais) ou comment modifier l’aspect d’une image au passage de la souris. C’est très simple ! Mais on va quand même y consacrer 2 leçons.

Les images d’origine
On va commencer par placer les 3 images par défaut dans notre page. C’est du HTML pur et vous pouvez faire ça en mode normal dans votre éditeur HTML :
<img border="0" src="images/bleu_p.gif" width="38" height="20">  <img border="0" src="images/rouge_p.gif" width="38" height="20">  <img border="0" src="images/vert_p.gif" width="38" height="20">

Ce qui donne l’aspect des 3 boutons ci‐dessus (sans le survol) Avant de continuer ; vous devez avoir créé les autres images, celles qui seront visibles lorsque la souris passera dessus. Voici l’ensemble des images que vous pouvez copier‐coller si vous n’en avez pas d’autres sous la main... Copiez ces images ou celles de votre choix dans un sous‐répertoire "images". (images par défaut) (images de survol) Les objets‐images Une page HTML est constituée d’objets (voir la page "Objets d’une page HTML"). Chaque fois que vous ajoutez une image à votre page, il se crée un objet‐image supplémentaire. Ainsi lorsque vous écrivez en HTML :
<img border="0" src="images/bleu_p.gif" width="38" height="20">

vous créez un objet image ayant les propriétés suivantes : bordure = 0 (border="0") source = "images/bleu_p.gif" (le fichier image) largeur = 38 (width="38") hauteur = 20 (height="20") Il existe encore d’autres propriétés qui n’ont pas été initialisées, mais on verra ça plus loin. Changer le fichier source de l’image Comme vous l’avez écrit, le fichier‐image associé à l’image "image1" est "images/bleu_p.gif", c’est ce que veut dire :
<img name="image1" src="images/bleu_p.gif">

Si on change le src (le source) :
<img name="image1" src="images/bleu_a.gif">

on aura la même image, mais en creux :

C’est le principe du survol. Mais pour que ça fonctionne en passant la souris, il faut indiquer quel événement déclenchera ce survol.

Les événements
onMouseOver et onMouseOut [1]

Il existe 2 événements : onMouseOver (réagit au passage de la souris sur un objet) et onMouseOut (réagit lorsque la souris quitte un objet). Lorsqu’on écrit
onMouseOver="this.src = 'images/bleu_a.gif'"

cela a pour effet d’afficher l’image "bleu_a.gif" lorsque la souris passe sur l’image Et :
onMouseOut="this.src = 'images/bleu_p.gif'"

a pour effet de réafficher l’image "bleu_p.gif" lorsque la souris quitte l’image. this Ca signifie « ceci » en anglais, et désigne l’objet en cours. Si vous écrivez l’instruction précédente telle quelle, le navigateur pensera que « this » représente la page, et ne fera rien, car l’objet « document » (la page) n’a pas d’attribut « src ». Par contre, ici « this » est dans l’objet image, et « this.src » désigne le fichier source de cet objet image :
<img  src="images/bleu_p.gif"  border="0"  onMouseover="this.src='images/bleu_a.gif'"  onMouseout="this.src='images/bleu_p.gif'"> width="38"  height="20" 

donnera ceci :

Le code complet pour les 3 boutons
Ce code est à écrire en l’état dans votre page HTML (donc pas dans un script Javascript) :
<img src="images/bleu_p.gif" border="0" width="38" height="20"  onMouseover="this.src='images/bleu_a.gif'"  onMouseout="this.src='images/bleu_p.gif'">  <img src="images/rouge_p.gif" border="0" width="38" height="20"  onMouseover="this.src='images/rouge_a.gif'"  onMouseout="this.src='images/rouge_p.gif'">  <img src="images/vert_p.gif" border="0" width="38" height="20"  onMouseover="this.src='images/vert_a.gif'"  onMouseout="this.src='images/vert_p.gif'">

ce qui donne :

Ca ne fonctionne pas avec Netscape 4 Ce code fonctionne sous Internet Explorer 4/5/6+, sous Netscape 6/7+, sous Mozilla 1+, mais pas sous Netscape 4 ou Internet explorer 3. On verra comment faire, dans le prochain article.

Netscape 4 n’accepte pas d’événement onMouseOver ou onMouseOut dans les images. Donc on va faire autrement. Et les versions 3 de Netscape et d’Internet Explorer n’acceptent pas d’objets image, donc de toute façon, le survol ne fonctionnera jamais avec ces navigateurs, qui se font de plus en plus rares.
Notes : [1] Ces événements font partie non de Javascript, mais du DOM (Document Object Model), qui, contrairement à Javascript, n’est pas sensible à la casse. Ce qui veut dire que vous pouvez écrire « onmouseover » ou « OnMouseOver » ou « ONMOUSEOVER », vous obtiendrez le même résultat.

Comment réaliser un survol d’image avec la compatibilité Netscape 4
Netscape 4 n’accepte pas les événements onMouseOver et onMouseOut dans les objets image. Par contre, ils fonctionnent dans un lien. On va créer une fonction Javascript, qui marchera pour toutes les images à survol, quelque soit la version du navigateur (les versions 3 de IE et Netscape ne verront pas ce survol, et les images seront fixes). Toujours nos 3 boutons :

onMouseOver et onMouseOut dans un lien
Ces événements seront intégrés dans le lien <a href=...>...</a>, au lieu de les mettre dans l’image. Mais le code this.src = ... ne fonctionnera plus, puisque ici « this » représente le lien et un lien n’a pas d’attribut « src ».

Il faut indiquer à la page quel objet va avoir son source modifier. Pour ça il faut donner un nom aux images. Nommer les images Pour nommer les images, on utilise l’attribut « name », attribut qu’on verra aussi dans toutes sortes d’objets.
<img name="image1" src="images/bleu_p.gif" border="0" width="38" height="20">

Et pour modifier son source, on écrira :
document.images["image1"].src = "images/bleu_p.gif";

où document.images est la collection des images de la page, et document.images["image1"] représente l’objet image du bouton bleu.

Fonction de survol
On va créer une fonction Javascript spéciale, qui modifiera le source de tout objet image :
<script language="JavaScript">  <!­­  var rep = "images/";  function survol(Objet, Fichier) {  if (!document.images) {}

document.images[Objet].src = rep + Fichier;  }  //­­>  </script>

La fonction sera appelée ainsi :
survol("image1", "bleu_a.gif");

L’argument « Objet » est le nom de l’objet image, celui qui est indiqué par l’attribut « name » de l’image. Et « Fichier » est le fichier source à changer. La variable « rep » est le répertoire des images. L’instruction if (!document.images) {} permet de ne rien faire, pour les navigateurs ne supportant pas les objets images.

Le code de l’image
Donc dans notre page HTML, on écrire notre image bleue ainsi :
<a href="#" onMouseOver="survol('image1', 'bleu_a.gif')"  onMouseOut="survol('image1', 'bleu_p.gif')">  <img name="image1" border="0" src="../images/bleu_p.gif" width="38"  height="20"></a>

Le code complet
<html>  <head>  <title></title>  <script language="JavaScript">  <!­­  var rep = "images/";  function survol(Objet, Fichier) {  if (!document.images) {}  document.images[Objet].src = rep + Fichier;  }  //­­>  </script>  </head>  <body>  <a href="#" onMouseOver="survol('image1', 'bleu_a.gif')"  onMouseOut="survol('image1', 'bleu_p.gif')">  <img name="image1" border="0" src="images/bleu_p.gif" width="38" height="20"></a>  <a href="#" onMouseOver="survol('image2', 'rouge_a.gif')"  onMouseOut="survol('image2', 'rouge_p.gif')">  <img name="image2" border="0" src="images/rouge_p.gif" width="38" height="20"></a>  <a href="#" onMouseOver="survol('image3', 'vert_a.gif')"  onMouseOut="survol('image3', 'vert_p.gif')">  <img name="image3" border="0" src="images/vert_p.gif" width="38" height="20"></a>  </body>  </html>

Ce qui donnera :

Lire le contenu d’un champ texte de formulaire

Page HTML et objets
Une page HTML est constituée d’objets : le contenu de la page (qui correspond à ce qui se trouve entre les balises et , les images, un formulaire, une case texte dans un formulaire, etc... Javascript sait manipuler tout ça à condition de leur donner un nom, de façon à ce qu’il sache sur quel objet il doit agir.

Lire le contenu d’une boîte de texte
Voici un exemple : Indiquez votre nom : Indiquez votre nom :

Indiquez votre nom, puis cliquez sur OK. Une boîte d’alerte indique le texte que vous avez saisi dans la boîte de texte. Voici le script :
<form method="POST" name="formulaire">  <p>Indiquez votre nom :<br>  <input type="text" name="nom" size="40">  <input type="button" value="OK" onClick="alert('Texte saisi : ' +  document.formulaire.nom.value)"></p>  </form>

Nommer les objets
Le formulaire Son nom est « formulaire ». On fait référence à ce formulaire en écrivant :
document.formulaire ou document["formulaire"]

Exemple : connaître le nom du formulaire :
document.formulaire.name; // donnera « formulaire »

La boîte de texte Son nom est "nom". On lui fait référence ainsi :
document.formulaire.nom

car c’est un objet inclus dans le formulaire. Exemple : lire sa valeur :
document.formulaire.nom.value;

« value » est une propriété des boîtes texte de formulaire. Le bouton « OK » On n’a pas besoin de son nom mais on lui a associé un événement.

Les événements
Chaque fois que vous bougez la souris, que vous cliquez quelque part dans la page, que vous modifiez la taille de la fenêtre.. un événement est déclenché. Chaque objet supporte un certain nombre d’événements. Les boutons déclenchent un événement "onClick" lorsqu’on clique dessus. Si on "associe" une fonction particulière à un événement, on déclenche cette fonction lorsque l’événement se produit. Exemples d’événements : onMove : mouvement de la souris onMouseover : passage de la souris sur un objet onMouseout : la souris quitte un objet onClick : on a cliqué sur un objet onChange : la valeur d’un objet a été changée onFocus : un objet a le "focus" (le curseur est sur l’objet) [1] Pour associer une fonction à un événement, il suffit d’écrire :
onEvenement="la_fonction()";

Tout simplement. Dans notre cas, on a associé la fonction « alert » (fonction prédéfinie du langage Javascript qui affiche une boîte d’alerte). Si on écrit dans la balise du bouton OK : onClick="alert(’Vous avez cliqué sur le bouton’)" ; le message « Vous avez cliqué sur le bouton » s’affichera à chaque fois que vous cliquez sur le bouton. Maintenant, pour indiquer le contenu de la boîte de texte "nom" dans le message d’alerte :
onClick="alert(document.test1.nom.value)"; Notes : [1] les événements sont des objets du DOM (Document Object Model), insensible à la casse, contrairement à Javascript. Donc on peut « onclick » ou « OnClick » ou « ONCLICK », le résultat sera le même.

Lire et écrire le contenu d’une boîte texte de formulaire

On va lire le contenu d’une boîte de texte et l’écrire dans une autre boîte de texte

Exemple
Indiquez votre nom ici, pluis cliquez sur OK Boîte texte « nom » :

Boîte texte « resultat »

Voilà le travail ! Voici le script :
<form method="POST" name="formulaire">  <p>Boîte texte « nom » :<br>  <input type="text" name="nom" size="40"></p>  <p>Boîte texte « resultat »<br>  <input type="text" name="resultat" size="40">  <input type="button" value="OK" onClick="document.formulaire.resultat.value =  document.formulaire.nom.value"></p>  </form>

Affecter une valeur à une boîte de texte
C’est facile :
document.formulaire.resultat.value = "voici le résultat";

a pour effet d’afficher « voici le résultat » dans la 2ème boîte de texte Maintenant, affecter la valeur d’une boîte de texte à une autre :
document.formulaire.resultat.value = document.formulaire.nom.value;

Il suffit ensuite d’associer cette action à l’événement onClick du bouton OK, et ça donne
onClick = "document.formulaire.resultat.value = document.formulaire.nom.value";

Petits calculs entre éléments de formulaire

Multiplier 2 boîtes de texte
On va multiplier le contenu de 2 boîtes de texte, et donner le résultat dans une troisième : Indiquez 2 chiffres, un dans chaque case de cette ligne : x

Voilà le résultat de la multiplication !

Voici le script :
<form method="POST" name="formulaire">  <p>Indiquez 2 chiffres, un dans chaque case de cette ligne :<br>  <input type="text" name="chiffre1" size="40"> x  <input type="text" name="chiffre2" size="40"></p>  <p>Voilà le résultat de la multiplication !<br>  <input type="text" name="resultat" size="40">  <input type="button" value="OK"  onClick="document.formulaire.resultat.value = document.formulaire.chiffre1.value *  document.formulaire.chiffre2.value"></p>  </form>

Calcul Si vous avez lu les 2 leçons précédentes, l’expression
onClick="document.formulaire.resultat.value  document.formulaire.chiffre1.value + document.formulaire.chiffre2.value"; = 

ne doit pas vous surprendre ; seulement au lieu d’affecter une simple valeur à une boîte de texte, on lui affecte la somme de la valeur de 2 boîtes de texte.

Division d’une boîte de texte par une valeur
Voici un exemple pour convertir des Francs en Euros Indiquez une valeur (en Francs) ‐ n’indiquez que des chiffres :

Voici la valeur convertie en euros :

Bon, ça ne donne pas un résultat très élégant, mais c’est le principe qui compte. script 1
<form name="formulaire1" method="POST">  <p>Indiquez une valeur (en Francs) ­ n'indiquez que des chiffres :<br>  <input type="text" name="francs" size="20">  <input type="button" value="OK" onClick="document.formulaire1.euros.value =  document.formulaire1.francs.value / 40.3399"></p>  <p>Voici la valeur convertie en euros :<br>  <input type="text" name="euros" size="20"></p>  </form>

On a le même principe qu’auparavant, mais on divise la valeur de la boîte francs par 6.55957 (le taux de conversion de francs en euros)
document.formulaire1.euros.value = document.formulaire1.francs.value / 6.55957;

script 2

On va utiliser une fonction de conversion, qui pourra éventuellement servir à d’autres cases.
<script language="JavaScript">  <!­­  function conversion(valeur) {  return valeur / 40.3399;  }  //­­>  </script>  </head>  <body>  <form name="formulaire1" method="POST">  <p>Indiquez une valeur (en Francs) ­ n'indiquez que des chiffres :<br>  <input type="text" name="francs" size="20">  <input type="button" value="OK"  onClick="document.formulaire1.euros.value =  conversion(document.formulaire1.francs.value)"></p>  <p>Voici la valeur convertie en euros :<br>  <input type="text" name="euros" size="20"></p>  </form>

Cette fonction ne fait que multiplier une valeur par 40.3399 et retourne le résultat.
document.formulaire1.euros.value = conversion(document.formulaire1.francs.value);

a pour effet d’affecter à la boîte de texte "euros" le résultat de la conversion de la valeur de la boîte francs, c’est‐à‐dire sa division par 40.3399

Calculs avec sélection dans une liste

Sélection de l’opérateur par une liste
On indique les 2 opérandes de l’opération (les 2 nombres). Lorsqu’on sélectionne l’opération, le résultat s’affiche directement dans la boîte résultat :
Indiquez 2 chiffres : Choisissez
addition  soustraction  multiplication  division 

l’opération : 

Voilà le résultat de l’opération

Voici le script :
<script language="JavaScript">  <!­­  function operation(val1, val2, operateur) {  switch (operateur) {  case 0 : return parseInt(val1) + parseInt(val2); break;  case 1 : return val1 ­ val2; break;  case 2 : return val1 * val2; break;  case 3 : if (val2 != 0) return val1 / val2;  else return "division par 0";  }

}  //­­>  </script>  </head>  <body>  <form method="POST" name="test5">  <table border="0" cellpadding="3" cellspacing="0" width="100%">  <tr>  <td width="55%" valign="top">Indiquez 2 chiffres  :<br>  <input type="text" name="chiffre1" size="10">  <input type="text" name="chiffre2" size="10">  <p>Voilà le résultat de l'opération<br>  <input type="text" name="resultat" size="20">  </td>  <td width="45%" valign="top">Choisissez l'opération :<br>  <select size="4" onChange="document.test5.resultat.value =  operation(document.test5.chiffre1.value,  document.test5.chiffre2.value, this.selectedIndex)">  <option>addition</option>  <option>soustraction</option>  <option>multiplication</option>  <option>division</option>  </select>  </td>  </tr>  </table>  </form>

Choix de l’opération dans la boîte de liste
La boîte de liste est un objet <SELECT>, dans lequel on a une liste d’options (<OPTION>). L’événement « onChange » se déclenche lorsqu’on sélectionne une option de cette liste. De plus, la propriété selectedIndex indique quelle option a été sélectionnée (0 pour la 1ère, 1 pour la 2ème, etc.). En associant l’instruction
onChange="document.formulaire.resultat.value = une valeur"

on déclenche l’affichage d’une valeur dans la boîte de texte « resultat ».

Fonction operation()
Elle a 3 arguments : val1 et val2 qui sont les valeurs transmises et operateur qui est le numéro de l’opérateur (0, 1, 2 ou 3). L’événement onChange lui transmet comme valeurs : document.formulaire.chiffre1.value pour val1, document.formulaire.chiffre2.value pour val2 this.selectedIndex pour operateur selectedIndex vaut 0 si on choisit l’addition, 1 si on choisit la soustration, etc.

Que signifie ce this ? On a vu ça dans la première leçon. On aurait pu remplacer this par document.formulaire.nom_liste (si on avait donné « nom_liste » comme nom à la boîte de liste), et on aurait écrit document.formulaire.nom_liste.selectedIndex. Comme l’instruction « onChange... » se trouve justement à l’intérieur de la balise <SELECT>, on peut utiliser this (pour faire plus court) qui indique l’objet en cours.

Les différentes parties d’une page HTML

Délimiteurs HTML La page est délimitée par les balises <HTML> et </HTML> En‐tête Limité par les balises <HEAD> et </HEAD>, cet en‐tête recevra la plupart de vos scripts, des fichiers .js ou des feuilles de styles inclus. Corps de la page Il est délimité par les balises <BODY> et </BODY> et contient tout votre code HTML ainsi que les scripts qui s’exécutent dans ce code.

Dans quelle partie de la page HTML doit‐on écrire son script ?
Réponse : là où c’est nécessaire...
Mais un principe de base : si votre script écrit dans la page (document.write() ), mettre le script à l’endroit de la page où il doit écrire ; sinon l’installer dans l’en‐tête (avant la balise </HEAD>) de la page

Dans la page, mais où ?
Voici un exemple :

<HTML>  avant la balise </HEAD>  <HEAD>  <SCRIPT LANGUAGE="Javascript">// script lu à l'ouverture de la page  <!­­ début de script  /* cette fonction sera lue et définie en début de page, mais elle ne sera  exécutée que lorsqu'on l'appelera (en appuyant le bouton, voir plus bas) */  function camarche() {  alert("oui, ça marche!");  }  // ligne exécutée en début de page  document.write("<font color='#FF0000'>la page commence à s'ouvrir (texte écrit  avant la balise </HEAD></font>");  ­­> // fin de script  </SCRIPT>  </HEAD>  dans la balise <BODY>  <!­­ la fonction appelée par onLoad est exécutée au chargement de la page ­­>  <!­­ et celle appelée par onUnload est exécutée lorsqu'on quitte la page ­­>  <BODY onLoad="camarche()" onUnload="alert('salut et à la prochaine')">  dans le corps de la page  <!­­ un formulaire ­­>  <FORM>  <INPUT TYPE=button VALUE="est­ce que ça marche?" onClick="camarche()">  <!­­ la fonction camarche() ne sera exécutée qu'en appuyant sur le bouton ­­>  <!­­ on aurait pu aussi bien se passer de la fonction camarche()  et écrire onClick="alert('oui, ça marche!')" ­­>  </FORM>  <p>Texte HTML dans la page</p>  <SCRIPT LANGUAGE="Javascript"> // script lu en fin de chargement de la page  <!­­ début de script  document.write("<font color='#FF0000'>texte écrit en milieu de page</font>");  ­­> // fin de script  </SCRIPT>  </BODY>  après la balise </BODY>  <SCRIPT LANGUAGE="Javascript"> // script lu en fin de chargement de la page  <!­­ début de script  document.write("<font color='#FF0000'>la page est chargée (texte écrit après la  balise </BODY></font>");  ­­> // fin de script  </SCRIPT> 

</HTML>

voir l’exemple On a utilisé un script dans le corps de la page (<INPUT TYPE=...>). Ce script est déclenché par un bouton, donc il ne sera utilisé qu’à ce moment‐là. Mais ce script fait appel à une fonction, qu’on a définie au début de la page. C’est une bonne méthode de définir les fonctions en tête de page : une fonction n’est exécutée que si elle est appelée. Le script défini dans le corps de la page sera exécuté au moment de sa lecture par le navigateur. Généralement, on peut dire qu’on place dans le corps de la page les scripts qui doivent écrire à cet endroit précis, les autres scripts devant être placés avant la balise
</HEAD>

Enfin, le dernier script est situé en fin de page, car il se déclenchera dès que la page est finie de charger.

Dans un fichier .js séparé
On peut également écrire son code Javascript dans un fichier séparé de la page qui l’utilise. C’est très utile lorsqu’on appelle les mêmes fonctions dans plusieurs pages de son site. Syntaxe Le fichier séparé est un fichier Javascript, d’extension .js, et qui ne contient que le code Javascript (définition de variables, de fonctions...), sans aucune balise HTML. On peut tout à fait écrire un fichier .js avec un éditeur texte comme le bloc‐notes de Windows. Il suffit de sauvegarder son fichier avec l’extension .js au lieu de .txt. Voici comment on appelle un fichier séparé dans sa page HTML :
<SCRIPT LANGUAGE="JavaScript" SRC="votre_fichier_javascript.js"></SCRIPT>

On peut le placer n’importe où, comme précédemment, mais de préférence avant la balise
</HEAD>

Évidemment, les appels aux fonctions définies dans ce fichier séparé devront se faire dans la page HTML. On peut également avoir le fichier séparé dans un autre répertoire :
<SCRIPT LANGUAGE="JavaScript" SRC="mon_rep/votre_fichier_javascript.js"></SCRIPT>  <SCRIPT LANGUAGE="JavaScript"  SRC="../mon_rep/votre_fichier_javascript.js"></SCRIPT>

Tous les navigateurs ne reconnaissent pas les fichiers .js séparés Jusqu’aux versions Netscape 3.04 et Internet Explorer 3.02 la définition d’un fichier .js séparé n’est pas reconnue ; certaines versions de Netscape 3.04 et Internet Explorer 3.02 le reconnaissent, pas d’autres... Après ces versions, pas de problème. Peut‐on utiliser plusieurs fichiers .js séparés ? Oui :

<SCRIPT  LANGUAGE="JavaScript"  SRC="votre_fichier_javascript1.js"></SCRIPT>  <SCRIPT LANGUAGE="JavaScript" SRC="votre_fichier_javascript2.js"></SCRIPT>

On peut aussi utiliser des fichiers .txt Vous pouvez aussi écrire vos scripts dans des fichiers .txt. Ca peut être utile si vous n’avez pas d’éditeur HTML pouvant sauvegarder vois fichiers en .js. Un exemple de fichier .js
// commentaire  var une_variable = "ma variable";  function ma_fonction1() {  document.write("<h3>Salut</h3>");  }  function ma_fonction2() {  $chaine = "<center>Salut</center>";  document.write(chaine);  }

Donc, rien d’autre dans ce fichier que du code Javascript. Pas d’en‐tête quelconque comme en HTML. On peut écrire des balises HTML mais dans un document.write() ou dans des variables qui doivent être affichées par un document.write().

3 remarques en passant
On a vu 2 méthodes de sortie :
alert("un message") qui affiche un message d’avertissement et document.write("un  texte") qui écrit dans la page en cours (mais uniquement au chargement de la page).

Les commentaires HTML et les commentaires Javascript :
<!­­ ce texte est un commentaire HTML ­­>  // ce texte est un commentaire Javascript, à ne mettre que dans un script  /* ce texte est encore un commentaire Javascript  qu'on peut écrire sur plusieurs lignes, à ne mettre que dans un script */

A quoi servent les lignes <!­­ début de script et ­­> // fin de script ? Elles permettent aux navigateurs ne reconnaissant pas le javascript d’ignorer le script (comme si c’était un commentaire) et de ne pas retourner d’erreur. De plus Netscape 4 renvoie une erreur Javascript si ces 2 signes de commentaires sont absents.

Les objets prédéfinis utilisés par le langage Javascript

L’organisation en objets
Le document HTML ou la page c’est la même chose. En Javascript on l’appelle « document ».

Le principe des objets (formulaires, images, liens, etc...) du document est la hiérarchisation. On peut comparer ça aux poupées russes. Le document a un formulaire appelé « nom_formulaire ». Ce formulaire a un champ (case) texte appelé « Nom » (dans lequel vous devez taper votre nom). Ce champ « Nom » a une propriété « value », qui est votre nom quand vous l’aurez saisi. Donc, en Javascript, la valeur de ce champ s’écrira :
document.nom_formulaire.Nom.value

Le point « . » sert de symbole de « filiation » entre objets et sous‐objets ou propriétés. de la même manière :
document.title vous donne le titre de la page (qui se trouve dans <TITLE>titre de la  page</TITLE>) document.nom_formulaire.name donnera « nom_formulaire », car c’est le nom du

formulaire
document.screen.width donnera la largeur de votre écran

Les collections
Le document possède une collection « images ». Ce sont toutes les images de la page. Par exemple les champs d’un formulaire ne font pas partie des "elements" de la page, mais ils font partie des "elements" du formulaire. document.images[0] est la première image de la page, document.images[1] est la deuxième, etc. En plus de la collection « images », il y a des collections comme « links » qui sont tous les liens hypertextes, « forms » représente tous les formulaires, etc. Exemple :
document.forms[0].name donnera « nomFormulaire »

De même les formulaires possèdent une collection « elements », qui sont tous les objets d’un formulaire, champs texte, boutons, cases à cocher, etc. Autre exemple de collection, si vous avez une série de boutons radio (boutons ronds parmi lesquels un seul ne peut être coché) appelés "boutonsronds", pour savoir lequel a été coché, il vous faudra utiliser la formule document.Formulaire.boutonsronds[i].checked ("i" étant un indice de recherche).

Les méthodes
En programmation objet, cela signifie les fonctions qui sont intégrées à un objet. Le document possède des méthodes, ainsi que les objets du document. On utilise toujours le point "." pour lier une méthode à son objet :

Exemple : le très courant document.write() qui écrit dans la page ou document.nomFormulaire.submit() qui envoie le formulaire. Les parenthèses sont indispensables, même s’il n’ya rien dedans. Cela indique à Javascript qu’il s’agit d’une fonction.

Les objets hors page
Dans une page HTML, il faut parfois s’occuper de se qui se passe en dehors... Par exemple, l’objet window caractérise la fenêtre du navigateur, différente de la page. Si vous avez des cadres dans votre fenêtre, chaque cadre contiendra une page (un document), et tous les cadres seront inclus dans la fenêtre (window). Vous pouvez ouvrir une autre fenêtre avec window.open(), et la refermer avec window.close(). L’objet location caractérise l’adresse Internet (l’URL) de votre page, mais il ne fait pas partie du document. location.href représente l’URL de la page ouverte. Si vous voulez charger la page "page2.htm", vous écrivez
location.href = "page2.htm

Pour revenir aux cadres : les cadres sont définis dans une "page de cadres", dans laquelle vous avez les balises

Les objets utilisateur
Vous pouvez vous aussi créer des objets à l’intérieur de la page et leur ajouter des propriétés et des méthodes, en utilisant le même principe.

Les types de données de base du langage Javascript et les tableaux

Les types de base en Javascript
page_chargee = true;  // vrai en anglais  x = 1;  y = x + page_chargee;  // donnera y = 2  texte = "2 v'là les flics!";  alerte = y + texte;  // donnera alerte = "22 v'là les flics!"

Voilà une horreur selon les « spécialistes » qui ont connu d’autres langages, mais bon, c’est possible en Javascript. On dit que Javascript est un langage à typage faible, c’est à dire qu’on peut affecter à peu près n’importe quoi à une variable. On distingue quand même 3 types de données de base : les booléens qui ne prennent que 2 valeurs « vrai » ou « faux » (true / false) les numériques, comme le nom l’indique les chaînes de caractères Exemples :
document.nom_formulaire.checkbox1.checked = true; a pour effet de cocher le bouton appelé « checkbox1 » du formulaire « nom_formulaire » (false aurait l’effet inverse)

var pi = 3.1416; affecte la valeur 3.1416 à la variable « pi » var nombre_jours = 365; affecte la valeur 365 à « nombre_jours » (le tiret « ‐ » est interdit dans le nom des variables, il faut utiliser le caractère de soulignement « _ ») var monNom = "Bernard Martin­Rabaud"; (on peut mettre n’importe quel caractère ‐ sauf quelques exceptions ‐ dans une chaîne de caractères) var vide = ""; c’est une chaîne de caractère vide, très utile... var tonNom = "je m'appelle 'Tania', et toi?";  var tonNom1 = 'je m","doc_promotions_enabled":false,"static_promo_banner_cta_url":""},"eligible_for_exclusive_trial_roadblock":false,"eligible_for_seo_roadblock":false,"exclusive_free_trial_roadblock_props_path":"/doc-page/exclusive-free-trial-props/185030","flashes":[],"footer_props":{"urls":{"about":"/about","press":"/press","blog":"http://literally.scribd.com/","careers":"/careers","contact":"/contact","plans_landing":"/subscribe","referrals":"/referrals?source=footer","giftcards":"/giftcards","faq":"/faq","accessibility":"/accessibility-policy","faq_paths":{"accounts":"https://support.scribd.com/hc/sections/202246346","announcements":"https://support.scribd.com/hc/sections/202246066","copyright":"https://support.scribd.com/hc/sections/202246086","downloading":"https://support.scribd.com/hc/articles/210135046","publishing":"https://support.scribd.com/hc/sections/202246366","reading":"https://support.scribd.com/hc/sections/202246406","selling":"https://support.scribd.com/hc/sections/202246326","store":"https://support.scribd.com/hc/sections/202246306","status":"https://support.scribd.com/hc/en-us/articles/360001202872","terms":"https://support.scribd.com/hc/sections/202246126","writing":"https://support.scribd.com/hc/sections/202246366","adchoices":"https://support.scribd.com/hc/articles/210129366","paid_features":"https://support.scribd.com/hc/sections/202246306","failed_uploads":"https://support.scribd.com/hc/en-us/articles/210134586-Troubleshooting-uploads-and-conversions","copyright_infringement":"https://support.scribd.com/hc/en-us/articles/210128946-DMCA-copyright-infringement-takedown-notification-policy","end_user_license":"https://support.scribd.com/hc/en-us/articles/210129486","terms_of_use":"https://support.scribd.com/hc/en-us/articles/210129326-General-Terms-of-Use"},"publishers":"/publishers","static_terms":"/terms","static_privacy":"/privacy","copyright":"/copyright","ios_app":"https://itunes.apple.com/us/app/scribd-worlds-largest-online/id542557212?mt=8&uo=4&at=11lGEE","android_app":"https://play.google.com/store/apps/details?id=com.scribd.app.reader0&hl=en","books":"/books","sitemap":"/directory"}},"global_nav_props":{"header_props":{"logo_src":"/images/landing/home2_landing/scribd_logo_horiz_small.svg","root_url":"https://www.scribd.com/","search_term":"","small_logo_src":"/images/logos/scribd_s_logo.png","uploads_url":"/upload-document","search_props":{"redirect_to_app":true,"search_url":"/search","query":"","search_page":false}},"user_menu_props":null,"sidebar_props":{"urls":{"bestsellers":"https://www.scribd.com/bestsellers","home":"https://www.scribd.com/","saved":"/saved","subscribe":"/archive/pmp_checkout?doc=185030&metadata=%7B%22context%22%3A%22pmp%22%2C%22action%22%3A%22start_trial%22%2C%22logged_in%22%3Afalse%2C%22platform%22%3A%22web%22%7D","top_charts":"/bestsellers","upload":"https://www.scribd.com/upload-document"},"categories":{"book":{"icon":"icon-ic_book","icon_filled":"icon-ic_book_fill","url":"https://www.scribd.com/books","name":"Books","type":"book"},"news":{"icon":"icon-ic_articles","icon_filled":"icon-ic_articles_fill","url":"https://www.scribd.com/news","name":"News","type":"news"},"audiobook":{"icon":"icon-ic_audiobook","icon_filled":"icon-ic_audiobook_fill","url":"https://www.scribd.com/audiobooks","name":"Audiobooks","type":"audiobook"},"magazine":{"icon":"icon-ic_magazine","icon_filled":"icon-ic_magazine_fill","url":"https://www.scribd.com/magazines","name":"Magazines","type":"magazine"},"document":{"icon":"icon-ic_document","icon_filled":"icon-ic_document_fill","url":"https://www.scribd.com/docs","name":"Documents","type":"document"},"sheet_music":{"icon":"icon-ic_songbook","icon_filled":"icon-ic_songbook_fill","url":"https://www.scribd.com/sheetmusic","name":"Sheet Music","type":"sheet_music"}},"categories_array":["mixed","book","audiobook","magazine","news","document","sheet_music"],"selected_content_type":"mixed","username":"","search_overlay_props":{"search_input_props":{"focused":false,"keep_suggestions_on_blur":false}}}},"recommenders":{"related_titles_recommender":{"ids":[7812941,249751150,326529450,85935530,17523387,252971013,73613061,315687691,259767311,376588788,262025564,46353536,200797104,335383271,177589783,174330239,346916719,19783144,177093524,376227628,335886008,362235317,360145720,118927359,159731145,232425556,116653620,17523390,25850349,91578139,282766939,263504218,239488191,212863738,244157917,253264900,224369806,225916486,224355300,238704340,224258670,163646054,224419023,182553141,202691564,211302755,239588474,293461549,224410295,224426877,224326250,224349281,234028503,273582508,273440534,224306619,249309502,337536061,182565115,254039238,163580087,224270540,235411767,224252178,224285255,231689346,224248577,250006950,235583696,182546874,249308781,224266633,216442529,182522032,163647832,163603389,246897514,163579056,182560283,163564256,224248520,249308236,224421552],"title_link":null,"title":null,"track_opts":{"compilation_id":"1rY71supWIjwj32Om7MfZSXFvzY=","module_id":"E66l2b/WlNcRNX67D17avek1a94=","widget_name":"right sidebar","track_id":"flattened_recommender"}},"footer_recommenders":{"recommenders":[{"ids":[7812941,249751150,326529450,85935530,17523387,252971013,73613061,315687691,259767311,376588788,262025564,46353536,200797104,335383271,177589783,174330239,346916719,19783144,177093524,376227628,335886008,362235317,360145720,118927359,159731145,232425556,116653620,17523390,25850349,91578139],"title_link":null,"title":"Documents Similar To DocJavaScript","track_opts":{"compilation_id":"1rY71supWIjwj32Om7MfZSXFvzY=","module_id":"VD/7UzgMBfP9GpUEHW6XHXAC2oo=","widget_name":"document_carousel"}}]},"seo_new_docs_recommenders":{"recommenders":[]},"documents":{"7812941":{"type":"document","id":7812941,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/7812941/108x144/c276174880/1358121687?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/7812941/216x288/232a882d6a/1358121687?v=1","title":"Javascript","short_title":"Javascript","author":"delkassas","tracking":{"object_type":"document","object_id":7812941,"track":"flattened_recommender","doc_uuid":"XbMIvnFsmYhIo3hnn4eGex/Dfug="},"url":"https://www.scribd.com/document/7812941/Javascript"},"17523387":{"type":"document","id":17523387,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/17523387/108x144/1da59d6959/1248150860?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/17523387/216x288/0acd997b61/1248150860?v=1","title":"Javascript Demandes","short_title":"Javascript Demandes","author":"youtreau","tracking":{"object_type":"document","object_id":17523387,"track":"flattened_recommender","doc_uuid":"loeyP0dhoivfDgJmiRCij2oTKcs="},"url":"https://www.scribd.com/document/17523387/Javascript-Demandes"},"17523390":{"type":"document","id":17523390,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/17523390/108x144/2cb55b743b/1248150861?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/17523390/216x288/96cf529d4e/1248150861?v=1","title":"stringJS","short_title":"stringJS","author":"youtreau","tracking":{"object_type":"document","object_id":17523390,"track":"flattened_recommender","doc_uuid":"GOYmFqbFZmf2y6Fc3LFKPl9lZFY="},"url":"https://www.scribd.com/document/17523390/stringJS"},"19783144":{"type":"document","id":19783144,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/19783144/108x144/3f65a40055/1399832555?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/19783144/216x288/9986c06f89/1399832555?v=1","title":"Qu’est ce que l’ActionScript 3 ch06","short_title":"Qu’est ce que l’ActionScript 3 ch06","author":"youtreau","tracking":{"object_type":"document","object_id":19783144,"track":"flattened_recommender","doc_uuid":"HOa3bnpRrkfFRL2bjLO+iom/ogM="},"url":"https://www.scribd.com/document/19783144/Qu-est-ce-que-l-ActionScript-3-ch06"},"25850349":{"type":"document","id":25850349,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/25850349/108x144/57209f975d/1417423389?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/25850349/216x288/b0aeb5e878/1417423389?v=1","title":"Cours de Langage C","short_title":"Cours de Langage C","author":"moutched","tracking":{"object_type":"document","object_id":25850349,"track":"flattened_recommender","doc_uuid":"E5sxeAAFdtGPvak+8/tTp/YoW94="},"url":"https://www.scribd.com/doc/25850349/Cours-de-Langage-C"},"46353536":{"type":"document","id":46353536,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/46353536/108x144/6b79e9c3d9/1308825130?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/46353536/216x288/0dc919fb9e/1308825130?v=1","title":"Introduction Jquery","short_title":"Introduction Jquery","author":"Zakaria_Outaro_1293","tracking":{"object_type":"document","object_id":46353536,"track":"flattened_recommender","doc_uuid":"Z5KAtkyBp/8n5MeGCS/JVP1FAag="},"url":"https://www.scribd.com/document/46353536/Introduction-Jquery"},"73613061":{"type":"document","id":73613061,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/73613061/108x144/0de845af48/1381107700?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/73613061/216x288/0d1248044f/1381107700?v=1","title":"Série exercice- Javascript - IDMANSOUR","short_title":"Série exercice- Javascript - IDMANSOUR","author":"Mohamed Dardaz","tracking":{"object_type":"document","object_id":73613061,"track":"flattened_recommender","doc_uuid":"Ene8KJEo0RYCcij74NTH6FrYGr8="},"url":"https://www.scribd.com/document/73613061/Serie-exercice-Javascript-IDMANSOUR"},"85935530":{"type":"document","id":85935530,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/85935530/108x144/847e9b9cf1/1434983994?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/85935530/216x288/980fac86b6/1434983994?v=1","title":"Programmez Javascript","short_title":"Programmez Javascript","author":"salaheddine019","tracking":{"object_type":"document","object_id":85935530,"track":"flattened_recommender","doc_uuid":"DBTYR0VtdL8/FD8CndTsxcp5TFY="},"url":"https://www.scribd.com/document/85935530/Programmez-Javascript"},"91578139":{"type":"document","id":91578139,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/91578139/108x144/4ab3b1d61b/1335562883?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/91578139/216x288/31dcfe8759/1335562883?v=1","title":"Utilisation_de_MPLAB","short_title":"Utilisation_de_MPLAB","author":"Loukay Letaifa","tracking":{"object_type":"document","object_id":91578139,"track":"flattened_recommender","doc_uuid":"9R0NbI1rKHdcZYPuU5fOZskn0eg="},"url":"https://www.scribd.com/document/91578139/Utilisation-de-MPLAB"},"116653620":{"type":"document","id":116653620,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/116653620/108x144/f8fbfcee62/1410035955?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/116653620/216x288/c0c44dca84/1410035955?v=1","title":"structure de controle","short_title":"structure de controle","author":"loesouleymane","tracking":{"object_type":"document","object_id":116653620,"track":"flattened_recommender","doc_uuid":"yOM/Jb9qQrXXHjh97a7Aozw4FtM="},"url":"https://www.scribd.com/document/116653620/structure-de-controle"},"118927359":{"type":"document","id":118927359,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/118927359/108x144/3af7cc5cc3/1383560380?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/118927359/216x288/08a11bf30c/1383560380?v=1","title":"guide de scripts","short_title":"guide de scripts","author":"Désiré Ted","tracking":{"object_type":"document","object_id":118927359,"track":"flattened_recommender","doc_uuid":"2K9D66cRQ3+icN3uTe9iKfb920A="},"url":"https://www.scribd.com/document/118927359/guide-de-scripts"},"159731145":{"type":"document","id":159731145,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/159731145/108x144/abe418de97/1398863088?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/159731145/216x288/7e89f488da/1398863088?v=1","title":"612438 Introduction Aux Algorigrammes","short_title":"612438 Introduction Aux Algorigrammes","author":"Isabelle54","tracking":{"object_type":"document","object_id":159731145,"track":"flattened_recommender","doc_uuid":"5o7Ldvv5lEBOXByy9rBeTIBCmLM="},"url":"https://www.scribd.com/document/159731145/612438-Introduction-Aux-Algorigrammes"},"163564256":{"type":"book","id":163564256,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163564256/108x144/19b813ddea/1537947273?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163564256/216x288/50918b57c9/1537947273?v=1","title":"Beautiful Ruins: A Novel","short_title":"Beautiful Ruins","author":"Jess Walter","tracking":{"object_type":"document","object_id":163564256,"track":"flattened_recommender","doc_uuid":"SUicTV6ND1iz13X9p/1dZkWu7GY="},"url":"https://www.scribd.com/book/163564256/Beautiful-Ruins-A-Novel"},"163579056":{"type":"book","id":163579056,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163579056/108x144/b0cc4a522d/1537866497?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163579056/216x288/cc1bed9752/1537866497?v=1","title":"The Art of Racing in the Rain: A Novel","short_title":"The Art of Racing in the Rain","author":"Garth Stein","tracking":{"object_type":"document","object_id":163579056,"track":"flattened_recommender","doc_uuid":"EzBk59zEFqh500Q648Xmb4ApbFw="},"url":"https://www.scribd.com/book/163579056/The-Art-of-Racing-in-the-Rain-A-Novel"},"163580087":{"type":"book","id":163580087,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163580087/108x144/865888b820/1537867764?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163580087/216x288/a50ec4d378/1537867764?v=1","title":"Bel Canto","short_title":"Bel Canto","author":"Ann Patchett","tracking":{"object_type":"document","object_id":163580087,"track":"flattened_recommender","doc_uuid":"rNNmrN2MErCbpFpE05WWPVAyitM="},"url":"https://www.scribd.com/book/163580087/Bel-Canto"},"163603389":{"type":"book","id":163603389,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163603389/108x144/9281c90791/1537872046?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163603389/216x288/a0de7e7dea/1537872046?v=1","title":"A Prayer for Owen Meany: A Novel","short_title":"A Prayer for Owen Meany","author":"John Irving","tracking":{"object_type":"document","object_id":163603389,"track":"flattened_recommender","doc_uuid":"X7mf5D7aqK0U0hZwx289mB669fs="},"url":"https://www.scribd.com/book/163603389/A-Prayer-for-Owen-Meany-A-Novel"},"163646054":{"type":"book","id":163646054,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163646054/108x144/c8eb9eae18/1537946605?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163646054/216x288/d6d700f05f/1537946605?v=1","title":"Devil in the Grove: Thurgood Marshall, the Groveland Boys, and the Dawn of a New America","short_title":"Devil in the Grove","author":"Gilbert King","tracking":{"object_type":"document","object_id":163646054,"track":"flattened_recommender","doc_uuid":"CPrnP6bF/vlXtqAK8+O7paTFbn0="},"url":"https://www.scribd.com/book/163646054/Devil-in-the-Grove-Thurgood-Marshall-the-Groveland-Boys-and-the-Dawn-of-a-New-America"},"163647832":{"type":"book","id":163647832,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163647832/108x144/9f4ce0c73a/1537945660?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163647832/216x288/c8974e0a45/1537945660?v=1","title":"The Cider House Rules","short_title":"The Cider House Rules","author":"John Irving","tracking":{"object_type":"document","object_id":163647832,"track":"flattened_recommender","doc_uuid":"rDMRe9YjGc/K1C9a2zKm31oobTQ="},"url":"https://www.scribd.com/book/163647832/The-Cider-House-Rules"},"174330239":{"type":"document","id":174330239,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/174330239/108x144/b054d28cd7/1381199732?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/174330239/216x288/c020cb9310/1381199732?v=1","title":"Correction TP1 Javascript 3","short_title":"Correction TP1 Javascript 3","author":"Life's Sweet","tracking":{"object_type":"document","object_id":174330239,"track":"flattened_recommender","doc_uuid":"CbpIH3mgXIK3TQu2eGFB0jwhk7o="},"url":"https://www.scribd.com/document/174330239/Correction-TP1-Javascript-3"},"177093524":{"type":"document","id":177093524,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177093524/108x144/3632f43d3a/1382084350?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177093524/216x288/be17df9d02/1382084350?v=1","title":"Xhtml Infobio 2004","short_title":"Xhtml Infobio 2004","author":"kerdaoui2","tracking":{"object_type":"document","object_id":177093524,"track":"flattened_recommender","doc_uuid":"DepJ6LhE+eY7XXn7fv3kmYOh8bA="},"url":"https://www.scribd.com/presentation/177093524/Xhtml-Infobio-2004"},"177589783":{"type":"document","id":177589783,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177589783/108x144/543b693145/1386607819?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177589783/216x288/345ece59ed/1386607819?v=1","title":"Programmation Avec DELPHI","short_title":"Programmation Avec DELPHI","author":"bendjillali youcef","tracking":{"object_type":"document","object_id":177589783,"track":"flattened_recommender","doc_uuid":"RbVU/oWjCQWVJHZD4k9g2M5+QR0="},"url":"https://www.scribd.com/document/177589783/Programmation-Avec-DELPHI"},"182522032":{"type":"book","id":182522032,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182522032/108x144/671b9a055b/1537946824?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182522032/216x288/ec6eb5c88b/1537946824?v=1","title":"The Bonfire of the Vanities: A Novel","short_title":"The Bonfire of the Vanities","author":"Tom Wolfe","tracking":{"object_type":"document","object_id":182522032,"track":"flattened_recommender","doc_uuid":"v9ygzhUmQ1zx2gJOYd523n0OIwQ="},"url":"https://www.scribd.com/book/182522032/The-Bonfire-of-the-Vanities-A-Novel"},"182546874":{"type":"book","id":182546874,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182546874/108x144/817bab2149/1537867846?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182546874/216x288/a6b6573207/1537867846?v=1","title":"The Love Affairs of Nathaniel P.: A Novel","short_title":"The Love Affairs of Nathaniel P.","author":"Adelle Waldman","tracking":{"object_type":"document","object_id":182546874,"track":"flattened_recommender","doc_uuid":"jODcS03X3w9e1oILxzWsqTTcuh8="},"url":"https://www.scribd.com/book/182546874/The-Love-Affairs-of-Nathaniel-P-A-Novel"},"182553141":{"type":"book","id":182553141,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182553141/108x144/1b40063d80/1537866887?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182553141/216x288/098f7f1651/1537866887?v=1","title":"The World Is Flat 3.0: A Brief History of the Twenty-first Century","short_title":"The World Is Flat 3.0","author":"Thomas L. Friedman","tracking":{"object_type":"document","object_id":182553141,"track":"flattened_recommender","doc_uuid":"6oQFrcr0I0FAqxg770YauAM9nak="},"url":"https://www.scribd.com/book/182553141/The-World-Is-Flat-3-0-A-Brief-History-of-the-Twenty-first-Century"},"182560283":{"type":"book","id":182560283,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182560283/108x144/229169a793/1537864537?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182560283/216x288/fc0b9ebffa/1537864537?v=1","title":"Wolf Hall: A Novel","short_title":"Wolf Hall","author":"Hilary Mantel","tracking":{"object_type":"document","object_id":182560283,"track":"flattened_recommender","doc_uuid":"UXAMFa1c+4ve2dnABwWGubsHSyo="},"url":"https://www.scribd.com/book/182560283/Wolf-Hall-A-Novel"},"182565115":{"type":"book","id":182565115,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182565115/108x144/50e3fc9eb2/1537865971?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182565115/216x288/8bbf81282a/1537865971?v=1","title":"The Silver Linings Playbook: A Novel","short_title":"The Silver Linings Playbook","author":"Matthew Quick","tracking":{"object_type":"document","object_id":182565115,"track":"flattened_recommender","doc_uuid":"ksQm4531StTiP6Cy8VfwSztXUkQ="},"url":"https://www.scribd.com/book/182565115/The-Silver-Linings-Playbook-A-Novel"},"200797104":{"type":"document","id":200797104,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/200797104/108x144/38c954cebc/1410179087?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/200797104/216x288/6cf5036e6b/1410179087?v=1","title":"Cours Javascript","short_title":"Cours Javascript","author":"KaiserYankee","tracking":{"object_type":"document","object_id":200797104,"track":"flattened_recommender","doc_uuid":"VBDQW+QU6rUDJ4cvtOVuhco+85Q="},"url":"https://www.scribd.com/document/200797104/Cours-Javascript"},"202691564":{"type":"book","id":202691564,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/202691564/108x144/f0e6e6416d/1537869541?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/202691564/216x288/56a5d067c6/1537869541?v=1","title":"Smart People Should Build Things: How to Restore Our Culture of Achievement, Build a Path for Entrepreneurs, and Create New Jobs in America","short_title":"Smart People Should Build Things","author":"Andrew Yang","tracking":{"object_type":"document","object_id":202691564,"track":"flattened_recommender","doc_uuid":"iKRMCKt5WKa+DuPqq6WAuI3Xgm0="},"url":"https://www.scribd.com/book/202691564/Smart-People-Should-Build-Things-How-to-Restore-Our-Culture-of-Achievement-Build-a-Path-for-Entrepreneurs-and-Create-New-Jobs-in-America"},"211302755":{"type":"book","id":211302755,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/211302755/108x144/2424de51a2/1537870532?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/211302755/216x288/09ee7462f3/1537870532?v=1","title":"The Hard Thing About Hard Things: Building a Business When There Are No Easy Answers","short_title":"The Hard Thing About Hard Things","author":"Ben Horowitz","tracking":{"object_type":"document","object_id":211302755,"track":"flattened_recommender","doc_uuid":"notLYtMe3UpjeXbVSX2wsJ59rbc="},"url":"https://www.scribd.com/book/211302755/The-Hard-Thing-About-Hard-Things-Building-a-Business-When-There-Are-No-Easy-Answers"},"212863738":{"type":"book","id":212863738,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/212863738/108x144/5bad102ef1/1537868451?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/212863738/216x288/8fc36df455/1537868451?v=1","title":"The Unwinding: An Inner History of the New America","short_title":"The Unwinding","author":"George Packer","tracking":{"object_type":"document","object_id":212863738,"track":"flattened_recommender","doc_uuid":"bnrsF9wjRkbAuWCBEOrca499XPs="},"url":"https://www.scribd.com/book/212863738/The-Unwinding-An-Inner-History-of-the-New-America"},"216442529":{"type":"book","id":216442529,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/216442529/108x144/7945e537de/1537947919?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/216442529/216x288/95db88293e/1537947919?v=1","title":"Lovers at the Chameleon Club, Paris 1932: A Novel","short_title":"Lovers at the Chameleon Club, Paris 1932","author":"Francine Prose","tracking":{"object_type":"document","object_id":216442529,"track":"flattened_recommender","doc_uuid":"Awm2KCrzy8ttg4XTSb9bS/o9PSQ="},"url":"https://www.scribd.com/book/216442529/Lovers-at-the-Chameleon-Club-Paris-1932-A-Novel"},"224248520":{"type":"book","id":224248520,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224248520/108x144/57b8f15c1c/1537871492?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224248520/216x288/2fc602273a/1537871492?v=1","title":"The Kitchen House: A Novel","short_title":"The Kitchen House","author":"Kathleen Grissom","tracking":{"object_type":"document","object_id":224248520,"track":"flattened_recommender","doc_uuid":"xkmso4MFXCYCT+rTROCvnmHMGKs="},"url":"https://www.scribd.com/book/224248520/The-Kitchen-House-A-Novel"},"224248577":{"type":"book","id":224248577,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224248577/108x144/d525463c67/1537943775?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224248577/216x288/2b59844b99/1537943775?v=1","title":"The Rosie Project: A Novel","short_title":"The Rosie Project","author":"Graeme Simsion","tracking":{"object_type":"document","object_id":224248577,"track":"flattened_recommender","doc_uuid":"gKa3wcwpichKfAhBGLijEo6+Vfk="},"url":"https://www.scribd.com/book/224248577/The-Rosie-Project-A-Novel"},"224252178":{"type":"book","id":224252178,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224252178/108x144/68dbc1000d/1537863398?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224252178/216x288/57a65a5750/1537863398?v=1","title":"Brooklyn: A Novel","short_title":"Brooklyn","author":"Colm Toibin","tracking":{"object_type":"document","object_id":224252178,"track":"flattened_recommender","doc_uuid":"Y9nao6j8QuiGwOx3QbIwSz51gGE="},"url":"https://www.scribd.com/book/224252178/Brooklyn-A-Novel"},"224258670":{"type":"book","id":224258670,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224258670/108x144/3c7a87a449/1537875000?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224258670/216x288/ef3c1ca84d/1537875000?v=1","title":"The Prize: The Epic Quest for Oil, Money & Power","short_title":"The Prize","author":"Daniel Yergin","tracking":{"object_type":"document","object_id":224258670,"track":"flattened_recommender","doc_uuid":"/rfuA4zewFTDe7VYXFLM5yL6hss="},"url":"https://www.scribd.com/book/224258670/The-Prize-The-Epic-Quest-for-Oil-Money-Power"},"224266633":{"type":"book","id":224266633,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224266633/108x144/d0de7b5bf4/1537874992?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224266633/216x288/a40600a76d/1537874992?v=1","title":"The Perks of Being a Wallflower","short_title":"The Perks of Being a Wallflower","author":"Stephen Chbosky","tracking":{"object_type":"document","object_id":224266633,"track":"flattened_recommender","doc_uuid":"pStI6b7Z+ZLTpu4AR470yXMFY8Q="},"url":"https://www.scribd.com/book/224266633/The-Perks-of-Being-a-Wallflower"},"224270540":{"type":"book","id":224270540,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224270540/108x144/f484685ce1/1537873985?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224270540/216x288/f0d4e09ce0/1537873985?v=1","title":"The Master","short_title":"The Master","author":"Colm Toibin","tracking":{"object_type":"document","object_id":224270540,"track":"flattened_recommender","doc_uuid":"FLKjR7YV1z1GUVb2HdzFYH8wrvk="},"url":"https://www.scribd.com/book/224270540/The-Master"},"224285255":{"type":"book","id":224285255,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224285255/108x144/144bc668f6/1537943841?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224285255/216x288/9dbee53a6c/1537943841?v=1","title":"The Flamethrowers: A Novel","short_title":"The Flamethrowers","author":"Rachel Kushner","tracking":{"object_type":"document","object_id":224285255,"track":"flattened_recommender","doc_uuid":"HYRamj1O9g1W6Q/13pJXVXG2udM="},"url":"https://www.scribd.com/book/224285255/The-Flamethrowers-A-Novel"},"224306619":{"type":"book","id":224306619,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224306619/108x144/7eeca5a1bc/1537871531?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224306619/216x288/4a8f75444a/1537871531?v=1","title":"The Light Between Oceans: A Novel","short_title":"The Light Between Oceans","author":"M.L. Stedman","tracking":{"object_type":"document","object_id":224306619,"track":"flattened_recommender","doc_uuid":"PsqaeG3mIGFnAdLBDejYM4fiXeQ="},"url":"https://www.scribd.com/book/224306619/The-Light-Between-Oceans-A-Novel"},"224326250":{"type":"book","id":224326250,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224326250/108x144/b659f5fb6a/1537867743?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224326250/216x288/900e8864ca/1537867743?v=1","title":"Steve Jobs","short_title":"Steve Jobs","author":"Walter Isaacson","tracking":{"object_type":"document","object_id":224326250,"track":"flattened_recommender","doc_uuid":"OsTQydzYwRVYX7TLCC5oojr0fOg="},"url":"https://www.scribd.com/book/224326250/Steve-Jobs"},"224349281":{"type":"book","id":224349281,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224349281/108x144/4df0918cea/1537876130?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224349281/216x288/befa0c6317/1537876130?v=1","title":"How To Win Friends and Influence People","short_title":"How To Win Friends and Influence People","author":"Dale Carnegie","tracking":{"object_type":"document","object_id":224349281,"track":"flattened_recommender","doc_uuid":"bedkrepiIaY355+AIlYhHxnI4Q4="},"url":"https://www.scribd.com/book/224349281/How-To-Win-Friends-and-Influence-People"},"224355300":{"type":"book","id":224355300,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224355300/108x144/0f2130a60a/1537864013?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224355300/216x288/9b9b19254a/1537864013?v=1","title":"Grand Pursuit: The Story of Economic Genius","short_title":"Grand Pursuit","author":"Sylvia Nasar","tracking":{"object_type":"document","object_id":224355300,"track":"flattened_recommender","doc_uuid":"ACmKWeAI2wwpgWREd1lLfKCQg8M="},"url":"https://www.scribd.com/book/224355300/Grand-Pursuit-The-Story-of-Economic-Genius"},"224369806":{"type":"book","id":224369806,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224369806/108x144/6fb23377a8/1537864222?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224369806/216x288/b1d476d0fb/1537864222?v=1","title":"The Emperor of All Maladies: A Biography of Cancer","short_title":"The Emperor of All Maladies","author":"Siddhartha Mukherjee","tracking":{"object_type":"document","object_id":224369806,"track":"flattened_recommender","doc_uuid":"C8ChOcsCQ+a0IYpcdPIDi3ILFFQ="},"url":"https://www.scribd.com/book/224369806/The-Emperor-of-All-Maladies-A-Biography-of-Cancer"},"224410295":{"type":"book","id":224410295,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224410295/108x144/514b1bea0b/1537863981?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224410295/216x288/f7c9469e6c/1537863981?v=1","title":"Team of Rivals: The Political Genius of Abraham Lincoln","short_title":"Team of Rivals","author":"Doris Kearns Goodwin","tracking":{"object_type":"document","object_id":224410295,"track":"flattened_recommender","doc_uuid":"TIxyWBvQ+YJbhQT63EY2XfT5Haw="},"url":"https://www.scribd.com/book/224410295/Team-of-Rivals-The-Political-Genius-of-Abraham-Lincoln"},"224419023":{"type":"book","id":224419023,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224419023/108x144/48b209bbb5/1537864054?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224419023/216x288/39263c2334/1537864054?v=1","title":"John Adams","short_title":"John Adams","author":"David McCullough","tracking":{"object_type":"document","object_id":224419023,"track":"flattened_recommender","doc_uuid":"8mGFUxLikLGWDAbGiwWUfWKclXU="},"url":"https://www.scribd.com/book/224419023/John-Adams"},"224421552":{"type":"book","id":224421552,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224421552/108x144/2f2c02f5eb/1537864411?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224421552/216x288/65ac725c07/1537864411?v=1","title":"Good in Bed","short_title":"Good in Bed","author":"Jennifer Weiner","tracking":{"object_type":"document","object_id":224421552,"track":"flattened_recommender","doc_uuid":"LieUnTJxZLKqXvrqqxnf0lhYHmw="},"url":"https://www.scribd.com/book/224421552/Good-in-Bed"},"224426877":{"type":"book","id":224426877,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224426877/108x144/f22cf865fe/1537947949?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224426877/216x288/a73f25e252/1537947949?v=1","title":"Angela's Ashes: A Memoir","short_title":"Angela's Ashes","author":"Frank McCourt","tracking":{"object_type":"document","object_id":224426877,"track":"flattened_recommender","doc_uuid":"daJMF80RmlpDxBBzftbOcwmjgrc="},"url":"https://www.scribd.com/book/224426877/Angela-s-Ashes-A-Memoir"},"225916486":{"type":"book","id":225916486,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/225916486/108x144/241cf75eb3/1537867248?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/225916486/216x288/a042fe186a/1537867248?v=1","title":"A Heartbreaking Work Of Staggering Genius: A Memoir Based on a True Story","short_title":"A Heartbreaking Work Of Staggering Genius","author":"Dave Eggers","tracking":{"object_type":"document","object_id":225916486,"track":"flattened_recommender","doc_uuid":"PSdZIpVqIykr2XRLuZzC5ZiT3bQ="},"url":"https://www.scribd.com/book/225916486/A-Heartbreaking-Work-Of-Staggering-Genius-A-Memoir-Based-on-a-True-Story"},"231689346":{"type":"book","id":231689346,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/231689346/108x144/7e5fbbde4a/1537944008?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/231689346/216x288/b7fe80231f/1537944008?v=1","title":"The Blazing World: A Novel","short_title":"The Blazing World","author":"Siri Hustvedt","tracking":{"object_type":"document","object_id":231689346,"track":"flattened_recommender","doc_uuid":"nYUZs8bDv9Rmhq11o8XKYmMSO/Q="},"url":"https://www.scribd.com/book/231689346/The-Blazing-World-A-Novel"},"232425556":{"type":"document","id":232425556,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/232425556/108x144/9cbbaf607a/1435998887?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/232425556/216x288/4a034afea6/1435998887?v=1","title":"Commit Batch","short_title":"Commit Batch","author":"mistieger","tracking":{"object_type":"document","object_id":232425556,"track":"flattened_recommender","doc_uuid":"p6m3PH0dqwZCUpTy16TbCThIF2k="},"url":"https://www.scribd.com/document/232425556/Commit-Batch"},"234028503":{"type":"book","id":234028503,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/234028503/108x144/2c4440aa6c/1537869518?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/234028503/216x288/cfe54b8013/1537869518?v=1","title":"Bad Feminist: Essays","short_title":"Bad Feminist","author":"Roxane Gay","tracking":{"object_type":"document","object_id":234028503,"track":"flattened_recommender","doc_uuid":"J9mouJvTllrxRZL33VCKB9utEUc="},"url":"https://www.scribd.com/book/234028503/Bad-Feminist-Essays"},"235411767":{"type":"book","id":235411767,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/235411767/108x144/b2ad7aa7d5/1537864199?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/235411767/216x288/1740216c8c/1537864199?v=1","title":"A Man Called Ove: A Novel","short_title":"A Man Called Ove","author":"Fredrik Backman","tracking":{"object_type":"document","object_id":235411767,"track":"flattened_recommender","doc_uuid":"YDD5D6IFWJVoCpkXmNKT5gdbv/w="},"url":"https://www.scribd.com/book/235411767/A-Man-Called-Ove-A-Novel"},"235583696":{"type":"book","id":235583696,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/235583696/108x144/a9f15763be/1537870877?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/235583696/216x288/7c5ab0af0f/1537870877?v=1","title":"We Are Not Ourselves: A Novel","short_title":"We Are Not Ourselves","author":"Matthew Thomas","tracking":{"object_type":"document","object_id":235583696,"track":"flattened_recommender","doc_uuid":"k39HZtY78kUgmjjxQk7cjrNf+y4="},"url":"https://www.scribd.com/book/235583696/We-Are-Not-Ourselves-A-Novel"},"238704340":{"type":"book","id":238704340,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/238704340/108x144/2fd0be1590/1537866560?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/238704340/216x288/191539db56/1537866560?v=1","title":"This Changes Everything: Capitalism vs. The Climate","short_title":"This Changes Everything","author":"Naomi Klein","tracking":{"object_type":"document","object_id":238704340,"track":"flattened_recommender","doc_uuid":"E7jKzPNPMC4cy/CKjfauKzzi2lY="},"url":"https://www.scribd.com/book/238704340/This-Changes-Everything-Capitalism-vs-The-Climate"},"239488191":{"type":"book","id":239488191,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/239488191/108x144/a9a21bdc0e/1537947566?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/239488191/216x288/73448c1779/1537947566?v=1","title":"The Innovators: How a Group of Hackers, Geniuses, and Geeks Created the Digital Revolution","short_title":"The Innovators","author":"Walter Isaacson","tracking":{"object_type":"document","object_id":239488191,"track":"flattened_recommender","doc_uuid":"4wixtPJlo91TQsBC8VbtWnOtVRI="},"url":"https://www.scribd.com/book/239488191/The-Innovators-How-a-Group-of-Hackers-Geniuses-and-Geeks-Created-the-Digital-Revolution"},"239588474":{"type":"book","id":239588474,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/239588474/108x144/149fb5e6af/1537924657?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/239588474/216x288/15f36354f8/1537924657?v=1","title":"Rise of ISIS: A Threat We Can't Ignore","short_title":"Rise of ISIS","author":"Jay Sekulow","tracking":{"object_type":"document","object_id":239588474,"track":"flattened_recommender","doc_uuid":"vwNwcTf9llhRURipLt4dGe26n9k="},"url":"https://www.scribd.com/book/239588474/Rise-of-ISIS-A-Threat-We-Can-t-Ignore"},"244157917":{"type":"book","id":244157917,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/244157917/108x144/c55ae5929d/1537862008?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/244157917/216x288/c42f4ff9aa/1537862008?v=1","title":"Yes Please","short_title":"Yes Please","author":"Amy Poehler","tracking":{"object_type":"document","object_id":244157917,"track":"flattened_recommender","doc_uuid":"dVQp23UuRr8MdBNZRMPiM/LP2Ms="},"url":"https://www.scribd.com/book/244157917/Yes-Please"},"246897514":{"type":"book","id":246897514,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/246897514/108x144/60f21686b1/1537872475?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/246897514/216x288/4b640ccfe4/1537872475?v=1","title":"The Wallcreeper","short_title":"The Wallcreeper","author":"Nell Zink","tracking":{"object_type":"document","object_id":246897514,"track":"flattened_recommender","doc_uuid":"CL5OpBBcuJvq9dLHZR/oAh6KkuY="},"url":"https://www.scribd.com/book/246897514/The-Wallcreeper"},"249308236":{"type":"book","id":249308236,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/249308236/108x144/0b356a7d6a/1537861777?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249308236/216x288/cbef455d67/1537861777?v=1","title":"Interpreter of Maladies","short_title":"Interpreter of Maladies","author":"Jhumpa Lahiri","tracking":{"object_type":"document","object_id":249308236,"track":"flattened_recommender","doc_uuid":"+R+xWgJgrJqGK2tH2e7GY36UmeY="},"url":"https://www.scribd.com/book/249308236/Interpreter-of-Maladies"},"249308781":{"type":"book","id":249308781,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/249308781/108x144/8ccbad3c4a/1537868572?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249308781/216x288/b0591f1a45/1537868572?v=1","title":"Life of Pi","short_title":"Life of Pi","author":"Yann Martel","tracking":{"object_type":"document","object_id":249308781,"track":"flattened_recommender","doc_uuid":"mg6XK696V5F6Q7D690+q0jEF7rU="},"url":"https://www.scribd.com/book/249308781/Life-of-Pi"},"249309502":{"type":"book","id":249309502,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249309502/108x144/06f5527c5d/1537862881?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249309502/216x288/ec3bf7c24b/1537862881?v=1","title":"Extremely Loud and Incredibly Close: A Novel","short_title":"Extremely Loud and Incredibly Close","author":"Jonathan Safran Foer","tracking":{"object_type":"document","object_id":249309502,"track":"flattened_recommender","doc_uuid":"ezEULXkPr+iAJJ4JnskqjUJRkIo="},"url":"https://www.scribd.com/book/249309502/Extremely-Loud-and-Incredibly-Close-A-Novel"},"249751150":{"type":"document","id":249751150,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/249751150/108x144/a1cb757d5f/1427885678?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/249751150/216x288/00f4859afe/1427885678?v=1","title":"Dynamisez Vos Sites Web Avec Javascript","short_title":"Dynamisez Vos Sites Web Avec Javascript","author":"mahcimoi","tracking":{"object_type":"document","object_id":249751150,"track":"flattened_recommender","doc_uuid":"QkLiffANm38FHC2xodEc9nAbZK4="},"url":"https://www.scribd.com/document/249751150/Dynamisez-Vos-Sites-Web-Avec-Javascript"},"250006950":{"type":"book","id":250006950,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/250006950/108x144/2a1edbdeca/1537862176?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/250006950/216x288/139a0bb438/1537862176?v=1","title":"The First Bad Man: A Novel","short_title":"The First Bad Man","author":"Miranda July","tracking":{"object_type":"document","object_id":250006950,"track":"flattened_recommender","doc_uuid":"+NmU3FqHHWFDfRL5AP7upZBn4PA="},"url":"https://www.scribd.com/book/250006950/The-First-Bad-Man-A-Novel"},"252971013":{"type":"document","id":252971013,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/252971013/108x144/54e9f4c7a2/1446647753?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/252971013/216x288/9c4dfb8e7d/1446647753?v=1","title":"Premiers Pas Dans Le DOM","short_title":"Premiers Pas Dans Le DOM","author":"Kawtar L Azaar","tracking":{"object_type":"document","object_id":252971013,"track":"flattened_recommender","doc_uuid":"Juv7onaGuSNotuYblush2nvmcWk="},"url":"https://www.scribd.com/document/252971013/Premiers-Pas-Dans-Le-DOM"},"253264900":{"type":"book","id":253264900,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/253264900/108x144/dcda7770b5/1537870679?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/253264900/216x288/ca2dc9eb25/1537870679?v=1","title":"Sapiens: A Brief History of Humankind","short_title":"Sapiens","author":"Yuval Noah Harari","tracking":{"object_type":"document","object_id":253264900,"track":"flattened_recommender","doc_uuid":"hWC52Chy0JFKe7qW+lBJpjYGe2o="},"url":"https://www.scribd.com/book/253264900/Sapiens-A-Brief-History-of-Humankind"},"254039238":{"type":"book","id":254039238,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/254039238/108x144/a8c6c5e065/1537867235?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/254039238/216x288/0e4e5ae0d4/1537867235?v=1","title":"Leaving Berlin: A Novel","short_title":"Leaving Berlin","author":"Joseph Kanon","tracking":{"object_type":"document","object_id":254039238,"track":"flattened_recommender","doc_uuid":"h5pqPE00/EBIsvYCdl3Fitpx/4s="},"url":"https://www.scribd.com/book/254039238/Leaving-Berlin-A-Novel"},"259767311":{"type":"document","id":259767311,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/259767311/108x144/8866d421af/1427194626?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/259767311/216x288/9d930bd567/1427194626?v=1","title":"Slides Javascript Fr","short_title":"Slides Javascript Fr","author":"a.rharrab","tracking":{"object_type":"document","object_id":259767311,"track":"flattened_recommender","doc_uuid":"4ynCuA6I4/6d+eNab++fSVveiwE="},"url":"https://www.scribd.com/document/259767311/Slides-Javascript-Fr"},"262025564":{"type":"document","id":262025564,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/262025564/108x144/b65c2195b1/1429166982?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/262025564/216x288/8c62ef3a35/1429166982?v=1","title":"CYJSCP-formation-javascript-developper-en-html-dynamique.pdf","short_title":"CYJSCP-formation-javascript-developper-en-html-dynamique.pdf","author":"CertyouFormation","tracking":{"object_type":"document","object_id":262025564,"track":"flattened_recommender","doc_uuid":"fCh3K7p0U0QzZL8/LqXS6efpzcA="},"url":"https://www.scribd.com/document/262025564/CYJSCP-formation-javascript-developper-en-html-dynamique-pdf"},"263504218":{"type":"book","id":263504218,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/263504218/108x144/986fa89e8b/1537947303?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/263504218/216x288/c40eb7e9a8/1537947303?v=1","title":"Elon Musk: Tesla, SpaceX, and the Quest for a Fantastic Future","short_title":"Elon Musk","author":"Ashlee Vance","tracking":{"object_type":"document","object_id":263504218,"track":"flattened_recommender","doc_uuid":"IHJ0cHdRb5F79pjF2ZZ32FzK0bk="},"url":"https://www.scribd.com/book/263504218/Elon-Musk-Tesla-SpaceX-and-the-Quest-for-a-Fantastic-Future"},"273440534":{"type":"book","id":273440534,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/273440534/108x144/b7e49e07d3/1537868592?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/273440534/216x288/aaec1b2b1a/1537868592?v=1","title":"The Incarnations: A Novel","short_title":"The Incarnations","author":"Susan Barker","tracking":{"object_type":"document","object_id":273440534,"track":"flattened_recommender","doc_uuid":"Y6wBucySTRy9TtjrfZ3vq1PHviQ="},"url":"https://www.scribd.com/book/273440534/The-Incarnations-A-Novel"},"273582508":{"type":"book","id":273582508,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/273582508/108x144/fb92cadae3/1537865442?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/273582508/216x288/135562ba06/1537865442?v=1","title":"You Too Can Have a Body Like Mine: A Novel","short_title":"You Too Can Have a Body Like Mine","author":"Alexandra Kleeman","tracking":{"object_type":"document","object_id":273582508,"track":"flattened_recommender","doc_uuid":"G1s4Hp9R0ShPi5ImoDT7FN6+kAE="},"url":"https://www.scribd.com/book/273582508/You-Too-Can-Have-a-Body-Like-Mine-A-Novel"},"282766939":{"type":"book","id":282766939,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/282766939/108x144/1355dd3a71/1537868573?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/282766939/216x288/076d3f356c/1537868573?v=1","title":"Dispatches from Pluto: Lost and Found in the Mississippi Delta","short_title":"Dispatches from Pluto","author":"Richard Grant","tracking":{"object_type":"document","object_id":282766939,"track":"flattened_recommender","doc_uuid":"sszyud7P3vFajNnLPNAPaKvu6ZU="},"url":"https://www.scribd.com/book/282766939/Dispatches-from-Pluto-Lost-and-Found-in-the-Mississippi-Delta"},"293461549":{"type":"book","id":293461549,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/293461549/108x144/07628d60db/1537864863?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/293461549/216x288/8d1185b7ff/1537864863?v=1","title":"The New Confessions of an Economic Hit Man","short_title":"The New Confessions of an Economic Hit Man","author":"John Perkins","tracking":{"object_type":"document","object_id":293461549,"track":"flattened_recommender","doc_uuid":"6mmG3zXaRsG2McmfhV83xcZ5aAU="},"url":"https://www.scribd.com/book/293461549/The-New-Confessions-of-an-Economic-Hit-Man"},"315687691":{"type":"document","id":315687691,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/315687691/108x144/5de8ad8647/1465912775?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/315687691/216x288/08d3ba5a8f/1465912775?v=1","title":"Examen Final","short_title":"Examen Final","author":"Racim","tracking":{"object_type":"document","object_id":315687691,"track":"flattened_recommender","doc_uuid":"Arxlf84LcLSTEzsRkZvcn2H7J2c="},"url":"https://www.scribd.com/document/315687691/Examen-Final"},"326529450":{"type":"document","id":326529450,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/326529450/108x144/16e6491281/1475688339?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/326529450/216x288/21a2d8452a/1475688339?v=1","title":"js-intro","short_title":"js-intro","author":"moustafa","tracking":{"object_type":"document","object_id":326529450,"track":"flattened_recommender","doc_uuid":"RDXYrDnM90T+8rXSOhUNOX5rzMY="},"url":"https://www.scribd.com/document/326529450/js-intro"},"335383271":{"type":"document","id":335383271,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/335383271/108x144/26f5c24972/1483147491?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/335383271/216x288/1a10855a46/1483147491?v=1","title":"Bonnes Pratiques Javascript","short_title":"Bonnes Pratiques Javascript","author":"LAPROSE","tracking":{"object_type":"document","object_id":335383271,"track":"flattened_recommender","doc_uuid":"C9e0vzXPTt5XXtS0qFr/oWSqXZ4="},"url":"https://www.scribd.com/document/335383271/Bonnes-Pratiques-Javascript"},"335886008":{"type":"document","id":335886008,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/335886008/108x144/0984205dc1/1483738629?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/335886008/216x288/a5b814ab0d/1483738629?v=1","title":"Cours HTML","short_title":"Cours HTML","author":"sousou2000","tracking":{"object_type":"document","object_id":335886008,"track":"flattened_recommender","doc_uuid":"Tqb1snfzcy60eaoIzDLlfELtLZM="},"url":"https://www.scribd.com/document/335886008/Cours-HTML"},"337536061":{"type":"book","id":337536061,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/337536061/108x144/8c1b451da6/1537872255?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/337536061/216x288/45d81f5c37/1537872255?v=1","title":"The Sympathizer: A Novel (Pulitzer Prize for Fiction)","short_title":"The Sympathizer","author":"Viet Thanh Nguyen","tracking":{"object_type":"document","object_id":337536061,"track":"flattened_recommender","doc_uuid":"scetCA/VxsNGdY5jXmMocsaUfqU="},"url":"https://www.scribd.com/book/337536061/The-Sympathizer-A-Novel-Pulitzer-Prize-for-Fiction"},"346916719":{"type":"document","id":346916719,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/346916719/108x144/26fc4aae53/1493651290?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/346916719/216x288/4a425296b6/1493651290?v=1","title":"Gramatica de negocios en francés","short_title":"Gramatica de negocios en francés","author":"Andrés Márquez","tracking":{"object_type":"document","object_id":346916719,"track":"flattened_recommender","doc_uuid":"1AsX4UxOuYW0R/1VSqsu+xP6EWs="},"url":"https://www.scribd.com/document/346916719/Gramatica-de-negocios-en-frances"},"360145720":{"type":"document","id":360145720,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/360145720/108x144/13bb9b7537/1507074624?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/360145720/216x288/cf9b1de050/1507074624?v=1","title":"174330239-Correction-TP1-Javascript-3.pdf","short_title":"174330239-Correction-TP1-Javascript-3.pdf","author":"Christian Bernard Adou","tracking":{"object_type":"document","object_id":360145720,"track":"flattened_recommender","doc_uuid":"/GCs6PGsH2K69sJ/vsO7cXzxYS4="},"url":"https://www.scribd.com/document/360145720/174330239-Correction-TP1-Javascript-3-pdf"},"362235317":{"type":"document","id":362235317,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/362235317/108x144/6723ad5cd0/1508633223?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/362235317/216x288/b730e1f214/1508633223?v=1","title":"Corriges Sous Programmes 1","short_title":"Corriges Sous Programmes 1","author":"Marouane Khoukh","tracking":{"object_type":"document","object_id":362235317,"track":"flattened_recommender","doc_uuid":"wL3sj89DZ06Sa/JAUK1hgRzr4tY="},"url":"https://www.scribd.com/document/362235317/Corriges-Sous-Programmes-1"},"376227628":{"type":"document","id":376227628,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/376227628/108x144/35c44fb3e7/1523571518?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/376227628/216x288/e4a9599116/1523571518?v=1","title":"Syntax","short_title":"Syntax","author":"fzfzegeg","tracking":{"object_type":"document","object_id":376227628,"track":"flattened_recommender","doc_uuid":"p8chWKLdDUQhyPLtaCHnvcz0SwU="},"url":"https://www.scribd.com/document/376227628/Syntax"},"376588788":{"type":"document","id":376588788,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/376588788/108x144/ec8fa99ce5/1523970946?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/376588788/216x288/5804f82f17/1523970946?v=1","title":"Exercice Corrigé","short_title":"Exercice Corrigé","author":"Ali Mansouri","tracking":{"object_type":"document","object_id":376588788,"track":"flattened_recommender","doc_uuid":"G4mIpnhfeFVNNrpjtuIbaHgkZV0="},"url":"https://www.scribd.com/document/376588788/Exercice-Corrige"}}},"seo_roadblock_props_path":"/doc-page/seo-roadblock-props/185030","signup_context":null,"toolbar":{"search_path":"/search-4gen?allowed_pages=&auth_token=PWpBLGj1d9tRNZDNuASqxGR4hYg%3D&authenticity_token=NxDNLOFfxpycTwSQTrX5G8r8cLQywvvB7XX2ZFYlDEPoRHVbcnYbp8x1hp573X%2FMZNeNyO2P1vTBaYowIhSyoA%3D%3D&expires=1538552766&wordDocumentId=185030&wordUploadId=185640"},"renewal_nag_props":null}-->

appelle "Tania", et toi?'; on peut mettre aussi une chaîne de caractères entre aopstrophes, dans ce cas les guillemets font partie de la chaîne, mais si on laisse l’apostrophe de « m’appelle » telle que, Javascript croira que la chaîne est ’je m’ et inquera une erreur car il ne comprendra pas ce qui suit. C’est pour cette raison qu’il faut placer un « \ » avant. var tonNom2 = "je m'appelle ###BOT_TEXT###quot;Tania###BOT_TEXT###quot;, et toi?"; on a conservé les guillemets autour

de "Tania", mais en les faisant précéder d’un « \ »
var fichier = "c:\images\image.gif"; lorsqu’on doit utiliser un antislash « \ » dans la

chaîne, il faut en mettre 2.

Les tableaux
Les tableaux sont des séries de données, généralement du même type (booléens, numériques ou chaînes de caractères), indicées de 0 jusqu’à ce qu’on veut. Peut‐on créer un tableau à 2 dimensions ? Non. Du moins pas directement. Il faut créer un tableau de tableaux. Pour créer un tableau, on utilise la fonction new et la donnée Array :
var tableau1 = new Array();  var tableau2 = new Array(10);

Dans le 1er tableau, le nombre d’éléments du tableau n’est pas défini, dans le second il y a 10 éléments. Contrairement au C, les valeurs à stocker dans le tableau ne sont pas définies à l’avance. On peut aussi copier un tableau à partir d’un autre :
var tableau3 = tableau2

C’est une copie "dynamique" : c’est‐à‐dire que si tableau2 est modifié, tableau3 le sera aussi automatiquement.
var tableau4 = eval(tableau2.toSource());

Ici c’est une copie "statique" : après la copie, les modifications ultérieures de tableau2 n’ont plus aucune influence sur tableau4.

On accède aux éléments du tableau de cette manière tableau1[0] ou tableau2[3]. Le premier élément de tableau1 est tableau1[0] et le dernier élément de tableau2 sera tableau[9] et non pas tableau2[10]. On peut donc affecter des valeurs aux tableaux :
tableau1[0] = 15;  tableau1[1] = "javascript";  tableau1[2] = 3.5;

Oui, on peut affecter des valeurs de différents types à un tableau. Ce n’est pas recommandé, car on ne sait plus très bien à quoi correspondent tel ou tel tableau, mais c’est possible. On peut également créer un tableau en lui affectant directement des valeurs :
var jours = new Array("lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi",  "dimanche");

Tableau à 2 dimensions Pour créer un tableau à 2 dimensions (plus de 2, c’est très rare), on crée un simple tableau. Puis on crée un tableau pour chaque élement.
var tableau = new Array();  tableau[0] = new Array("valeur01", "valeur02", ...);  tableau[1] = new Array("valeur11", "valeur12", ...);  etc.

Pour accéder à un élément du tableau à 2 dimensions :
var valeur = tableau[1][1]; // donne "valeur12"

Exemple : le tableau des visites de votre site par mois et par année.
var visites = new Array(12); // pour les 12 mois de l'année  visites[0] = new Array();  // tableau des visites du mois de janvier  visites[1] = new Array();  // tableau des visites du mois de février  visites[0][0] = 1000;  // nombre de visites du mois de janvier pour la  1ère année  visites[0][1] = 1250;  // nombre de visites du mois de janvier pour la  2ème année  visites[1][0] = 900;  // nombre de visites du mois de février pour la  1ère année

Les instructions conditionnelles « if ... else ... », « while »...
Il y en a de 4 sortes : le if et if...else (« si » et « si...sinon ») les boucles l’instruction switch les instructions de continuation ou de rupture

If et if...else
Voici des exemples

si la boîte de texte "Nom" du formulaire "NomFormulaire" est vide, on envoie un message d’alerte
if (document.NomFormulaire.Nom.value == "")  // condition toujours entre ()  alert("Vous avez oublié de donner votre nom");

si le navigateur du visiteur supporte les objets images (Netscape 4+ et Internet Explorer 4+), on appelle la fonction changerImages(), sinon on envoit un message d’alerte
if  (document.images)  changerImage();  else  alert("Votre navigateur ne peut visualiser le changement d'images");

si l’adresse e‐mail saisie dans la boîte de texte "Email" du formulaire "NomFormulaire" en contient pas de "@", on envoit un message d’alerte et on remet le curseur dans la boîte Email. Lorsque if (ou else) contient plusieurs instructions il faut mettre des accolades .
if (document.NomFormulaire.Email.value.indexOf("@") == ­1) {  alert("Votre adresse e­mail n'est pas valide);  document.NomFormulaire.Email.focus();  }

Forme raccourcie Dans certains cas où la condition est relativement simple, on peut utiliser ce raccourci : Cette fonction rajoute un "0" avant un nombre s’il est < 10, utile pour indiquer une date, du style 01/01/2000

function ajoute0si (nombre) {  if (nombre < 10)  var resultat = "0" + nombre;  else  var resultat = nombre;  return resultat;  }

On peut écrire plus simplement :

function ajoute0si (nombre) {  var resultat = (nombre < 10) ? "0" + nombre : nombre;  return resultat;  }

La syntaxe est :
(condition) ? résultat si condition vraie : résultat si condition fausse

Les boucles
Il y a l’instruction « for » (« pour ») et l’instruction « while » (« tant que »)

L’instruction « for » sert lorsqu’on veut parcourir totalement une série comme un tableau, tous les éléments d’un document ou d’un tableau L’instruction « while » sert lorsqu’on parcourt une série mais que l’on veut sortir si l’un des éléments de la série satisfait à une condition. Boucle for Cette boucle parcourt tous les éléments du tableau "tableau" sauf le dernier et a pour effet de supprimer le 1er élément et de déplacer tout le tableau d’un indice
for (i=0;i<tableau.length­1;i++)  tableau[i] = tableau[i+1];

Comme avec "if", s’il y a plusieurs instructions dans la boucle "for", il faut les encadrer par des accolades Boucle for...in Une autre boucle « for » : la boucle « for in ». Elle permet de parcourir les éléments d’un objet. C’est en particulier, la seule façon de parcourir un tableau dont les éléments ne sont pas indicés, mais indiqués par des valeurs alphabétiques. Exemple :
var age = new Array();  age["julie"] = 14;  age["nicolas"] = 15;  for (var i in age)  alert("l'âge de " + i + " est " + age[i]);

Cette boucle, pas souvent utilisée, peut fréquemment remplacer une boucle for (var i=0 ;i<fin ;i++). Boucle while Cette instruction parcourt un tableau "Prenoms" contenant des prénoms classés dans l’ordre alphabétique à la recherche du prénom "Tania" : si elle le trouve la boucle s’arrête
var i = 0;  while  (Prenoms[i] != "Tania") // "!=" veut dire différent de  i++; // "i++" signifie "i = i + 1"

En fait cette boucle peut tourner indéfiniment si le prénom "Tania" n’est pas trouvé ; il faut écrire :
var i = 0;  while  ((Prenoms[i] != "Tania") && (i < Prenoms.length))  i++;

Noter le "&&" qui signifie ET dans une condition Noter aussi les doubles () On peut écrire encore plus simplement :
var i = 0;  while  ((Prenoms[i] != "Tania") && (i++ < Prenoms.length))

car "i" est incrémenté (augmenté de 1) après la condition Boucle do...while Il existe aussi l’instruction « do ... while », qui est similaire à « while », mais on teste la condition à la fin de la boucle, au lieu de la tester au début. Exemple précédent :
var i = ­1;  do {  i++;  }  while  ((Prenoms[i] != "Tania") && (i < Prenoms.length));

Attention les boucles sont dangereuses ! Si, d’une manière ou d’une autre, votre boucle risque de boucler sans fin, vous allez planter votre machine et éventuellement celle de vos visiteurs.

L’instruction « switch »
Très utile lorsqu’on doit traiter les différentes valeurs d’une même donnée. Exemple : Cette fonction effectue la conversion en francs les valeurs de conversion ne sont pas garanties !
function conversion (somme, monnaie) {  if (monnaie == "euros")  somme *= 6.57;  else if (monnaie == "dollars")  somme *= 6.80;  else if (monnaie == "marks")  somme *= 3.35;  else if (monnaie == "livres")  somme *= 9.50;  else;  return somme;  }

Utilisation de "switch" :
function conversion (somme, monnaie) {  switch (monnaie) {  case "euros" :  somme *= 6.57;  break;  case "dollars" : somme *= 6.80;  break;  case "marks" :  somme *= 3.35;  break;  case "livres" :  somme *= 9.50;  break;  default :  somme = somme;  }  return somme;  }

La forme avec switch n’est pas nécessairement plus courte, mais elle est plus claire. La partie "default" sert lorsqu’aucune valeur ne correspond aux valeurs précédentes : elle est facultative. L’instruction break à la fin de chaque case est indispensable. Mais on peut l’omettre dans certains cas. Voici un exemple, qui indique comment accéder à un objet identifié par son id en fonction du navigateur :
function accesObjet(id, nav) {  switch (nav) {  case "nn4" : var obj = document.layers[id]; break;  case "ie4" : var obj = document.all[id]; break;  case "gecko" :  case "ie6" : var obj = document.getElementById(id);  }  }

Si le navigateur est "nn4", on exécute le premier case, si c’est "ie4" on exécute le second. Si c’est "gecko", comme on n’a pas de break, on passe au 4e case et on l’exécute. Si c’est "ie6" on exécute directement le 4e case. Notez qu’on n’a pas besoin de break au dernier case.

Les instructions de continuation et de rupture
break L’instruction break permet de sortir d’une boucle. On vient de la voir dans l’instruction switch. Voici un exemple d’une boucle de recherche d’un nom dans un tableau de noms :
var listeNoms = {"Marie", "Nicolas", "Gwenaël", "Pierre", "Julie"};  var continuer = true;  var i = 0;  while (continuer) {  if (nom == listeNoms[i]) continuer = false;  else if (i < listeNoms.length ­1) i++;  else continuer = false;  }  if (i < listeNoms.length) var trouve = true;  else var trouve = false;

et en utilisant "break" :
var i = 0;  while (i < listeNoms.length) {  if (nom == listeNoms[i]) break;  else i++;  }  if (i < listeNoms.length) var trouve = true;  else var trouve = false;

Si le nom est égal à listeNoms[i], l’instruction break permet de sortir de la boucle. L’utilisation de break permet un code plus succinct et plus rapide, car on économise la variable "continuer" et le test de cette variable à chaque boucle.

Notez que la numérotation d’un tableau commence à 0, et que le dernier élément vaut 4 ici, alors que listeNoms.length vaut 5 (5 éléments). continue L’instruction continue retourne directement au début de la prochaine boucle. Son utilisation est plus rare. Elle a l’effet inverse de break. Comme exemple, on va reprendre notre liste de noms et ajouter "Jean‐" seulement devant "Pierre".
var i = 0;  for (i=0;i<listeNoms.length;i++) {  if (listeNoms[i] != "Pierre") continue;  listeNoms[i] = "Jean­" + listeNoms[i];  } 

continue permet de retourner directement à la boucle suivante, sans exécuter l’instruction qui suit.

return l’instruction return, dans une fonction : permet de sortir (prématurément ou pas) de la fonction Voici le même exemple que précédemment, dans une fonction :
var listeNoms = {"Marie", "Nicolas", "Gwenaël", "Pierre", "Julie"};  function recherche(nom) {  var i = 0;  while (true) {  if (nom == listeNoms[i]) return true;  else i++;  }  return false;  }

Le premier return sort directement de la fonction, en retournant la constante true (vrai). Le second return retourne la constante false (faux), puisqu’on n’a pas trouvé l’argument « nom » dans la boucle while

Portée des variables en Javascript
Une variable javascript peut avoir une portée globale, elle est alors disponible dans la page en cours, ou une portée locale, elle n’est disponible que dans la fonction qui l’a déclarée. Voici un petit script où on trouve 2 déclarations d’une variable x :
<script language="Javascript">  <!­­  var x = 10; // variable globale  function increment(argument) {  // variable locale redéfinie  var x = argument + 1;

return x;  }  x = increment(x); // variable globale  // ­­>  </script>

L’identificateur x représente en fait 2 variables différentes : Une variable globale qui vaut 10 au début du script et vaut 11 à la fin, Une variable locale dans la fonction increment qui vaut argument + 1. C’est une variable locale, car elle a été redéfinie par le mot‐clé var. L’instruction x = increment(x) ; commence par affecter la valeur de la variable globale x (10) à l’argument de la fonction. Puis cet argument est augmenté de 1 pour être affecté à la variable locale x, qui vaut donc 11. Cette valeur est retournée par la fonction et affectée à la variable globale x. Dans cette autre version, on travaille directement avec la variable globale :
<script language="Javascript">  <!­­  var x = 10; // variable globale  function increment(argument) {  // variable globale  x = argument + 1;  }  increment(x);  // ­­>  </script>

On n’a pas de redéfinition de la variable x dans increment, donc il s’agit de la variable globale. On n’a pas besoin de return, puisque x est modifié "globalement" (pour tout le script). Et donc faire simplement increment(x) ; suffit pour modifier la variable.

Variables globales
Ce sont des variables définies dans le corps du script, en général tout au début. En dehors de toute fonction. On peut ensuite les utiliser dans tout le script, même à l’intérieur des fonctions. Leur valeur évolue au cours du déroulement du script.

<html>  <head>  <script language="Javascript">  <!­­  var x = 10; // variable globale  x = x + 1;  // ­­>  </script>  </head>  <body>  <script language="Javascript">

<!­­  // cette instruction doit afficher "x = 11"  alert("x = " + x); // toujours notre même variable globale  // ­­>  </script>  </body>  </html>

Ce code montre qu’une variable globale est également valide dans toute la page, même définie à l’intérieur de balises <script> différentes. Evidemment, une fois la page fermée, la variable est perdue.

Variables locales
Elles sont définies dans une fonction. Elles ne sont valables qu’à l’intérieur de cette fonction, elles sont détruites ensuite. Leur valeur n’est plus disponible en dehors. Si une variable, dans une fonction porte le même nom qu’une variable globale et est créée avec var, alors elle est considérée comme une nouvelle variable locale. C’est le cas dans le tout premier exemple. Si une variable dans une fonction porte le même nom qu’une variable globale et n’est pas créée avec var, alors il s’agit toujours de la même variable globale (2e exemple). Contrairement au C, une variable définie au sein d’un bloc (zone de code entre 2 accolades ) n’est pas une variable locale.

Autre exemple
Dans la fonction :
y définie avec var est une variable locale qui n’a rien à voir avec le y défini plus haut. par contre x est toujours la même variable globale définie au début, et x vaut 10 + 10 = 20

Après la fonction : x y vaut toujours 100 vaut maintenant 20

<script language="Javascript">  <!­­  var x = 10; // variable globale  var y = 100; // variable globale  function ajoute10() {  var y = 10; // variable locale  x = x + y; // variable globale x  }  ajoute10();  alert(x);  alert(y); // variable globale  // ­­>  </script>

Généralement, on ne s’amuse pas à redéfinir une variable locale de même nom qu’une variable globale. C’est une source de confusion. Par contre, il est préférable, si possible, d’utiliser des variables locales qui sont détruites après utilisation, plutôt que des variables globales qui restent en mémoire tant que la page est affichée.

Fonctions, arguments et appels de fonction
C’est un élément très important, car il y en a dans pratiquement tout script.

La syntaxe
function une_fonction(argument1, argument2...)  {  // corps de la fonction  }

Une fonction peut ne pas avoir d’arguments, mais on laisse les parenthèses vides. Ceux qui viennent du Basic seront un peu désarçonnés au départ :
sub une_fonction

donne en Javascript (la syntaxe vient de celle du C) :
function une_fonction() {  ....  }

Les arguments
Les arguments, situés dans les parenthèses à la suite du nom de la fonction, permettent au script de transmettre des variables à la fonction. Voici un exemple
// Exemple 1  var nombre = 10;  var carre = 0;  function carre_de (x) {  return x*x;  }  carre = carre_de(nombre);  nombre = carre_de(2);  document.write("carré = " + carre); // donnera "carré = 100"  document.write("nombre = " + nombre); // donnera nombre = 4

Dans cet exemple x est un argument de la fonction carre_de(). On peut appeler cette fonction en utilisant n’importe quelle variable numérique ou un nombre comme carre_de(2). La fonction utilise l’instruction return qui lui permet de retourner une valeur (une fonction ne peut retourner qu’une valeur).
// Exemple 2

var nombre = 10;  var carre = 0;  function carre_de (x) {  x = x*x;  }  carre = carre_de(nombre);  document.write("carré = " + carre); // donnera "carré = 0"

Dans ce 2ème exemple, la fonction fait un calcul interne. Si on écrivait l’instruction alert("x = " + x) ; à l’intérieur de la fonction, on afficherait "x = 100", mais la fonction ne retourne aucune valeur. Comme x n’est pas défini à l’extérieur de la fonction, si on écrivait cette instruction à l’extérieur, on aurait une erreur Javascript "x est inconnu".
// Exemple 3  var nombre = 10;  var carre = 0;  function carre_de () {  carre = nombre*nombre;  }  carre_de();  document.write("carré = " + carre); // donnera "carré = 100"

Dans ce 3ème exemple, on utilise ce qu’on appelle une "variable globale". Ce type de variable est définie à l’extérieur de la fonction, mais celle‐ci peut les utiliser et les modifications seront valides pour l’extérieur de cette fonction. Une fonction peut avoir comme arguments des variables booléennes, numériques, chaînes de caractère, des tableaux, des objets.

Valeur de retour
Une fonction peut retourner une valeur. Elle utilise pour cela le mot‐clé return, comme dans l’exemple 1. La fonction peut donc être appelée ainsi :
var valeur = fonction(arguments);

où valeur prend la valeur de retour de la fonction. Une valeur de retour peut être évidemment une chaîne de caractère, un nombre, mais aussi un tableau, ou un objet.
function jour_daujoudhui() {  return new Date();  }  var jour = jour_daujoudhui();  jour sera un objet Date() à la date du jour.

Retourner plus d’une valeur

Malheureusement une fonction ne peut retourner qu’une seule valeur. C’es parfois génant, si par exemple on veut retourner des coordonnées x et y. Il suffit alors de retourner un tableau ou un objet. Exemple :

function lireCoordonnees() {  var xcoord = 0;  var ycoord = 100;  var coords = new Array(xcoord, ycoord);  return coords;  }  var position = lireCoordonnees();  var x = position[0];  var y = position[1];

La fonction lireCoordonnees retourne un tableau. Voici le même exemple en retournant un objet :

function lireCoordonnees() {  var xcoord = 0;  var ycoord = 100;  var coords = {x:xcoord, y:ycoord);  return coords;  }  var position = lireCoordonnees();  var x = position.x;  var y = position.y;

L’instruction {x:xcoord, y:ycoord) est un façon rapide de créer un objet en Javascript (on utilise des accolades et non des parenthèses).

En Javascript les arguments sont passés par valeur
... et non par référence (pour ceux qui viennent du C ou du C++). Ca veut dire si un argument est modifié au sein de la fonction, cette modification n’a aucun effet à l’extérieur de celle‐ ci. C’est la valeur de la variable qui est transmise à la fonction, mais pas la variable elle‐ même. Exemple :
var nombre = 2;  document.write("Avant la fonction produit() nombre = " + nombre + "<br>");  function produit (nombre) {  nombre = nombre * 10;  document.write("Dans la fonction produit() nombre = " + nombre + "<br>");  return nombre;  }  document.write("Après la fonction produit() nombre = " + nombre");

Ca donne :

Avant la fonction produit() nombre = 2  Dans la fonction produit() nombre = 20  Après la fonction produit() nombre = 2

Si vous voulez modifier par fonction une variable : soit vous retournez une valeur, comme le 1er exemple carre = carre_de(nombre); soit il faut en faire une variable globale

Mais vous ne pouvez retourner qu’une seule variable Les objets Il en va autrement pour les objets et pour les tableaux en particulier, dont les modifications au sein d’une fonction sont conservées en dehors de celle‐ci.
var tab = Array(0, 1, 2);  function incremente(tableau) {  for (var i=0:i<tableau.length;i++) tableau[i]++;  }  incremente(tab);  document.write("tab = " + tab.join());

affichera : tab = {1,2,3}

Nombre variable d’arguments
En Javascript une fonction a un nombre fixe d’arguments. Mais dans certaines situations, on ignore à l’avance combien il y en aura. Voici un exemple : Cette fonction déclare les enfants d’un parent : celui‐ci est le 1er argument, les enfants viennent ensuite, mais on ignore combien ils sont. Le but de cette fonction est de créer une "classe" famille, d’où le mot‐clé this 
function famille () {  // nom_de_fonction.arguments est un tableau contenant les arguments de la  fonction  var args = famille.arguments;  this.nombre_enfants = args.length ­ 1; // args.length est le nombre d'arguments  this.parent = args[0]; // le premier argument est le parent  // on crée un tableau où on mettra tous les enfants  this.enfants = new Array();  // une boucle parcourt les arguments contenus dans "args" (à partir  // du second ­ 1 ­ jusqu'au dernier) pour ajouter les enfants au tableau  for (var i=1;i<args.length;i++)  this.enfants[i­1] = args[i];  }  var Martin = new famille("Olivier", "Nicolas", "Gaëlle", "Quentin", "Charlotte",  "Chloé");  var Scholz = new famille("Sabine", "Anja", "Elise");  document.write(Martin.parent + " a " + Martin.nombre.enfants + " enfants");  // donnera : "Olivier a 5 enfants"  document.write(Scholz.parent + " a " + Scholz.nombre.enfants + " enfants");  // donnera : "Sabine a 2 enfants"

document.write("L'ainé de " + Martin.parent + " est " + Martin.enfants[0]);  // donne "L'ainé de Olivier est Nicolas"

Valeur par défaut Pour ceux qui connaissent PHP, Javascript ne permet pas d’affecter une valeur par défaut à un argument. Il faut utiliser le même système du nombre variable d’arguments. Voici un exemple :

<?php  function ajouter($x, $valeur=1) {  $x += $valeur;  return $x;  }  $x = 10;  echo "\$x = " . ajouter($x, 10); // écrit "$x = 20"  echo "\$x = " . ajouter($x);  // écrit "$x = 11"  ?>

Equivalent Javascript :

function ajouter(x) {  if (arguments.length == 2) var valeur = arguments[1];  else var valeur = 1;  x += valeur;  return x;  }  var x = 10;  alert("x = " + ajouter(x, 10)); // affiche "x = 20"  alert("x = " + ajouter(x));  // affiche "x = 11"

Dans la fonction ajouter, si on a 2 arguments, la variable valeur prend la valeur de cet argument, sinon valeur prend la valeur 1 par défaut.

Appels de fonctions
L’appel de fonction se fait comme dans l’exemple :
carre = carre_de(nombre);

ou carre_de(nombre) ; si la fonction ne retourne aucune valeur Une fonction peut en appeler une autre. Mais pour qu’une fonction soit appelée, il faut qu’elle soit définie, c’est‐à‐dire écrite, avant d’être appelée. Ici, la fonction "calculeTVA" appelle la fonction "monetaire"
// cette fonction formatte un nombre au format monétaire  function monetaire (x) {  var cents = Math.round(x*100) ­ Math.floor(x)*100;  if (cents < 10) cents = "0" + cents;  x = Math.floor(x) + "," + cents + " €";  return x;

}  function calculeTVA (somme, tauxTVA) {  return monetaire(somme * tauxTVA);  }

La récursivité
Une fonction peut éventuellement s’appeler elle‐même, ce qui est une exception à ce qui vient d’êtrre écrit... C’est ce qu’on appelle la "récursivité", à manipuler avec précautions. L’utilisation principale de la récursivité est la manipulation de données structurées en "arbre" : très employé dans les recherches. Mais voici l’exemple classique de la factorielle : factorielle(1) = 1, factorielle(2) = 2*1 = 2, factorielle(3) = 3 * factorielle(2) = 3*2 = 6, etc.
function factorielle(n) {  if (n > 1)  return n * factorielle(n­1);  else return 1;  }

Voici comment cela fonctionne, avec factorielle(4) : n instruction
4 appel de factorielle(3); 3 appel de factorielle(2); 2 appel de factorielle(1); 1 return 1; 2 return 2 * factorielle(1); // = 2 * 1 = 2 3 return 3 * factorielle(2); // = 3 * 2 = 6 4 return 4 * factorielle(3); // = 4 * 6 = 24

La fonction appelle successivement factorielle(4) jusqu’à factorielle(1), puis les appels remontent de factorielle(1) à factorielle(4). Souvent la forme récursive est 3 à 4 fois plus courte que la forme non récursive (ce qui n’est pas le cas ici), mais le problème est l’appel de la même fonction en cascade, ce qui bouffe de la mémoire... Si vous avez une grosse fonction récursive ou une fonction récursive qui manipule de gros données, vous risquez un « dépassement de pile » (ou « stack overflow »), car les fonctions (récursives ou pas) sont placées en mémoire dans une pile au moment de leur appel, et retirées de la pile dès qu’elles ont terminé. Et ici dans le cas des factorielles, lorsque n = 1 ; on aurait 4 fonctions factorielle() empilées.

Les fonctions prédéfinies
Javascript possède un certain nombre de fonctions prédéfinies dont le nombre enfle à mesure de la sortie de nouvelles versions du langage. Les fonctions Objet.méthode() Ces fonctions sont généralement liées à un objet (document, fenêtre, formulaire, bouton...) et elles doivent être écrites derrière l’objet. Ex :

document.write('écrit un texte dans la page');

qui est la fonction "write" utilisée uniquement avec l’objet "document" (la page en cours). Du fait que ces fonctions sont liées ou plutôt intégrées à un objet, on les appelle des "méthodes" (terminologie orientée‐objet). Vous trouverez toutes les méthodes Javascript dans la référence du langage sur le site de Netscape (en anglais) : http://developer.netscape.com/docs/manuals/js/client/jsguide/index.htm Les méthodes qui s’écrivent indépendamment d’un objet Quelques méthodes ne sont pas liées à un objet (on devrait dire alors "fonctions") :
escape(), unescape(), eval(), taint() et untaint(). et doivent être écrites seules.

D’autres méthodes sont liées à la fenêtre en cours :
alert(), prompt(), confirm() et peuvent également être écrites seules : alert("ce message est affiché sur la fenêtre; cliquez OK pour le refermer");

Les méthodes de l’objet Math Enfin, une série de méthodes est liée à l’objet Math qui n’est pas un objet "palpable" comme une fenêtre ou un bouton. Ce sont toutes les méthodes de calcul :
Math.sin(), Math.cos(), Math.floor(), Math.round()....

Cet objet Math possède aussi des propriétés, par exemple Math.PI qui vaut 3.14159...

Créer ses propres objets en Javascript
Javascript met à votre disposition une panoplie d’objets qui sont, en fait, basés sur les constituants d’une page HTML : document, image, browser... Vous apprendrez à les connaître. Il est également possible de créer ses propres objets. AMHA, c’est là l’intérêt principal du langage. Et c’est le propos de cette modeste page...

Pourquoi créer des objets ?
Ils permettent de créer des entités indépendantes : modifiables sans pour autant toucher au reste du script réutilisables telles quelles dans d’autres scripts Exemple Je veux gérer des articles que je désire vendre en ligne. Ces articles serviront dans un script permettant au visiteur de trouver de l’information et de visualiser une photo de cet article, et dans un autre script lui permettant de les commander.

Définition de l’objet Voici la fonction qui crée une "classe" d’articles. Le mot réservé "this" indique que les propriétés "nom", "libelle"... appartiennent à l’objet en cours.
function typeArticle(nom, libelle, prix, tauxTVA, image, description) {  this.nom = nom;  this.libelle = libelle;  this.prix = prix;  this.tauxTVA = TauxTVA[tauxTVA];  this.image = "images/" + image + ".gif";  this.descro = "articles/" + description + ".htm";  }

Ajouter des méthodes à l’objet Voici quelques "méthodes" (fonctions liées à un objet) :
function calculeTVA(valeur) {  return valeur * this.tauxTVA;  }  function montantHT(quantite) {  return quantite * this.prix;  }  function montantTTC(quantite) {  var valeur = this.montantHT(quantite);  return valeur + this.calculeTVA(valeur);  }  function description() {  location.href = this.descro;  }  function afficheArticle() {  document.write(this.nom + unescape("%09") + this.libelle +  unescape("%09") + this.prix + " FF");  }

unescape("%09") permet d’écrire un car de tabulation (TAB) On remarquera qu’on peut appeler d’autres fonctions ou méthodes liées à typeArticle en les faisant précéder de "this". De même les propriétés de typeArticle sont aussi précédées de "this". Mais ces fonctions ne sont pas liées à typeArticles. Il faut déclarer ensuite :
typeArticle.prototype.calculeTVA = calculeTVA;  typeArticle.prototype.montantHT = montantHT;  typeArticle.prototype.montantTTC = montantTTC;  typeArticle.prototype.description = description;  typeArticle.prototype.affiche = afficheArticle;

Quelques observations :
Il n’est pas indispensable de donner le même nom que la fonction d’origine Il ne faut pas mettre de () aux fonctions. Voilà, les 5 fonctions sont maintenant réellement des méthodes de typeArticle

Une collection d’objets L’intérêt des objets est de pouvoir traiter des ensembles d’objets. On utilise pour ça un tableau :
var Articles = new Array();  function creeArticle(nom, libelle, prix, tauxTVA, image, description) {  Articles[Articles.length] = new typeArticle(nom, libelle, prix, tauxTVA, image,  description);  }  creeArticle("vélo­enfant", "vélo pour enfant", 1000, 2, "enfant", "enfant");  creeArticle("vélo­dame", "vélo pour dame", 1500, 2, "dame", "dame");  creeArticle("vélo­homme", "vélo pour homme", 1500, 2, "homme", "homme");  function listeArticles() {  var i = 0;  for (i=0;i<Articles.length;i++)  Articles[i].affiche();  }  function factureTTC() {  var i, total = 0;  var args = factureTTC.arguments;  for (i=0;i<args.length;i++)  total += Articles[i].montantTTC(args[i]);  }

La fonction creeArticles :
elle utilise la propriété length de tout tableau = le nombre d’éléments qu’il contient. dans chaque élément de ce tableau Articles, on crée un objet typeArticle Ensuite, on appelle creeArticle pour créer autant d’objets typeArticle qu’on veut. Ces objets sont ajoutés au tableau de l’indice 0 à 2 (ici).

La fonction listeArticles :
parcourt tout le tableau Articles et pour chaque élément affiche les infos de cet article en faisant appel à la méthode "affiche" de typeArticle, puisque chaque élément du tableau est un objet typeArticle.

La fonction factureTTC :
Elle est un peu plus complexe, quoique sur le même principe. Elle s’utilise ainsi :
factureTTC(0, 1)

où les arguments sont les quantités commandées : soit ici 0 vélo homme, 1 vélo femme, 0 vélo enfant. Ca revient au même d’écrire
factureTTC(0, 1, 0)

mais pas d’écrire :
factureTTC(1)

car on penserait que c’est un vélo homme qui a été commandé. On utilise pour cela une fonction à nombre variable d’arguments : voir pour cela le tutoriel précédent.

Intérêt des objets
Espérons que ce rapide survol des objets vous donnera une idée de la technique. L’intérêt de cette technique est de séparer les entités. Tout ce qui concerne les articles est implémenté dans la classe typeArticle et ses méthodes. Ensuite, on peut faire appel aux méthodes de la classe sans s’occuper de ce qu’il y a dedans. Un exemple un peu plus spectaculaire des objets se trouve dans les scripts avec les boules qui rebondissent ou qui entrent en collision : il suffit d’implémenter le comportement de l’objet boule, ensuite on peut créer autant de boules qu’on veut, chacune vit sa propre vie indépendamment des autres et en intéraction avec les autres.

La programmation objet en Javascript
Javascript n’est pas vraiment un langage objet, comme C++ ou Java, et même PHP. Mais les fonctionnalités objets de ce langage permettent de créer des simili‐classes, des méthodes et même d’utiliser l’héritage.

Bref historique de la programmation
Le code au kilomètre... Au début, on écrivait son code ligne par ligne, avec des renvois à un numéro de ligne. Les programmes étaient heureusement courts, mais dès qu’ils se sont allongés, c’était illisible. La programmation fonctionnelle On a eu idée de créer des fonctions, qui permettaient de ne pas écrire plusieurs fois les mêmes sections de code, et surtout de concentrer des actions du programme dans de petites unités. La programmation orientée‐objet (POO) On s’est aperçu que notre mode de pensée fonctionne par objets : un stylo qui permet d’écrire, qui a telle couleur, une feuille de papier qui contient tel texte ou qui est vide... Un objet est constitué de propriétés (la couleur, la marque du stylo) et de méthodes, c’est‐à‐ dire, les fonctions qui décrivent le comportement de l’objet ou les actions qu’on peut lui faire faire (écrire avec un stylo, remplir sa recharge, le ranger...). Les avantages de la POO un code plus clair à lire et et plus facile à modifier réutilisation des classes pour d’autres scripts

Définitions

On va commencer par quelques définitions pour ceux qui ne connaissent rien à la POO (programmation orientée objet). Classe Une classe décrit un catégorie d’objets, comme des personnes ou des voitures... La classe contient des propriétés inhérentes à l’objet décrit, plus des méthodes ou fonctions qui définissent le comportement de l’objet. On a souvent tendance à confondre classe et objet. La classe est un concept, elle décrit l’objet, tandis que l’objet est un élément concret. On verra avec les exemples. En Javascript, la classe n’existe pas en temps que définition. Dans les véritables langages objets, on définit une classe et ses objets ainsi :
class MaClasse {  propriete1;  propriete2;  // constructeur de la classe  function MaClasse() {  ...  }  function methode1() {  ...  }  }

fin de la classe
monObjet = new MaClasse(); // création de l'objet monObjet

On verra comment on fait en Javascript Objet Une fois la classe définie, on peut créer des objets sur le modèle de cette classe. Le langage crée alors une copie de la classe (avec les propriétés et les méthodes) pour chaque objet créé. Propriété Une propriété est une variable qui décrit un aspect de la classe. Ainsi document.title décrit la propriété « titre » du document (la page). Méthode Une méthode n’est rien d’autre qu’une fonction incluse dans une classe. Ainsi document.write() est une méthode de la classe document, alors que new() (qui permet de créer un objet à partir d’une classe) est une fonction du langage, donc rattachée à aucun objet. Constructeur Un constructeur est une méthode spéciale, qui est appelée à chaque fois qu’on crée un objet avec la fonction new().

Javascript n’a pas de type « classe », mais il le remplace par un constructeur. Et c’est le constructeur qui décrit la classe. En fait, constructeur et création de classe est mélangé. Destructeur Un destructeur est une fonction qui permet de supprimer un objet. Il n’est pas possible d’en créer un en Javascript : le destructeur par défaut est appelé par la fonction delete(objet) Héritage Dans certains cas, on peut définir une hiérarchie d’objets, des plus simples aux plus complexes. On a une classe de base, qui contient le minimum de propriétés et de méthodes. Puis des classes dérivées, contenant des propriétés et des méthodes plus spécialisées. Ces classes dérivées peuvent hériter alors des propriétés et des méthodes de la classe de base, sans les redéfinir. Le mécanisme d’héritage de Javascript est assez sommaire, mais il a le mérite d’exister.

Créer une classe et des objets en Javascript
On veut gérer un parc de voitures. Voici comment on peut s’y prendre (les voitures sont définies plutôt sommairement pour l’exemple).

Définition de la classe
Constructeur
function clVoiture(la_marque, le_modele, le_numero, kilometrage, le_prix) {  this.marque = la_marque;  this.modele = le_modele;  this.numero = le_numero;  this.km = kilometrage;  this.prix = le_prix;  }

« marque », « modele », « annee », « km » et « prix » sont les propriétés de la classe clVoiture. L’opérateur « this » indique que ces variables sont des variables rattachées à clVoiture. Les noms des paramètres (« la_marque », etc. sont différents des noms des propriétés, pour montrer que ce sont 2 choses différentes. Mais on aurait pu donner les mêmes noms, Javascript sachant quels sont les paramètres et quelles sont les propriétés :
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  }

On a dit (page précédente) que Javascript n’a pas de type classe. En effet, et cette fonction clVoiture n’est pas une classe, mais le constructeur de la classe clVoiture. Javascript n’a besoin que du constructeur pour créer une classe.

On peut mettre du code dans le constructeur, par exemple, indiquer directement le prix en euros :
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix + " €";  }

Instancier des objets
Voilà un terme qui vous paraît peut‐être étranger... On dit aussi créer une « instance » de classe, c’est‐à‐dire créer un objet réel, à partir de la définition du constructeur. On utilise pour ça l’opérateur new constructeur(params).

Pour créer des voitures :
var voiture1 = new clVoiture("Renault", "Safrane", "1245 AAA 34", 25000, 10000);  var voiture2 = new clVoiture("Opel", "Vectra", "7894 XS 30", 40000, 8000);

Assigner un objet à une variable ou à un argument de fonction C’est facile :
var ma_voiture = voiture1;  ma_voiture.modele; // donnera "Safrane"

Passer un objet en tant qu’argument de fonction, idem :
function modele_de_voiture(voiture) {  return voiture.modele;  }  modele_de_voiture(voiture1); // donnera "Safrane"

Autre façon de créer des objets
Il existe une autre manière de créer des objets, sans passer par un constructeur. C’est plus simple, mais on verra plus tard que c’est plus limité, car on ne peut pas leur rattacher de méthode.
var voiture1 = {marque:"Renault", modele:"Safrane", numero:"1245 AAA 34", km:25000,  prix:10000};  var voiture2 = {marque:"Opel", modele:"Vectra", numero:"7894 XS 30", km:40000,  prix:8000};

Attention : ce sont des accolades { } et non plus des parenthèses ( ).

Accès aux objets et à leurs propriétés
On utilise la « syntaxe à points » comme pour les objets prédéfinis :

document.write(voiture1.numero); // écira "1245 AAA 34"  document.write(voiture2.marque); // écrira "Opel"

Unicité des propriétés
Supposons qu’on veuille aussi définir une classe clClient, avec un numéro, un nom et un numéro de téléphone (la notation clXXX est une notation personnelle conforme à la notation hongroise)
function clClient(numero, nom, tel) {  this.numero = numero;  this.nom = nom;  this.tel = tel;  }  var client1 = new clClient("1245", "Pierre Sachard", "0412345678");  document.write(client1.numero); // donnera "12345"  document.write(voiture1.numero); // donnera "1234 AAA 34"

Javascript ne confond pas les 2 numéros, sachant bien que le 1er appartient à client1 de la classe clClient et le 2e à voiture1 de la classe clVoiture.

Les tableaux d’objets
Le principal intérêt des classes est de créer une structure (la classe ou le constructeur de classe pour Javascript) et d’instancier une série d’objets à partir de cette classe. D’où l’utilisation presque systématique de tableaux d’objets. Voici une façon de faire que j’utilise couramment :
var t_voitures = new Array();  function voiture(marque, modele, numero, km, prix) {  t_voitures[t_voitures.length] = new clVoiture(marque, modele, numero, km, prix);  }  voiture("Renault", "Safrane", "1245 AAA 34", 25000, 10000);  voiture("Opel", "Vectra", "7894 XS 30", 40000, 8000);

On crée ainsi un tableau de 2 objets clVoiture. Et par exemple pour afficher un listing de toutes les voitures :
function listing_voitures() {  for (var i=0;i<t_voitures.length;i++)  document.write(t_voitures[i].affiche());  }

Définir le comportement des ses objets avec des méthodes
En POO, il existe en gros 2 sortes de méthodes, les méthodes privées, qui sont appelées au sein de la classe et inacessibles en dehors et les méthodes d’interface ou publiques, qu’on peut appeler du dehors de la classe. En Javascript tout est public, propriétés et méthodes. Mais pour avoir vraiment des objets indépendants, il est préférable de ne pas accéder directement aux propriétés des objets, et d’utiliser des méthodes pour cela.

Les 3 manières de créer des méthodes
On va créer une méthode qui affiche les infos d’une voiture, pour l’utiliser dans un listing. On va l’appeler simplement affiche(). Définition dans le constructeur
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  this.affiche = clVoiture_affiche;  }  function clVoiture_affiche() {  return this.marque + " " + this.modele + " " + this.numero + " " + this.km + " kms  " + this.prix + " €<br>";  }

Remarques :
dans la définition this.affiche  =  clVoiture_affiche;, on n’indique pas de (), dans la définition de la fonction clVoiture_affiche(), on fait référence aux propriétés de l’objet en utilisant l’opérateur « this », parce que cette fonction est une méthode.

Appel de la méthode
On utilise la même notation que pour les propriétés :
document.write(voiture1.affiche());  //  écrira  "Renault  Safrane  1245  AAA  34  25000  kms 10000 €"

Utilisation de la propriété « prototype »
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  }  function clVoiture_affiche() {  return this.marque + " " + this.modele + " " + this.numero + " " + this.km + " kms  " + this.prix + " €<br>";  }  clVoiture.prototype.affiche = clVoiture_affiche;

Remarques :
le résultat est exactement le même que dans la définition précédente : on crée une méthode affiche(), mais la définition est faite à l’extérieur du constructeur, grâce à la propriété « prototype », dans le prototype : à gauche du signe « = » le nom de la méthode, à droite le nom de la fonction correspondante,

cette façon de faire est la plus souple, car on peut définir le prototype n’importe où dans le script. Définition de la méthode directement dans le prototype
function clVoiture(marque, modele, numero, km, prix) {  this.marque = marque;  this.modele = modele;  this.numero = numero;  this.km = km;  this.prix = prix;  }  clVoiture.prototype.affiche = new function() {  return this.marque + " " + this.modele + " " + this.numero + " " + this.km + " kms  " + this.prix + " €<br>";  }

Remarques :
cette façon de faire est plus simple que la précédente, puisqu’on ne crée plus de fonction
clVoiture_affiche(),

cependant, il faut écrire la méthode avant le code qui l’appellera, contrairement à la façon précédente qui permet plus de liberté à ce niveau‐là, les 2 dernières façons de créer des méthodes sont les seules utitlisables, si on veut ajouter de nouvelles méthodes à des objets Javascript prédédinis. 

String  Bibliothèque de méthodes additionnelles à l’objet String (chaînes de caractères) 

alphanumer ique 
­ Détermine si une chaîne de caractères est alphanumérique  Cette méthode retourne "true" si la chaîne ne contient aucun caractère non alphanumérique,  sinon elle retourne "false". L’espace et les caractères « ’ » (apostrophe) et « ­ » (tiret) sont  acceptés comme caractères alphabétiques.  Syntaxe : chaine.alphanumerique();  Exemple : 
var chaine = "Les 2 fenêtres d'à côté";  if (chaine.alphanumerique()) alert(chaine + "est alphanumérique");  else  alert(chaine + "n'est pas alphanumérique");  var chaîne = "15 €";  if (chaine.alphanumerique()) alert(chaine + "est alphanumérique");  else  alert(chaine + "n'est pas alphanumérique"); 

Donnera "Les 2 fenêtres d’à côté est alphanumérique"  et "15 € n’est pas alphanumérique" 
String.prototype.alphanumerique = function() {  re = /^[\s0­9A­Za­zéèêëàâäçîïôöùûüÉÈÊËÀÂÄÎÏÔÖÙÛÜ","doc_promotions_enabled":false,"static_promo_banner_cta_url":""},"eligible_for_exclusive_trial_roadblock":false,"eligible_for_seo_roadblock":false,"exclusive_free_trial_roadblock_props_path":"/doc-page/exclusive-free-trial-props/185030","flashes":[],"footer_props":{"urls":{"about":"/about","press":"/press","blog":"http://literally.scribd.com/","careers":"/careers","contact":"/contact","plans_landing":"/subscribe","referrals":"/referrals?source=footer","giftcards":"/giftcards","faq":"/faq","accessibility":"/accessibility-policy","faq_paths":{"accounts":"https://support.scribd.com/hc/sections/202246346","announcements":"https://support.scribd.com/hc/sections/202246066","copyright":"https://support.scribd.com/hc/sections/202246086","downloading":"https://support.scribd.com/hc/articles/210135046","publishing":"https://support.scribd.com/hc/sections/202246366","reading":"https://support.scribd.com/hc/sections/202246406","selling":"https://support.scribd.com/hc/sections/202246326","store":"https://support.scribd.com/hc/sections/202246306","status":"https://support.scribd.com/hc/en-us/articles/360001202872","terms":"https://support.scribd.com/hc/sections/202246126","writing":"https://support.scribd.com/hc/sections/202246366","adchoices":"https://support.scribd.com/hc/articles/210129366","paid_features":"https://support.scribd.com/hc/sections/202246306","failed_uploads":"https://support.scribd.com/hc/en-us/articles/210134586-Troubleshooting-uploads-and-conversions","copyright_infringement":"https://support.scribd.com/hc/en-us/articles/210128946-DMCA-copyright-infringement-takedown-notification-policy","end_user_license":"https://support.scribd.com/hc/en-us/articles/210129486","terms_of_use":"https://support.scribd.com/hc/en-us/articles/210129326-General-Terms-of-Use"},"publishers":"/publishers","static_terms":"/terms","static_privacy":"/privacy","copyright":"/copyright","ios_app":"https://itunes.apple.com/us/app/scribd-worlds-largest-online/id542557212?mt=8&uo=4&at=11lGEE","android_app":"https://play.google.com/store/apps/details?id=com.scribd.app.reader0&hl=en","books":"/books","sitemap":"/directory"}},"global_nav_props":{"header_props":{"logo_src":"/images/landing/home2_landing/scribd_logo_horiz_small.svg","root_url":"https://www.scribd.com/","search_term":"","small_logo_src":"/images/logos/scribd_s_logo.png","uploads_url":"/upload-document","search_props":{"redirect_to_app":true,"search_url":"/search","query":"","search_page":false}},"user_menu_props":null,"sidebar_props":{"urls":{"bestsellers":"https://www.scribd.com/bestsellers","home":"https://www.scribd.com/","saved":"/saved","subscribe":"/archive/pmp_checkout?doc=185030&metadata=%7B%22context%22%3A%22pmp%22%2C%22action%22%3A%22start_trial%22%2C%22logged_in%22%3Afalse%2C%22platform%22%3A%22web%22%7D","top_charts":"/bestsellers","upload":"https://www.scribd.com/upload-document"},"categories":{"book":{"icon":"icon-ic_book","icon_filled":"icon-ic_book_fill","url":"https://www.scribd.com/books","name":"Books","type":"book"},"news":{"icon":"icon-ic_articles","icon_filled":"icon-ic_articles_fill","url":"https://www.scribd.com/news","name":"News","type":"news"},"audiobook":{"icon":"icon-ic_audiobook","icon_filled":"icon-ic_audiobook_fill","url":"https://www.scribd.com/audiobooks","name":"Audiobooks","type":"audiobook"},"magazine":{"icon":"icon-ic_magazine","icon_filled":"icon-ic_magazine_fill","url":"https://www.scribd.com/magazines","name":"Magazines","type":"magazine"},"document":{"icon":"icon-ic_document","icon_filled":"icon-ic_document_fill","url":"https://www.scribd.com/docs","name":"Documents","type":"document"},"sheet_music":{"icon":"icon-ic_songbook","icon_filled":"icon-ic_songbook_fill","url":"https://www.scribd.com/sheetmusic","name":"Sheet Music","type":"sheet_music"}},"categories_array":["mixed","book","audiobook","magazine","news","document","sheet_music"],"selected_content_type":"mixed","username":"","search_overlay_props":{"search_input_props":{"focused":false,"keep_suggestions_on_blur":false}}}},"recommenders":{"related_titles_recommender":{"ids":[7812941,249751150,326529450,85935530,17523387,252971013,73613061,315687691,259767311,376588788,262025564,46353536,200797104,335383271,177589783,174330239,346916719,19783144,177093524,376227628,335886008,362235317,360145720,118927359,159731145,232425556,116653620,17523390,25850349,91578139,282766939,263504218,239488191,212863738,244157917,253264900,224369806,225916486,224355300,238704340,224258670,163646054,224419023,182553141,202691564,211302755,239588474,293461549,224410295,224426877,224326250,224349281,234028503,273582508,273440534,224306619,249309502,337536061,182565115,254039238,163580087,224270540,235411767,224252178,224285255,231689346,224248577,250006950,235583696,182546874,249308781,224266633,216442529,182522032,163647832,163603389,246897514,163579056,182560283,163564256,224248520,249308236,224421552],"title_link":null,"title":null,"track_opts":{"compilation_id":"1rY71supWIjwj32Om7MfZSXFvzY=","module_id":"E66l2b/WlNcRNX67D17avek1a94=","widget_name":"right sidebar","track_id":"flattened_recommender"}},"footer_recommenders":{"recommenders":[{"ids":[7812941,249751150,326529450,85935530,17523387,252971013,73613061,315687691,259767311,376588788,262025564,46353536,200797104,335383271,177589783,174330239,346916719,19783144,177093524,376227628,335886008,362235317,360145720,118927359,159731145,232425556,116653620,17523390,25850349,91578139],"title_link":null,"title":"Documents Similar To DocJavaScript","track_opts":{"compilation_id":"1rY71supWIjwj32Om7MfZSXFvzY=","module_id":"VD/7UzgMBfP9GpUEHW6XHXAC2oo=","widget_name":"document_carousel"}}]},"seo_new_docs_recommenders":{"recommenders":[]},"documents":{"7812941":{"type":"document","id":7812941,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/7812941/108x144/c276174880/1358121687?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/7812941/216x288/232a882d6a/1358121687?v=1","title":"Javascript","short_title":"Javascript","author":"delkassas","tracking":{"object_type":"document","object_id":7812941,"track":"flattened_recommender","doc_uuid":"XbMIvnFsmYhIo3hnn4eGex/Dfug="},"url":"https://www.scribd.com/document/7812941/Javascript"},"17523387":{"type":"document","id":17523387,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/17523387/108x144/1da59d6959/1248150860?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/17523387/216x288/0acd997b61/1248150860?v=1","title":"Javascript Demandes","short_title":"Javascript Demandes","author":"youtreau","tracking":{"object_type":"document","object_id":17523387,"track":"flattened_recommender","doc_uuid":"loeyP0dhoivfDgJmiRCij2oTKcs="},"url":"https://www.scribd.com/document/17523387/Javascript-Demandes"},"17523390":{"type":"document","id":17523390,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/17523390/108x144/2cb55b743b/1248150861?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/17523390/216x288/96cf529d4e/1248150861?v=1","title":"stringJS","short_title":"stringJS","author":"youtreau","tracking":{"object_type":"document","object_id":17523390,"track":"flattened_recommender","doc_uuid":"GOYmFqbFZmf2y6Fc3LFKPl9lZFY="},"url":"https://www.scribd.com/document/17523390/stringJS"},"19783144":{"type":"document","id":19783144,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/19783144/108x144/3f65a40055/1399832555?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/19783144/216x288/9986c06f89/1399832555?v=1","title":"Qu’est ce que l’ActionScript 3 ch06","short_title":"Qu’est ce que l’ActionScript 3 ch06","author":"youtreau","tracking":{"object_type":"document","object_id":19783144,"track":"flattened_recommender","doc_uuid":"HOa3bnpRrkfFRL2bjLO+iom/ogM="},"url":"https://www.scribd.com/document/19783144/Qu-est-ce-que-l-ActionScript-3-ch06"},"25850349":{"type":"document","id":25850349,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/25850349/108x144/57209f975d/1417423389?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/25850349/216x288/b0aeb5e878/1417423389?v=1","title":"Cours de Langage C","short_title":"Cours de Langage C","author":"moutched","tracking":{"object_type":"document","object_id":25850349,"track":"flattened_recommender","doc_uuid":"E5sxeAAFdtGPvak+8/tTp/YoW94="},"url":"https://www.scribd.com/doc/25850349/Cours-de-Langage-C"},"46353536":{"type":"document","id":46353536,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/46353536/108x144/6b79e9c3d9/1308825130?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/46353536/216x288/0dc919fb9e/1308825130?v=1","title":"Introduction Jquery","short_title":"Introduction Jquery","author":"Zakaria_Outaro_1293","tracking":{"object_type":"document","object_id":46353536,"track":"flattened_recommender","doc_uuid":"Z5KAtkyBp/8n5MeGCS/JVP1FAag="},"url":"https://www.scribd.com/document/46353536/Introduction-Jquery"},"73613061":{"type":"document","id":73613061,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/73613061/108x144/0de845af48/1381107700?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/73613061/216x288/0d1248044f/1381107700?v=1","title":"Série exercice- Javascript - IDMANSOUR","short_title":"Série exercice- Javascript - IDMANSOUR","author":"Mohamed Dardaz","tracking":{"object_type":"document","object_id":73613061,"track":"flattened_recommender","doc_uuid":"Ene8KJEo0RYCcij74NTH6FrYGr8="},"url":"https://www.scribd.com/document/73613061/Serie-exercice-Javascript-IDMANSOUR"},"85935530":{"type":"document","id":85935530,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/85935530/108x144/847e9b9cf1/1434983994?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/85935530/216x288/980fac86b6/1434983994?v=1","title":"Programmez Javascript","short_title":"Programmez Javascript","author":"salaheddine019","tracking":{"object_type":"document","object_id":85935530,"track":"flattened_recommender","doc_uuid":"DBTYR0VtdL8/FD8CndTsxcp5TFY="},"url":"https://www.scribd.com/document/85935530/Programmez-Javascript"},"91578139":{"type":"document","id":91578139,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/91578139/108x144/4ab3b1d61b/1335562883?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/91578139/216x288/31dcfe8759/1335562883?v=1","title":"Utilisation_de_MPLAB","short_title":"Utilisation_de_MPLAB","author":"Loukay Letaifa","tracking":{"object_type":"document","object_id":91578139,"track":"flattened_recommender","doc_uuid":"9R0NbI1rKHdcZYPuU5fOZskn0eg="},"url":"https://www.scribd.com/document/91578139/Utilisation-de-MPLAB"},"116653620":{"type":"document","id":116653620,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/116653620/108x144/f8fbfcee62/1410035955?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/116653620/216x288/c0c44dca84/1410035955?v=1","title":"structure de controle","short_title":"structure de controle","author":"loesouleymane","tracking":{"object_type":"document","object_id":116653620,"track":"flattened_recommender","doc_uuid":"yOM/Jb9qQrXXHjh97a7Aozw4FtM="},"url":"https://www.scribd.com/document/116653620/structure-de-controle"},"118927359":{"type":"document","id":118927359,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/118927359/108x144/3af7cc5cc3/1383560380?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/118927359/216x288/08a11bf30c/1383560380?v=1","title":"guide de scripts","short_title":"guide de scripts","author":"Désiré Ted","tracking":{"object_type":"document","object_id":118927359,"track":"flattened_recommender","doc_uuid":"2K9D66cRQ3+icN3uTe9iKfb920A="},"url":"https://www.scribd.com/document/118927359/guide-de-scripts"},"159731145":{"type":"document","id":159731145,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/159731145/108x144/abe418de97/1398863088?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/159731145/216x288/7e89f488da/1398863088?v=1","title":"612438 Introduction Aux Algorigrammes","short_title":"612438 Introduction Aux Algorigrammes","author":"Isabelle54","tracking":{"object_type":"document","object_id":159731145,"track":"flattened_recommender","doc_uuid":"5o7Ldvv5lEBOXByy9rBeTIBCmLM="},"url":"https://www.scribd.com/document/159731145/612438-Introduction-Aux-Algorigrammes"},"163564256":{"type":"book","id":163564256,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163564256/108x144/19b813ddea/1537947273?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163564256/216x288/50918b57c9/1537947273?v=1","title":"Beautiful Ruins: A Novel","short_title":"Beautiful Ruins","author":"Jess Walter","tracking":{"object_type":"document","object_id":163564256,"track":"flattened_recommender","doc_uuid":"SUicTV6ND1iz13X9p/1dZkWu7GY="},"url":"https://www.scribd.com/book/163564256/Beautiful-Ruins-A-Novel"},"163579056":{"type":"book","id":163579056,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163579056/108x144/b0cc4a522d/1537866497?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163579056/216x288/cc1bed9752/1537866497?v=1","title":"The Art of Racing in the Rain: A Novel","short_title":"The Art of Racing in the Rain","author":"Garth Stein","tracking":{"object_type":"document","object_id":163579056,"track":"flattened_recommender","doc_uuid":"EzBk59zEFqh500Q648Xmb4ApbFw="},"url":"https://www.scribd.com/book/163579056/The-Art-of-Racing-in-the-Rain-A-Novel"},"163580087":{"type":"book","id":163580087,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163580087/108x144/865888b820/1537867764?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163580087/216x288/a50ec4d378/1537867764?v=1","title":"Bel Canto","short_title":"Bel Canto","author":"Ann Patchett","tracking":{"object_type":"document","object_id":163580087,"track":"flattened_recommender","doc_uuid":"rNNmrN2MErCbpFpE05WWPVAyitM="},"url":"https://www.scribd.com/book/163580087/Bel-Canto"},"163603389":{"type":"book","id":163603389,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163603389/108x144/9281c90791/1537872046?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163603389/216x288/a0de7e7dea/1537872046?v=1","title":"A Prayer for Owen Meany: A Novel","short_title":"A Prayer for Owen Meany","author":"John Irving","tracking":{"object_type":"document","object_id":163603389,"track":"flattened_recommender","doc_uuid":"X7mf5D7aqK0U0hZwx289mB669fs="},"url":"https://www.scribd.com/book/163603389/A-Prayer-for-Owen-Meany-A-Novel"},"163646054":{"type":"book","id":163646054,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/163646054/108x144/c8eb9eae18/1537946605?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163646054/216x288/d6d700f05f/1537946605?v=1","title":"Devil in the Grove: Thurgood Marshall, the Groveland Boys, and the Dawn of a New America","short_title":"Devil in the Grove","author":"Gilbert King","tracking":{"object_type":"document","object_id":163646054,"track":"flattened_recommender","doc_uuid":"CPrnP6bF/vlXtqAK8+O7paTFbn0="},"url":"https://www.scribd.com/book/163646054/Devil-in-the-Grove-Thurgood-Marshall-the-Groveland-Boys-and-the-Dawn-of-a-New-America"},"163647832":{"type":"book","id":163647832,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163647832/108x144/9f4ce0c73a/1537945660?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/163647832/216x288/c8974e0a45/1537945660?v=1","title":"The Cider House Rules","short_title":"The Cider House Rules","author":"John Irving","tracking":{"object_type":"document","object_id":163647832,"track":"flattened_recommender","doc_uuid":"rDMRe9YjGc/K1C9a2zKm31oobTQ="},"url":"https://www.scribd.com/book/163647832/The-Cider-House-Rules"},"174330239":{"type":"document","id":174330239,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/174330239/108x144/b054d28cd7/1381199732?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/174330239/216x288/c020cb9310/1381199732?v=1","title":"Correction TP1 Javascript 3","short_title":"Correction TP1 Javascript 3","author":"Life's Sweet","tracking":{"object_type":"document","object_id":174330239,"track":"flattened_recommender","doc_uuid":"CbpIH3mgXIK3TQu2eGFB0jwhk7o="},"url":"https://www.scribd.com/document/174330239/Correction-TP1-Javascript-3"},"177093524":{"type":"document","id":177093524,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177093524/108x144/3632f43d3a/1382084350?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177093524/216x288/be17df9d02/1382084350?v=1","title":"Xhtml Infobio 2004","short_title":"Xhtml Infobio 2004","author":"kerdaoui2","tracking":{"object_type":"document","object_id":177093524,"track":"flattened_recommender","doc_uuid":"DepJ6LhE+eY7XXn7fv3kmYOh8bA="},"url":"https://www.scribd.com/presentation/177093524/Xhtml-Infobio-2004"},"177589783":{"type":"document","id":177589783,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177589783/108x144/543b693145/1386607819?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/177589783/216x288/345ece59ed/1386607819?v=1","title":"Programmation Avec DELPHI","short_title":"Programmation Avec DELPHI","author":"bendjillali youcef","tracking":{"object_type":"document","object_id":177589783,"track":"flattened_recommender","doc_uuid":"RbVU/oWjCQWVJHZD4k9g2M5+QR0="},"url":"https://www.scribd.com/document/177589783/Programmation-Avec-DELPHI"},"182522032":{"type":"book","id":182522032,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182522032/108x144/671b9a055b/1537946824?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182522032/216x288/ec6eb5c88b/1537946824?v=1","title":"The Bonfire of the Vanities: A Novel","short_title":"The Bonfire of the Vanities","author":"Tom Wolfe","tracking":{"object_type":"document","object_id":182522032,"track":"flattened_recommender","doc_uuid":"v9ygzhUmQ1zx2gJOYd523n0OIwQ="},"url":"https://www.scribd.com/book/182522032/The-Bonfire-of-the-Vanities-A-Novel"},"182546874":{"type":"book","id":182546874,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182546874/108x144/817bab2149/1537867846?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182546874/216x288/a6b6573207/1537867846?v=1","title":"The Love Affairs of Nathaniel P.: A Novel","short_title":"The Love Affairs of Nathaniel P.","author":"Adelle Waldman","tracking":{"object_type":"document","object_id":182546874,"track":"flattened_recommender","doc_uuid":"jODcS03X3w9e1oILxzWsqTTcuh8="},"url":"https://www.scribd.com/book/182546874/The-Love-Affairs-of-Nathaniel-P-A-Novel"},"182553141":{"type":"book","id":182553141,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182553141/108x144/1b40063d80/1537866887?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182553141/216x288/098f7f1651/1537866887?v=1","title":"The World Is Flat 3.0: A Brief History of the Twenty-first Century","short_title":"The World Is Flat 3.0","author":"Thomas L. Friedman","tracking":{"object_type":"document","object_id":182553141,"track":"flattened_recommender","doc_uuid":"6oQFrcr0I0FAqxg770YauAM9nak="},"url":"https://www.scribd.com/book/182553141/The-World-Is-Flat-3-0-A-Brief-History-of-the-Twenty-first-Century"},"182560283":{"type":"book","id":182560283,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182560283/108x144/229169a793/1537864537?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182560283/216x288/fc0b9ebffa/1537864537?v=1","title":"Wolf Hall: A Novel","short_title":"Wolf Hall","author":"Hilary Mantel","tracking":{"object_type":"document","object_id":182560283,"track":"flattened_recommender","doc_uuid":"UXAMFa1c+4ve2dnABwWGubsHSyo="},"url":"https://www.scribd.com/book/182560283/Wolf-Hall-A-Novel"},"182565115":{"type":"book","id":182565115,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/182565115/108x144/50e3fc9eb2/1537865971?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/182565115/216x288/8bbf81282a/1537865971?v=1","title":"The Silver Linings Playbook: A Novel","short_title":"The Silver Linings Playbook","author":"Matthew Quick","tracking":{"object_type":"document","object_id":182565115,"track":"flattened_recommender","doc_uuid":"ksQm4531StTiP6Cy8VfwSztXUkQ="},"url":"https://www.scribd.com/book/182565115/The-Silver-Linings-Playbook-A-Novel"},"200797104":{"type":"document","id":200797104,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/200797104/108x144/38c954cebc/1410179087?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/200797104/216x288/6cf5036e6b/1410179087?v=1","title":"Cours Javascript","short_title":"Cours Javascript","author":"KaiserYankee","tracking":{"object_type":"document","object_id":200797104,"track":"flattened_recommender","doc_uuid":"VBDQW+QU6rUDJ4cvtOVuhco+85Q="},"url":"https://www.scribd.com/document/200797104/Cours-Javascript"},"202691564":{"type":"book","id":202691564,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/202691564/108x144/f0e6e6416d/1537869541?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/202691564/216x288/56a5d067c6/1537869541?v=1","title":"Smart People Should Build Things: How to Restore Our Culture of Achievement, Build a Path for Entrepreneurs, and Create New Jobs in America","short_title":"Smart People Should Build Things","author":"Andrew Yang","tracking":{"object_type":"document","object_id":202691564,"track":"flattened_recommender","doc_uuid":"iKRMCKt5WKa+DuPqq6WAuI3Xgm0="},"url":"https://www.scribd.com/book/202691564/Smart-People-Should-Build-Things-How-to-Restore-Our-Culture-of-Achievement-Build-a-Path-for-Entrepreneurs-and-Create-New-Jobs-in-America"},"211302755":{"type":"book","id":211302755,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/211302755/108x144/2424de51a2/1537870532?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/211302755/216x288/09ee7462f3/1537870532?v=1","title":"The Hard Thing About Hard Things: Building a Business When There Are No Easy Answers","short_title":"The Hard Thing About Hard Things","author":"Ben Horowitz","tracking":{"object_type":"document","object_id":211302755,"track":"flattened_recommender","doc_uuid":"notLYtMe3UpjeXbVSX2wsJ59rbc="},"url":"https://www.scribd.com/book/211302755/The-Hard-Thing-About-Hard-Things-Building-a-Business-When-There-Are-No-Easy-Answers"},"212863738":{"type":"book","id":212863738,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/212863738/108x144/5bad102ef1/1537868451?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/212863738/216x288/8fc36df455/1537868451?v=1","title":"The Unwinding: An Inner History of the New America","short_title":"The Unwinding","author":"George Packer","tracking":{"object_type":"document","object_id":212863738,"track":"flattened_recommender","doc_uuid":"bnrsF9wjRkbAuWCBEOrca499XPs="},"url":"https://www.scribd.com/book/212863738/The-Unwinding-An-Inner-History-of-the-New-America"},"216442529":{"type":"book","id":216442529,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/216442529/108x144/7945e537de/1537947919?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/216442529/216x288/95db88293e/1537947919?v=1","title":"Lovers at the Chameleon Club, Paris 1932: A Novel","short_title":"Lovers at the Chameleon Club, Paris 1932","author":"Francine Prose","tracking":{"object_type":"document","object_id":216442529,"track":"flattened_recommender","doc_uuid":"Awm2KCrzy8ttg4XTSb9bS/o9PSQ="},"url":"https://www.scribd.com/book/216442529/Lovers-at-the-Chameleon-Club-Paris-1932-A-Novel"},"224248520":{"type":"book","id":224248520,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224248520/108x144/57b8f15c1c/1537871492?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224248520/216x288/2fc602273a/1537871492?v=1","title":"The Kitchen House: A Novel","short_title":"The Kitchen House","author":"Kathleen Grissom","tracking":{"object_type":"document","object_id":224248520,"track":"flattened_recommender","doc_uuid":"xkmso4MFXCYCT+rTROCvnmHMGKs="},"url":"https://www.scribd.com/book/224248520/The-Kitchen-House-A-Novel"},"224248577":{"type":"book","id":224248577,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224248577/108x144/d525463c67/1537943775?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224248577/216x288/2b59844b99/1537943775?v=1","title":"The Rosie Project: A Novel","short_title":"The Rosie Project","author":"Graeme Simsion","tracking":{"object_type":"document","object_id":224248577,"track":"flattened_recommender","doc_uuid":"gKa3wcwpichKfAhBGLijEo6+Vfk="},"url":"https://www.scribd.com/book/224248577/The-Rosie-Project-A-Novel"},"224252178":{"type":"book","id":224252178,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224252178/108x144/68dbc1000d/1537863398?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224252178/216x288/57a65a5750/1537863398?v=1","title":"Brooklyn: A Novel","short_title":"Brooklyn","author":"Colm Toibin","tracking":{"object_type":"document","object_id":224252178,"track":"flattened_recommender","doc_uuid":"Y9nao6j8QuiGwOx3QbIwSz51gGE="},"url":"https://www.scribd.com/book/224252178/Brooklyn-A-Novel"},"224258670":{"type":"book","id":224258670,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224258670/108x144/3c7a87a449/1537875000?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224258670/216x288/ef3c1ca84d/1537875000?v=1","title":"The Prize: The Epic Quest for Oil, Money & Power","short_title":"The Prize","author":"Daniel Yergin","tracking":{"object_type":"document","object_id":224258670,"track":"flattened_recommender","doc_uuid":"/rfuA4zewFTDe7VYXFLM5yL6hss="},"url":"https://www.scribd.com/book/224258670/The-Prize-The-Epic-Quest-for-Oil-Money-Power"},"224266633":{"type":"book","id":224266633,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224266633/108x144/d0de7b5bf4/1537874992?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224266633/216x288/a40600a76d/1537874992?v=1","title":"The Perks of Being a Wallflower","short_title":"The Perks of Being a Wallflower","author":"Stephen Chbosky","tracking":{"object_type":"document","object_id":224266633,"track":"flattened_recommender","doc_uuid":"pStI6b7Z+ZLTpu4AR470yXMFY8Q="},"url":"https://www.scribd.com/book/224266633/The-Perks-of-Being-a-Wallflower"},"224270540":{"type":"book","id":224270540,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224270540/108x144/f484685ce1/1537873985?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224270540/216x288/f0d4e09ce0/1537873985?v=1","title":"The Master","short_title":"The Master","author":"Colm Toibin","tracking":{"object_type":"document","object_id":224270540,"track":"flattened_recommender","doc_uuid":"FLKjR7YV1z1GUVb2HdzFYH8wrvk="},"url":"https://www.scribd.com/book/224270540/The-Master"},"224285255":{"type":"book","id":224285255,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224285255/108x144/144bc668f6/1537943841?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224285255/216x288/9dbee53a6c/1537943841?v=1","title":"The Flamethrowers: A Novel","short_title":"The Flamethrowers","author":"Rachel Kushner","tracking":{"object_type":"document","object_id":224285255,"track":"flattened_recommender","doc_uuid":"HYRamj1O9g1W6Q/13pJXVXG2udM="},"url":"https://www.scribd.com/book/224285255/The-Flamethrowers-A-Novel"},"224306619":{"type":"book","id":224306619,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224306619/108x144/7eeca5a1bc/1537871531?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224306619/216x288/4a8f75444a/1537871531?v=1","title":"The Light Between Oceans: A Novel","short_title":"The Light Between Oceans","author":"M.L. Stedman","tracking":{"object_type":"document","object_id":224306619,"track":"flattened_recommender","doc_uuid":"PsqaeG3mIGFnAdLBDejYM4fiXeQ="},"url":"https://www.scribd.com/book/224306619/The-Light-Between-Oceans-A-Novel"},"224326250":{"type":"book","id":224326250,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224326250/108x144/b659f5fb6a/1537867743?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224326250/216x288/900e8864ca/1537867743?v=1","title":"Steve Jobs","short_title":"Steve Jobs","author":"Walter Isaacson","tracking":{"object_type":"document","object_id":224326250,"track":"flattened_recommender","doc_uuid":"OsTQydzYwRVYX7TLCC5oojr0fOg="},"url":"https://www.scribd.com/book/224326250/Steve-Jobs"},"224349281":{"type":"book","id":224349281,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224349281/108x144/4df0918cea/1537876130?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224349281/216x288/befa0c6317/1537876130?v=1","title":"How To Win Friends and Influence People","short_title":"How To Win Friends and Influence People","author":"Dale Carnegie","tracking":{"object_type":"document","object_id":224349281,"track":"flattened_recommender","doc_uuid":"bedkrepiIaY355+AIlYhHxnI4Q4="},"url":"https://www.scribd.com/book/224349281/How-To-Win-Friends-and-Influence-People"},"224355300":{"type":"book","id":224355300,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224355300/108x144/0f2130a60a/1537864013?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224355300/216x288/9b9b19254a/1537864013?v=1","title":"Grand Pursuit: The Story of Economic Genius","short_title":"Grand Pursuit","author":"Sylvia Nasar","tracking":{"object_type":"document","object_id":224355300,"track":"flattened_recommender","doc_uuid":"ACmKWeAI2wwpgWREd1lLfKCQg8M="},"url":"https://www.scribd.com/book/224355300/Grand-Pursuit-The-Story-of-Economic-Genius"},"224369806":{"type":"book","id":224369806,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224369806/108x144/6fb23377a8/1537864222?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224369806/216x288/b1d476d0fb/1537864222?v=1","title":"The Emperor of All Maladies: A Biography of Cancer","short_title":"The Emperor of All Maladies","author":"Siddhartha Mukherjee","tracking":{"object_type":"document","object_id":224369806,"track":"flattened_recommender","doc_uuid":"C8ChOcsCQ+a0IYpcdPIDi3ILFFQ="},"url":"https://www.scribd.com/book/224369806/The-Emperor-of-All-Maladies-A-Biography-of-Cancer"},"224410295":{"type":"book","id":224410295,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224410295/108x144/514b1bea0b/1537863981?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224410295/216x288/f7c9469e6c/1537863981?v=1","title":"Team of Rivals: The Political Genius of Abraham Lincoln","short_title":"Team of Rivals","author":"Doris Kearns Goodwin","tracking":{"object_type":"document","object_id":224410295,"track":"flattened_recommender","doc_uuid":"TIxyWBvQ+YJbhQT63EY2XfT5Haw="},"url":"https://www.scribd.com/book/224410295/Team-of-Rivals-The-Political-Genius-of-Abraham-Lincoln"},"224419023":{"type":"book","id":224419023,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224419023/108x144/48b209bbb5/1537864054?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224419023/216x288/39263c2334/1537864054?v=1","title":"John Adams","short_title":"John Adams","author":"David McCullough","tracking":{"object_type":"document","object_id":224419023,"track":"flattened_recommender","doc_uuid":"8mGFUxLikLGWDAbGiwWUfWKclXU="},"url":"https://www.scribd.com/book/224419023/John-Adams"},"224421552":{"type":"book","id":224421552,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224421552/108x144/2f2c02f5eb/1537864411?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224421552/216x288/65ac725c07/1537864411?v=1","title":"Good in Bed","short_title":"Good in Bed","author":"Jennifer Weiner","tracking":{"object_type":"document","object_id":224421552,"track":"flattened_recommender","doc_uuid":"LieUnTJxZLKqXvrqqxnf0lhYHmw="},"url":"https://www.scribd.com/book/224421552/Good-in-Bed"},"224426877":{"type":"book","id":224426877,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/224426877/108x144/f22cf865fe/1537947949?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/224426877/216x288/a73f25e252/1537947949?v=1","title":"Angela's Ashes: A Memoir","short_title":"Angela's Ashes","author":"Frank McCourt","tracking":{"object_type":"document","object_id":224426877,"track":"flattened_recommender","doc_uuid":"daJMF80RmlpDxBBzftbOcwmjgrc="},"url":"https://www.scribd.com/book/224426877/Angela-s-Ashes-A-Memoir"},"225916486":{"type":"book","id":225916486,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/225916486/108x144/241cf75eb3/1537867248?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/225916486/216x288/a042fe186a/1537867248?v=1","title":"A Heartbreaking Work Of Staggering Genius: A Memoir Based on a True Story","short_title":"A Heartbreaking Work Of Staggering Genius","author":"Dave Eggers","tracking":{"object_type":"document","object_id":225916486,"track":"flattened_recommender","doc_uuid":"PSdZIpVqIykr2XRLuZzC5ZiT3bQ="},"url":"https://www.scribd.com/book/225916486/A-Heartbreaking-Work-Of-Staggering-Genius-A-Memoir-Based-on-a-True-Story"},"231689346":{"type":"book","id":231689346,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/231689346/108x144/7e5fbbde4a/1537944008?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/231689346/216x288/b7fe80231f/1537944008?v=1","title":"The Blazing World: A Novel","short_title":"The Blazing World","author":"Siri Hustvedt","tracking":{"object_type":"document","object_id":231689346,"track":"flattened_recommender","doc_uuid":"nYUZs8bDv9Rmhq11o8XKYmMSO/Q="},"url":"https://www.scribd.com/book/231689346/The-Blazing-World-A-Novel"},"232425556":{"type":"document","id":232425556,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/document/232425556/108x144/9cbbaf607a/1435998887?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/document/232425556/216x288/4a034afea6/1435998887?v=1","title":"Commit Batch","short_title":"Commit Batch","author":"mistieger","tracking":{"object_type":"document","object_id":232425556,"track":"flattened_recommender","doc_uuid":"p6m3PH0dqwZCUpTy16TbCThIF2k="},"url":"https://www.scribd.com/document/232425556/Commit-Batch"},"234028503":{"type":"book","id":234028503,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/234028503/108x144/2c4440aa6c/1537869518?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/234028503/216x288/cfe54b8013/1537869518?v=1","title":"Bad Feminist: Essays","short_title":"Bad Feminist","author":"Roxane Gay","tracking":{"object_type":"document","object_id":234028503,"track":"flattened_recommender","doc_uuid":"J9mouJvTllrxRZL33VCKB9utEUc="},"url":"https://www.scribd.com/book/234028503/Bad-Feminist-Essays"},"235411767":{"type":"book","id":235411767,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/235411767/108x144/b2ad7aa7d5/1537864199?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/235411767/216x288/1740216c8c/1537864199?v=1","title":"A Man Called Ove: A Novel","short_title":"A Man Called Ove","author":"Fredrik Backman","tracking":{"object_type":"document","object_id":235411767,"track":"flattened_recommender","doc_uuid":"YDD5D6IFWJVoCpkXmNKT5gdbv/w="},"url":"https://www.scribd.com/book/235411767/A-Man-Called-Ove-A-Novel"},"235583696":{"type":"book","id":235583696,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/235583696/108x144/a9f15763be/1537870877?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/235583696/216x288/7c5ab0af0f/1537870877?v=1","title":"We Are Not Ourselves: A Novel","short_title":"We Are Not Ourselves","author":"Matthew Thomas","tracking":{"object_type":"document","object_id":235583696,"track":"flattened_recommender","doc_uuid":"k39HZtY78kUgmjjxQk7cjrNf+y4="},"url":"https://www.scribd.com/book/235583696/We-Are-Not-Ourselves-A-Novel"},"238704340":{"type":"book","id":238704340,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/238704340/108x144/2fd0be1590/1537866560?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/238704340/216x288/191539db56/1537866560?v=1","title":"This Changes Everything: Capitalism vs. The Climate","short_title":"This Changes Everything","author":"Naomi Klein","tracking":{"object_type":"document","object_id":238704340,"track":"flattened_recommender","doc_uuid":"E7jKzPNPMC4cy/CKjfauKzzi2lY="},"url":"https://www.scribd.com/book/238704340/This-Changes-Everything-Capitalism-vs-The-Climate"},"239488191":{"type":"book","id":239488191,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/239488191/108x144/a9a21bdc0e/1537947566?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/239488191/216x288/73448c1779/1537947566?v=1","title":"The Innovators: How a Group of Hackers, Geniuses, and Geeks Created the Digital Revolution","short_title":"The Innovators","author":"Walter Isaacson","tracking":{"object_type":"document","object_id":239488191,"track":"flattened_recommender","doc_uuid":"4wixtPJlo91TQsBC8VbtWnOtVRI="},"url":"https://www.scribd.com/book/239488191/The-Innovators-How-a-Group-of-Hackers-Geniuses-and-Geeks-Created-the-Digital-Revolution"},"239588474":{"type":"book","id":239588474,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/239588474/108x144/149fb5e6af/1537924657?v=1","retina_thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/239588474/216x288/15f36354f8/1537924657?v=1","title":"Rise of ISIS: A Threat We Can't Ignore","short_title":"Rise of ISIS","author":"Jay Sekulow","tracking":{"object_type":"document","object_id":239588474,"track":"flattened_recommender","doc_uuid":"vwNwcTf9llhRURipLt4dGe26n9k="},"url":"https://www.scribd.com/book/239588474/Rise-of-ISIS-A-Threat-We-Can-t-Ignore"},"244157917":{"type":"book","id":244157917,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/244157917/108x144/c55ae5929d/1537862008?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/244157917/216x288/c42f4ff9aa/1537862008?v=1","title":"Yes Please","short_title":"Yes Please","author":"Amy Poehler","tracking":{"object_type":"document","object_id":244157917,"track":"flattened_recommender","doc_uuid":"dVQp23UuRr8MdBNZRMPiM/LP2Ms="},"url":"https://www.scribd.com/book/244157917/Yes-Please"},"246897514":{"type":"book","id":246897514,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/246897514/108x144/60f21686b1/1537872475?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/246897514/216x288/4b640ccfe4/1537872475?v=1","title":"The Wallcreeper","short_title":"The Wallcreeper","author":"Nell Zink","tracking":{"object_type":"document","object_id":246897514,"track":"flattened_recommender","doc_uuid":"CL5OpBBcuJvq9dLHZR/oAh6KkuY="},"url":"https://www.scribd.com/book/246897514/The-Wallcreeper"},"249308236":{"type":"book","id":249308236,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/249308236/108x144/0b356a7d6a/1537861777?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249308236/216x288/cbef455d67/1537861777?v=1","title":"Interpreter of Maladies","short_title":"Interpreter of Maladies","author":"Jhumpa Lahiri","tracking":{"object_type":"document","object_id":249308236,"track":"flattened_recommender","doc_uuid":"+R+xWgJgrJqGK2tH2e7GY36UmeY="},"url":"https://www.scribd.com/book/249308236/Interpreter-of-Maladies"},"249308781":{"type":"book","id":249308781,"thumb_url":"https://imgv2-2-f.scribdassets.com/img/word_document/249308781/108x144/8ccbad3c4a/1537868572?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249308781/216x288/b0591f1a45/1537868572?v=1","title":"Life of Pi","short_title":"Life of Pi","author":"Yann Martel","tracking":{"object_type":"document","object_id":249308781,"track":"flattened_recommender","doc_uuid":"mg6XK696V5F6Q7D690+q0jEF7rU="},"url":"https://www.scribd.com/book/249308781/Life-of-Pi"},"249309502":{"type":"book","id":249309502,"thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249309502/108x144/06f5527c5d/1537862881?v=1","retina_thumb_url":"https://imgv2-1-f.scribdassets.com/img/word_document/249309502/216x288/ec3bf7c24b/1537862881?v=1","title":"Extremely Loud and Incredibly Close: A Novel","short_title":"Extremely Loud and Incredibly Close","author":"Jonathan Safran Foer","tracking":{"object_type":"document","object_id":249309502,"track":"flattened_recommender","doc_uuid":"ezEULXkPr+iAJJ4JnskqjUJRkIo="},"url":"https://www.scribd.com/book/249309502/Extremely-Loud-and-Incr