V.
Procédures et fonctions
1.
Déclaration et appel des fonctions en JS
· On distingue traditionnellement les procédures et les fonctions.
JavaScript ne différencie par leur syntaxe. Il est recommandé de
les inclure dans la section d'en-tête du document à l'intérieur
du couple de balises
<Head>……..</Head>
· Une procédure est une suite d'instructions qui forment un
tout et qui sont regroupées sous un même nom.
Une fonction est une suite d'instructions qui calcule un résultat
; celui-ci est transmis à l'expression qui a appelé la fonction,
après le mot return. A noter que l'instruction return
peut être utilisée plusieurs fois en cas de valeur retournée
conditionnellement.
· De plus, procédures et fonctions peuvent admettre des paramètres.
Ce sont des variables dont les valeurs sont fixées par le programme
appelant au moment de l'exécution et qui apparaissent "
formellement ", sans valeur affectée au niveau de la déclaration.
S'il n'y a pas besoin de paramètres, le nom de la fonction est
suivi d'un couple de parenthèse vides.
a) Déclaration générale
d'une procédure et d'une fonction :
<HEAD>
<SCRIPT
LANGUAGE=JavaScript>
Function
nomProcédure(param1, param2,…) {
Séquence
d'instructions;
}
Function
nomFonction(param1, param2,…) {
Séquence
d'instructions;
Return
nom_variable
}
</SCRIPT>
</HEAD> |
b) Appel d'une procédure et
d'une fonction :
· JS lit les fonctions présentes dans une page, lors de son
ouverture, mais ne les
exécutent pas ;
· Une fonction n'est exécutée qu'au moment de son appel ;
· Dans l'écriture de l'appel de la fonction, il faut fournir une
liste de valeurs
correspondant exactement à la liste des paramètres présents dans
la déclaration ;
· Les procédures forment des instructions à part entière, tandis
que les fonctions doivent être affectées à une variable du type
de retour ou incluses dans des expressions comme document.write(…).
nomProcédure(valeur1,
valeur2, …);
variable = nomFonction(valeur1, valeur2,…) ; |
Exemple :
Étudier l'exemple suivant et prévoir exactement son exécution
<HEAD>
<SCRIPT>
//déclaration de la procédure
function bonjour(prenom) {
document.write(" Bonjour, comment vas-tu ", prenom,
" ?<br> ") ;
}
// déclaration fonctions
function volumeSphere(rayon) {
return 4/3*Math.PI*Math.pow(rayon,3) ;
}
function calculerPrix(PrixUnitaire, NbArticles) {
return PrixUnitaire*NbArticles ;
}
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT>
//appel de la procédure
bonjour(" Toto ") ;
//appels des fonctions
var montant=CalculPrix(150,4) ;
document.write(" Tu dois payer ", calculerPrix(150,4),
" F.<BR> ") ;
document.write(" Sais-tu que le volume de la sphère de
rayon unité est ",
volumeSphère(1), " ?<BR> ") ; ",
</SCRIPT>
</BODY> |
c) Visibilité des paramètres
De façon générale, les paramètres formels d'une fonction ne sont
connus qu'à l'intérieur de la fonction. De même, les variables
locales, variables qui sont explicitement déclarées à l'intérieur
de la fonction.
Conséquences :
Si la valeur d'un paramètre ou d'une variable locale est modifiée dans
la fonction, cette modification ne sera pas connue à l'extérieur
de la fonction. On dit que cette variable n'est pas visible au
niveau du programme général.
Examiner l'exemple suivant : qu'obtient-on exactement à l'exécution
?
<HEAD>
<SCRIPT LANGAGE=JavaScript>
function bonjour(nom) { // nom est un paramètre local
var ch = "Salut !" ; // ch est une variable
locale
document.write
("au début de la fonction : Bonjour"+nom+<BR>");
nom= "Alain "; // on modifie le paramètre
local
document.write("
à la fin de la fonction : Bonjour. " +nom + <BR>
") ;
{
var prenom = " Jacques " ;
Bonjour
(prénom);
document.write(" après appel de la fonction :Bonjour
" +prénom + " <BR> ") ;
</SCRIPT>
<HEAD> |
On ajoute à la fin l'instruction suivante :
document.write(" après appel
de la fonction :" + ch+" bonjour " +nom+
"<BR> ") ; |
o Que va t-il se passer exactement ?
o Et si on supprime + ch , qu'obtient-on ?
d) Fonctions récursives
JavaScript est un langage récursif ! une fonction peut faire
appel à elle-même, ou encore deux fonctions peuvent se faire appel
mutuellement.
Exemple classique : la fonction factorielle
<HTML>
<BODY>
<script>
function fact(n) {
if (n==0) return 1
else return (n*fact(n-1))
}
nb=prompt("N=","O") ;
document.write("Liste des premières factorielles
jusqu'à ", nb);
for (var i=0 ;i<nb ;i++)
document.write(i+" ! = "+fact(i)+<br>")
</script>
</BODY>
</HTML> |
Qu'obtient-on exactement à l'exécution ?
|