Dans JavaScript, il existe deux moyens de créer des fonctions. La plus importante est l’instruction function . La deuxième méthode pour construire une fonction, davantage orientée objet, est très différente
Les fonctions de JavaScript rappellent fortement leurs homologues mathématiques. C’est pourquoi nous avons choisi une approche adéquate, pour aborder ces fonctions pas à pas .
Les mathématiques nous ont appris que :
Cette ligne vous semble familière ?Il s’agit bien d’une fonction complète : elle a un nom(f), un argument(x), une instruction(x2) et elle livre le résultat en guise de valeur de retour.
Après l’opération a = f(4), a reçoit la valeur 16 .
Bien sûr, il est possible de spécifier plusieurs arguments.
Dans la section suivante, nous allons découvrir comment créer des fonctions dans JavaScript.
La méthode la plus simple pour créer une fonction est l’instruction function. Le parallèle avec les fonctions mathématiques est évident. En voici la syntaxe générale :
Function f(Arg1, Arg2,….)
{
Blocinstructions ;
}
Function f(x)
{
return x * x ;
}
La fonction est enregistrée sous l’identificateur f, et peut être exécutée à tout moment par l’appel :
Après exécution de cette fonction, la variable a dispose de la valeur 16.
Les arguments sont transmis entre parenthèses. Dans notre exemple, nous n’en spécifions qu’un seul. L’appel transmet la valeur 4.
Puis vient le bloc d’instructions, entre accolades. Vous constatez que nous avons utilisé une instruction unique. Mais en réalité, il s’agit d’une instruction double : l’opération x * x calcule le carré de x, puis un return termine la fonction et livre le résultat de l’opération comme valeur de retour(valeur de la fonction)
Récapitulons :
Return peut intervenir en un endroit quelconque de la fonction pour terminer la fonction avant son terme. L’argument de l’instruction return constitue une expression qui servira de valeur de retour, ou de valeur de fonction. Si return est employé sans argument, la valeur de retour est undefined. C’est également le cas si la fonction atteint la fin du bloc d’instructions au lieu d’être terminé par return.
Les fonctions peuvent évidemment être imbriquées les une dans les autres.
Avec l’instruction new, vous créez un nouvel objet.
Le constructor est lui-même un objet ou une fonction. Le nouvel objet hérite des propriétés du constructeur. Pour les fonctions, il existe un constructeur spécial : il s’appelle Function(). Dans les parenthèses, sont transmis les noms des arguments de la fonction et le bloc d’instructions.
La fonction mathématique f(x) = x2 pourrait se présenter ainsi dans JavaScript :
Cette fonction est enregistrée sous l’identificateur f ; elle est exécutée par un appel du type :
Après cette instruction, la variable dispose de la valeur 16.
Le constructeur Function() reçoit deux valeurs entre parenthèses. La première est le nom de son argument, x, la seconde contient le bloc d’instructions. Comme avec l’instruction function, le bloc se compose ici uniquement de l’instruction return.
Les fonctions crées par le constructeur Function() sont compilées de façon dynamique, c’est à dire au moment de leur appel. Cela offre l’avantage de permettre la création de fonctions pendant l’exécution même du programme.
Cette fonction n’est créé que si la condition est remplie.
Si une telle fonction est fréquemment exécutée, par exemple dans le cadre d’une boucle , il peut en résulter une perte de temps importante. Dans ce cas, il vaut mieux recourir à l’instruction Function.
Vous savez maintenant comment les arguments sont transmis à la fonction. Lors de la création d’une fonction, les noms de variables dans lesquelles les arguments sont stockés sont définis. Il s’agira par exemple de x. Il existe cependant une autre possibilité de lire ces arguments. L’array arguments contient une liste de tous les arguments. Cette table est numérotée à partir de 0, arguments[0] contenant le premier, arguments[1] le deuxième, etc.. Le nombre d’arguments est enregistré dans argument. Lenght.
Les deux fonctions suivantes sont absolument similaires :
Cette méthode présente un avantage évident par rapport à la technique habituelle : elle permet de prendre en compte un nombre libre d’arguments. Ainsi, une boucle for pourra par exemple exploiter tous les arguments à l’aide de la condition i w argument.lenght.
<html>
<head>
<title>Exemple de programme JavaScript</title>
</head>
<body bgcolor=#eeeeee text=#555555 link=#0000ff vlink=#0000ff
alink=#ff0000>
<p align=left>
<font size=2 face="arial,helvetica" color=#ff7700>
<b>Modèle de solution de l'exercice du chapitre 6</b><br>
</font>
<p align=left>
<font size=2 face="arial,helvetica">
<script language="JavaScript"><!--
function font(size, color, face)
{
var sizeattr = '';
var faceattr = '';
var colorattr = '';
if( (size != undefined) && (size != '') )
{ sizeattr = ' size="' + size + '"'; }
if( (color != undefined) && (color != '') )
{ colorattr = ' color="' + color + '"'; }
if( (face != undefined) && (face != '') )
{ faceattr = ' face="' + face + '"'; }
return('<font' + sizeattr + colorattr + faceattr + '>');
}
with (document)
{
write(font('7','#004080','arial,helvetica'));
write('Hello World');
write('</font><br>');
write(font('','#0040ff'));
write('B i e n v e n u e d a n s ');
write(' J a v a S c r i p t');
write('</font><br>');
}
//--></script>
</font>
</p>
</body>
</html>