Les fonctions

Une fonction est une liste d'instructions ayant un but prĂ©cis et que l'on utilise frĂ©quemment. L'intĂ©rĂȘt est d'Ă©viter les rĂ©pĂ©titions dans vos codes, et de gagner en lisibilitĂ©. Le principe consiste Ă  Ă©crire et nommer un bloc d'instructions, puis de l'exĂ©cuter au besoin. Dans le langage JavaScript, une fonction se dĂ©finit gĂ©nĂ©ralement dans l’entĂȘte <head> puis s’appelle dans le corps de la page, suite Ă  un Ă©vĂšnement.

Fonction simple

Voici une fonction simple qui affiche une boite d'alerte avec le texte "coucou". Pour l'exécuter, il suffit de l'appeler en écrivant son nom quelque part dans le code.

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <script>
    function coucou() {
        alert("coucou");
    }
    </script>
</head>

<body>
    <script>
    coucou();
    </script>
</body>

</html>

Si vous ne l'appelez pas, la fonction ne s'exécute pas.

Fonction avec un paramĂštre

L'action d'une fonction peut varier avec des paramĂštres. GrĂące au paramĂštre prenom, la fonction salut() ci-dessous vous salue personnellement.

<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<script>
		function salut(prenom) {
			alert("Bonjour " + prenom);
		}
		</script>
	</head>
	<body>
		<script>
		salut("Guillaume");
		</script>
	</body>
</html>

La fonction donne un résultat différent selon le paramÚtre qu'on lui transmet lors de son appel. Dans cet exemple, la valeur "Guillaume" affecte la variable prenom. C'est un peu comme si on écrivait :

prenom = "Guillaume";

Fonction avec plusieurs paramĂštres

<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<script>
		function salut(prenom,nom) {
			alert("Bonjour " + prenom + " " + nom);
		}
		</script>
	</head>
	<body>
		<script>
		salut("Guillaume","Guittenit");
		</script>
	</body>
</html>

Ce programme est vraiment trĂšs courtois !

fonction-parametres-bonjour

Fonction avec retour de résultat

Une fonction peut retourner un rĂ©sultat particulier grĂące Ă  l’instruction "return".

<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<script>
		function somme(a, b, c) {
			return (a + b + c);
		}
		</script>
	</head>
	<body>
		<script>
		alert(somme(8, 4*2, 3));
		</script>
	</body>
</html>

Affichera Ă  l'Ă©cran :

javascript-fonction-return

Articles connexes