Javascript - Les fonctions

Javascript

Les fonctions

	Définition Une fonction est un groupe de ligne(s) de code de programmation destiné à exécuter une tâche bien spécifique et que l'on pourra, si besoin est, utiliser à plusieurs reprises. De plus, l'usage des fonctions améliorera grandement la lisibilité de votre script. En Javascript, il existe deux types de fonctions : les fonctions propres à Javascript. On les appelle des "méthodes". Elles sont associées à un objet bien particulier comme c'était le cas de la méthode Alert() avec l'objet window. les fonctions écrites par vous-même pour les besoins de votre script. C'est à celles-là que nous nous intéressons maintenant.
	Déclaration des fonctions Pour déclarer ou définir une fonction, on utilise le mot (réservé) function. La syntaxe d'une déclaration de fonction est la suivante : function nom_de_la_fonction(arguments) { ... code des instructions ... } Le nom de la fonction suit les mêmes règles que celles qui régissent le nom de variables (nombre de caractères indéfini, commencer par une lettre, peuvent inclure des chiffres...). Pour rappel, Javascript est sensible à la case. Ainsi fonction() ne sera pas égal à Fonction(). En outre, Tous les noms des fonctions dans un script doivent être uniques. La mention des arguments est facultative mais dans ce cas les parenthèses doivent rester. C'est d'ailleurs grâce à ces parenthèses que l'interpréteur Javascript distingue les variables des fonctions. Nous reviendrons plus en détail sur les arguments et autres paramètres dans la partie Javascript avancé. Lorsque une accolade est ouverte, elle doit impérativement, sous peine de message d'erreur, être refermée. Prenez la bonne habitude de fermer directement vos accolades et d'écrire votre code entre elles. Le fait de définir une fonction n'entraîne pas l'exécution des commandes qui la composent. Ce n'est que lors de l'appel de la fonction que le code de programme est exécuté.
	L'appel d'une fonction L'appel d'une fonction se fait le plus simplement du monde par le nom de la fonction (avec les parenthèses). Soit par exemple nom_de_la_fonction(); Il faudra veiller en toute logique (car l'interpréteur lit votre script de haut vers le bas) que votre fonction soit bien définie avant d'être appelée.
	Les fonctions dans <HEAD>...<HEAD> Il est donc prudent ou judicieux de placer toutes les déclarations de fonction dans l'en-tête de votre page c-à-d dans la balise <HEAD> ... <HEAD>. Vous serez ainsi assuré que vos fonctions seront déjà prises en compte par l'interpréteur avant qu'elles soient appelées dans le <BODY>.
	Exemple Dans cet exemple, on définit dans les balises HEAD, une fonction appelée message() qui affiche le texte "Bienvenue à ma page". cette fonction sera appelée au chargement de la page voir onLoad=.... dans le tag <BODY>. <HTML> <HEAD> <SCRIPT LANGUAGE="Javascript"> <-- function message() { document.write("Bienvenue à ma page"); } //--> </SCRIPT> </HEAD> <BODY onLoad="message()"> </BODY> </HTML>

Fin de la partie prévue pour les débutants --- Début de la partie considérée comme avancée

	Passer une valeur à une fonction On peut passer des valeurs ou paramètres aux fonctions Javascript. La valeur ainsi passée sera utilisée par la fonction Pour passer un paramètre à une fonction, on fournit un nom d'une variable dans la déclaration de la fonction. Un exemple un peu simplet pour comprendre. J'écris une fonction qui affiche une boite d'alerte dont le texte peut changer. Dans la déclaration de la fonction, on écrit : function Exemple(Texte) { alert(texte); } Le nom de la variable est Texte et est définie comme un paramètre de la fonction. Dans l'appel de la fonction, on lui fournit le texte : Exemple("Salut à tous");
	Passer plusieurs valeurs à une fonction On peut passer plusieurs paramètres à une fonction. Comme c'est souvent le cas en Javascript, on sépare les paramètres par des virgules. function nom_de_la_fonction(arg1, arg2, arg3) { ... code des instructions ... } Notre premier exemple devient pour la déclaration de fonction : function Exemplebis(Texte1, Texte2){...} et pour l'appel de la fonction Exemplebis("Salut à tous", "Signé Luc")
	Retourner une valeur Le principe est simple (la pratique parfois moins). Pour renvoyer un résultat, il suffit d'écrire le mot clé return suivi de l'expression à renvoyer. Notez qu'il ne faut pas entourer l'expression de parenthèses. Par exemple : function cube(nombre) { var cube = nombrenombrenombre return cube; } Précisons que l'instruction return est facultative et qu'on peut trouver plusieurs return dans une même fonction. Pour exploiter cette valeur de la variable retournée par la fonction, on utilise une formulation du type document.write(cube(5)).
	Variables locales et variables globales Avec les fonctions, le bon usage des variables locales et globales prend toute son importance. Une variable déclarée dans une fonction par le mot clé var aura une portée limitée à cette seule fonction. On ne pourra donc pas l'exploiter ailleurs dans le script. On l'appelle donc variable locale. function cube(nombre) { var cube = nombrenombrenombre } Ainsi la variable cube dans cet exemple est une variable locale. Si vous y faites référence ailleurs dans le script, cette variable sera inconnue pour l'interpréteur Javascript (message d'erreur). Si la variable est déclarée contextuellement (sans utiliser le mot var), sa portée sera globale -- et pour être tout à fait précis, une fois que la fonction aura été exécutée--. function cube(nombre) { cube = nombrenombrenombre } La variable cube déclarée contextuellement sera ici une variable globale. Les variables déclarées tout au début du script, en dehors et avant toutes fonctions, seront toujours globales, qu'elles soient déclarées avec var ou de façon contextuelle. <SCRIPT LANGUAGE="javascript"> var cube=1 function cube(nombre) { var cube = nombrenombrenombre } </SCRIPT> La variable cube sera bien globale. Pour la facilité de gestion des variables, on ne peut que conseiller de les déclarer en début de script (comme dans la plupart des langages de programmation). Cette habitude vous met à l'abri de certaines complications.