Comprendre et utiliser les instructions JavaScript

Les instructions sont utilisées dans JavaScript pour contrôler son flux de programme. Contrairement aux propriétés, méthodes et événements, qui sont fondamentalement liés à l'objet qui les possède, les instructions sont conçues pour fonctionner indépendamment de tout objet JavaScript. Cela signifie que vous pouvez utiliser une instruction si vous travaillez avec l'objet document, l'objet window, l'objet historique ou un autre objet. En tant que langage, JavaScript prend en charge relativement peu d'instructions - juste assez pour s'en sortir. Cependant, il offre le strict minimum d'instructions nécessaires pour construire une application entièrement fonctionnelle.

JavaScript prend actuellement en charge les onze instructions suivantes. Notez que certains d'entre eux - tels que comment, var et new - ne sont pas des déclarations de bonne foi, mais ils sont souvent traités comme tels. Ils sont inclus dans cette discussion par souci d'exhaustivité.

  • // commentaire
  • Pause
  • continuer
  • pour
  • pour ... dans
  • fonction
  • sinon
  • Nouveau
  • revenir
  • var
  • tandis que
  • avec

Certaines des instructions proposées en Java manquent notablement de JavaScript. Cela inclut l'instruction switch, ainsi que toutes les formes d'instructions d'interception d'erreurs (telles que catch et throw). JavaScript conserve ces déclarations sous forme de mots réservés, et peut-être dans une version future, elles seront implémentées.

Commentaire (//)

Les caractères // indiquent à JavaScript que vous souhaitez inclure des commentaires explicatifs dans votre programme. Le commentaire se termine au premier retour dur rencontré. JavaScript n'impose aucune limite à la longueur du commentaire, tant qu'il n'y a pas de retour dur avant la fin du commentaire. JavaScript suppose que le texte après le retour matériel est un code valide.

// Ceci est un simple commentaire

// Ceci est un autre commentaire qui s'étend sur plus d'une ligne. Bien que le commentaire retourne à la deuxième ligne, la première ligne se termine par un "retour en douceur" dans le programme d'édition de texte. Aucun caractère de retour matériel n'est inséré.

Vous pouvez placer les // caractères de commentaire n'importe où sur une ligne. JavaScript traitera tout le texte de cette ligne après // comme un commentaire.

MyVariable = "Ceci est un test" // affecte la variable de texte MyVariable 

Les commentaires sont ignorés lors de la lecture du script, ils n'affectent donc pas beaucoup la vitesse d'exécution. Cependant, de nombreux commentaires augmentent la taille du fichier des scripts et prennent plus de temps à télécharger sur l'ordinateur de l'utilisateur via une connexion Internet commutée. Pour de meilleurs résultats, limitez les commentaires dans les programmes JavaScript à des lignes simples et brèves.

Lors de la rédaction de longs commentaires, il est préférable d'utiliser les caractères de commentaire alternatifs / * et * /. Le texte entre ces caractères est traité comme un commentaire. Vous pouvez également commencer chaque ligne avec les // caractères de commentaire.

// Cette section vérifie si la touche Entrée est enfoncée, // puis continue 

ou

/ * Cette section vérifie si la touche Entrée est enfoncée, puis continue sur * / 

Retour à l'index

Pause

L'instruction break indique à JavaScript de quitter une «structure contrôlée» et de reprendre l'exécution à un point après la structure. L'instruction break est utilisée avec les structures créées à l'aide des commandes suivantes:

  • pour
  • pour ... dans
  • tandis que

L'instruction break est le plus souvent utilisée pour terminer prématurément une boucle for. Par exemple:

pour (Count = 1; Count <= 10; Count ++) {if (Count == 6) break; document.write ("

Boucle: "+ Count +"

");}

Cet exemple montre une boucle for qui compte de 1 à 10 et imprime le nombre à chaque itération de la boucle. Une instruction if dans la boucle for est utilisée pour tester si la valeur de la variable Count est égale à 6. Si Count vaut 6, l'instruction break est exécutée et le script quitte la boucle for. Tel qu'utilisé dans cet exemple simple, le script comptera de 1 à 6, puis s'arrêtera. Il quitte la boucle for avant de pouvoir compter jusqu'à 10.

Retour à l'index

Continuer

L'instruction continue indique à JavaScript d'ignorer toutes les instructions qui peuvent suivre dans une boucle for, for ... in ou while, et de procéder à l'itération suivante. L'utilisation la plus courante de l'instruction continue est d'ignorer conditionnellement les instructions de la boucle mais pas de quitter la boucle (comme le fait l'instruction break). Par exemple:

pour (Count = 1; Count <= 10; Count ++) {if (Count == 6) continue; document.write ("

Boucle: "+ Count +"

");}

L'exemple ci-dessus montre une boucle for qui compte de 1 à 10 et imprime le nombre à chaque itération de la boucle. Une instruction if dans la boucle for est utilisée pour tester si la valeur de la variable Count est égale à 6. Si Count est égal à 6, l'instruction continue est exécutée et le script ignore l'instruction document.write sur la ligne suivante. Mais la boucle ne s'arrête pas. Au lieu de cela, il continue et imprime des lignes pour les nombres restants. Tel qu'utilisé dans cet exemple simple, le script comptera de 1 à 5, sautera 6, puis imprimera 7 à 10.

Retour à l'index

Pour

L'instruction for répète un bloc d'instructions une ou plusieurs fois. Le nombre d'itérations est contrôlé par des valeurs fournies en arguments. La syntaxe de l'instruction for est:

pour (InitVal; Test; Incrément) 
  • InitVal is the starting value of the for loop. It is often 0 or 1, but it can be any number. InitVal is an expression that establishes the initial value and assigns that value to a variable. For example, Count=0 or i=1.

  • Test is the expression used by the for statement to control the number of iterations of the loop. As long as the Test expression is true, the loop continues. When the Test expression proves false, the loop ends. Example: Count<10 is true as long as the value in the Count variable is less than 10.

  • Incrementindique comment vous voulez que la boucle for compte - par un, deux, cinq, des dizaines, etc. Il s'agit également d'une expression et prend généralement la forme de CountVar++, où CountVarest le nom de la variable affectée en premier dans l' InitValexpression. Exemple: Count ++ augmente la valeur de la variable Count de un pour chaque itération.
Notez que contrairement à toutes les autres constructions en JavaScript, l'instruction for utilise des points-virgules, plutôt que des virgules, pour séparer ses arguments. Ceci est conforme à la syntaxe utilisée en C, C ++ et Java.

Here's an example of a for loop that counts from 1 to 10, stepping one digit at a time. At each iteration, the script inserts some text and begins a new line. The JavaScript you wish to repeat is enclosed in { and } characters following the for statement; this forms the for statement block. You can provide one line or many within the { and } characters.

for (Count=1; Count<=10; Count++) { document.write ("Iteration: "+Count+"

"); }

Count is the variable name used to store the for loop counter. The for loop starts out with 1 and proceeds to 10. The test expression is Count<=10, which reads:

Count is less than or equal to 10 

As long as this expression is true, the for loop continues. Do note that the Increment argument is also an expression and in the example uses the Count variable to increment the for loop by 1 for each iteration. There's no law that says you must increment the for loop by ones. Here's just one of the many alternatives. This example counts by tens, from 10 to 100.

for (Count=1; Count<101; Count+=10) { document.write ("Iteration: "+Count+"

"); }

Back to index

For...in

The for...in statement is a special version of the for statement described in the previous section. For...in is used to display the property names and/or property contents of objects. It is mostly handy as a debugging and testing tool: If a portion of your JavaScript code isn't working properly, and you suspect it may be the fault of a JavaScript object you are trying to use, you can examine all of the properties for that object with the for...in statement.

Unlike the for statement, for...in doesn't use incrementing tests or other expressions. You provide the name of a holding variable (the name of the variable is up to you) and the object you want to use. The basic syntax for the for...in statement is:

for (var in object) { statements } 
  • var is the name of a variable
  • object is the object you wish to examine
  • statements are one or more JavaScript instructions you wish to execute for each property returned by the for...in loop

As an example, suppose you want to determine the properties of the navigator object (this object contains details about the Netscape Navigator or other browser you are using). The following code displays each property name in an alert box. When running the script, click OK to proceed to the next property name. The loop automatically ends when there are no more properties in the object.

for (temp in navigator) { alert (temp); } 

A variation of this example is shown below. It not only displays the property names but also displays the contents of each property (some properties are empty and therefore no contents are shown for them). The contents of the properties are displayed by using the syntax object[var], or in this case navigator[temp].

for (temp in navigator) { alert (temp + ": " + navigator[temp]); } 

The for..in loop can be used for all object types. You can use it to iterate through all the properties for a form in a document, for example, or through the properties of a user-defined object. For instance, to cycle through all the properties of a form, you'd use the for...in loop as in the following example (assume the form name is "myform"):

 function test() { for (temp in document.myform) { alert (temp); } }

Back to index

Function

The function statement lets you create your own user-defined functions (as well as user-defined objects and methods for those objects). Functions are self-contained routines that can be "called" elsewhere within your JavaScript code. For example, if you have a function named

writeMyName

, which displays your name in headline text, you can activate it by merely referring to the name

writeMyName

someplace within your JavaScript code. Here's a short

test

that shows how this might work:

  Function Test  function writeMyName () { MyName="John Doe" alert (MyName) }     

The writeMyName function is defined within ... tags. It is activated (otherwise known as "called") when the form button is pushed. This calling action is accomplished using the onClick event handler, defined in the tag for the form button.

Back to index

If...else

The if, along with its optional else, statement is used to build an "if conditional" expression. It is called a conditional expression because it tests for a specific condition.

  • If the expression is true, the script performs the instructions following the if statement.
  • If the expression is false, the script jumps to the instructions that follow the else statement. If there is no else statement, the script jumps past the if statement entirely and continues from there.

The syntax for if is:

if (expression) 

The result of the if expression is always either true or false. The following syntax is acceptable when there's only one instruction following the if and else statements:

if (ExampleVar == 10) Start(); else Stop(); 

Should more than one instruction follow the if or else statement, the { and } characters must be used to define an if statement block. With the { and } characters in place, JavaScript knows to execute all of the instructions within the block.

if (ExampleVar == 10) { Count = 1; Start(); } else { Count = 0; Stop(); } 

Expressions in if statements are not limited to the == equality operator. You can test if values are not equal to one another, greater than, less than, and more. For more information on the operators you can use, see the references list at the end of this column. It points to valuable JavaScript documentation, including documentation provided by Netscape.

Back to index

New

The new statement creates a new copy of an object. It is used in either of two ways:

  • To define a new Date object (Date is a built-in JavaScript object)
  • To define a new user-defined object

The syntax is the same with either use:

varname = new objectName(params); 
  • varname is the name of the new object. Acceptable names are the same as for JavaScript variables. In fact, you can consider the created object as a JavaScript variable.

  • objectName is the name of the object. When using the built-in Date object, you use the word Date (note the capitalization -- this is mandatory). When using a user-defined object function, you provide the name of the object function.

  • params are one or more parameters that you pass to the object function, if needed.

The following example shows how to use the new statement to create a copy -- otherwise known as an "instance" -- of the Date object:

now = new Date(); 

L'objet now, qui peut être considéré comme une variable JavaScript, possède toutes les propriétés et méthodes de l'objet JavaScript Date. Par exemple, vous utilisez l'objet now pour déterminer l'heure actuelle de la journée:

maintenant = nouvelle date (); HourNow = now.getHours ();