|
10.1 Fonction dans une fonction |
  copyleftSee You Why? |
Désolé de contredire certains tutoriels de JS. Certains ne distinguent que 2 types de fonctions : celles sans paramètres et celles qui fournissent un résultat. Limiter les fonctions à ces 2 types est faux, puisque on trouve des fonctions
1. sans paramètres et sans résultat :
envoyer un message fixe à l'internaute ;
2. avec paramètres et avec résultats :
calculer l'hypothénuse d'un triangle dont on doit donner les 2 autres côtés comme paramètres ;
3. avec paramètres et sans résultat :
envoyer un message personnalisé avec le prénom de l'internaute ;
4. sans paramètres mais avec résultat :
cas le plus difficile à trouver, il ne faut pas de paramètres pour écrire la liste de tous les pays et
retenir celui qui a été choisi par l'internaute visiteur,
de même la fonction qui recherche l'adresse IP d'un internaute visiteur de vos pages.
Nous avons vu donc les fonctions sans paramètres et celles avec paramètres (unique ou multiples), celles avec une valeur de retour et celles qui engendrent des actions. Jusqu'ici, nous avons insisté sur la définition (ou déclaration) de la fonction et l'appel de cette même fonction.
Même si nous avons affirmé qu'il suffisait, pour appeler une fonction, de noter le nom de la fonction avec des parenthèses qui contiennent la valeur du ou des paramètres (parfois facultatifs), tous nos exemples montraient jusqu'ici l'appel d'une fonction par le script principal (parfois aussi appelé la racine) du programme.
Le lecteur aura compris la façon de définir ou déclarer une fonction personnelle ainsi que la façon de l'appeler dans le script principal, mais le lecteur attentif serait en droit de se poser la question : "Puis-je appeler une fonction dans une autre fonction ?". La réponse est simple OUI, mais ce chapitre a pour buts de vous montrer non seulement comment, mais aussi quels en sont les risques.
Comment ? De la même façon qu'un appel depuis la racine de votre script...
Un programme est une succession d'étapes dont chacune peut éventuellement être décomposée en actions plus élémentaires réalisables par l'ordinateur.
Il n'est pas rare que des concepteurs de programmes lancent au démarrage d'une page web une fonction initiale (qu'ils appellent init(), par exemple).
À partir de cette fonction initiale, ils appellent d'autres fonctions qu'ils détailleront par la suite.
Certains tutoriels parlent de sous-fonctions... cela n'existe pas en JS. Tout au plus, dans le cadre d'une conception objet, la fonction en question peut-elle effectivement être considérée comme une méthode mais privée.
Dans notre chapitre 6, section "appel d'une fonction", nous avons déjà
d'une part montré l'appel d'une fonction dans une autre fonction
et d'autre part, signalé la possibilité d'appeler une fonction dès l'ouverture d'une page HTML.
Revoyons ces deux appels dans notre exemple.
Dans le cas d'un site de vente au particulier, cette première fonction appelée à l'ouverture de la page HTML, init() pourrait par exemple se définir (se déclarer) ainsi :
function init() {
creation_panier();
coordonnees_client();
details_prix_poids_frais();
confirmation_commande();
choix_methode_paiement();
}
et l'appel de cette fonction init() va se faire dès le chargement d'une page par la formulation de la balise <body> du document HTML. On lira alors :
<body onLoad="init()">
Évidemment, et comme nous l'avons déjà signalé plusieurs fois, la fonction init() doit avoir été déclarée avant la lecture de la balise <body>, c'est donc un cas où la fonction init() sera définie entre les balises <head> et </head>.
Un autre exemple pour expliquer cette procédure :
function premiere() {
document.write("premiere etape<br>");
}
function seconde() {
document.write("seconde etape<br>");
}
jusque là, ce n'est que la déclaration de deux fonctions ordinaires, sans paramètres et sans instruction RETURN, chacune écrivant un court message à l'écran, suivi d'un saut de ligne. Aucun appel de ces fonctions, donc rien ne se passera... Reste donc à déclarer une fonction qui va appeler ces deux fonctions ; appelons-la depart() :
function depart() {
premiere();
seconde();
}
voilà un pas de plus accompli, la fonction depart() va appeler les deux autres... magnifique, mais rien ne se passe... pourquoi ?
Tant que la fonction depart() n'est pas appelée, rien ne se passera, puisque c'est elle qui appellera chacune des deux autres fonctions...
il ne nous reste plus qu'à appeler la fonction depart() qui appellera la fonction premiere() puis la fonction seconde()... puis plus rien à faire, sauf à tester le code ci-dessous :
Exemple
|
Un bref rappel ici : les noms de fonctions ne peuvent pas comporter de lettres accentuées.
Le lecteur aura compris que l'instruction depart(), appel de cette fonction,
aurait aussi pu se faire au chargement de la page,
par un paramétrage de l'instruction <body> en <body onLoad="depart()">,
mais alors le code des fonctions aurait dû s'écrire plus haut entre les balises <head> et </head> du langage HTML.
La facilité avac laquelle une fonction peut en appeler une autre est telle que parfois on en arrive à ce que le serpent se morde la queue : les boucles involontaires sont fréquentes. J'appelle un fonction, qui en appelle une autre, qui elle-même en appelle une troisième... mais si cette troisième appelle la première, la boucle est bouclée... et tant que nous n'aurons pas étudié les conditions ou les boucles volontaires... gare aux ronds-points dans lesquels on peut entrer sans pouvoir en sortir...
Illustrons ce propos par un exemple plus simple dans la section suivante de ce chapitre.
voir suite >>>
voir suite >>>
voir suite >>>
