08 - Les fonctions

Introduction

Les fonctions permettent de ré-utiliser des morceaux de code. Pour cela, on leur donne un nom, on peut ensuite les appeler en donnant leur nom.

Exemple :

function maFonction(){
  let x=window.parseInt(window.prompt("Saisir un entier", ""));

  return x;
}

let valeur = maFonction();

Les fonctions peuvent prendre des paramètres en entrée pour modifier leur comportement et peuvent rencoyer une valeur à l’aide du mot clé return.

Paramètres et valeur de retour

Pour exploiter pleinement une fonction, il est souvent judicieux d’utiliser des paramètres (ou arguments).

Les fonctions qui ne sont pas utilisées en réaction à une action de l’utilisateur (événement) retournent souvent des valeurs.

Une fonction peut retourner une valeur au script qui y fait appel. Pour renvoyer le résultat au script, nous utilisons le mot réservé return.

La définition de la procédure comprend un paramètre ou argument (la variable nombre) appelé paramètre formel.

function doubler (nombre) {
	let d;
	d = nombre * 2;
	return d;
}

Dans le premier appel à la fonction, 7 est la valeur passée à la fonction, la valeur avec laquelle la fonction s’exécutera. La valeur 14 est retournée.

Cette valeur passée en paramètre est appelée paramètre effectif.

let a, b, c, d;
a = 7;
b = 9;
c = doubler(a);
d = doubler(b);

9 est le paramètre effectif du deuxième appel. La valeur 18 est retournée.

Un sous-programme peut avoir plusieurs paramètres, ils doivent alors être séparés par des virgules.

Exemple :

<html>
<head>
<title>Fonction qui retourne un résultat</title>
<script type="text/javascript">

function moyenne ( a,b,c,d ) {
	let resultat;
	resultat = ( a + b + c + d ) / 4 ;
	return resultat ;
}

function go () {
	nb1 = parseInt(prompt("Entrez un premier nombre"));
	nb2 = parseInt(prompt("Entrez un 2e nombre"));
	nb3 = parseInt(prompt("Entrez un 3e nombre"));
	nb4 = parseInt(prompt("Entrez un 4e nombre"));

	//appel à la fonction moyenne pour calculer le resultat
	result = moyenne(nb1, nb2, nb3, nb4);
	
	alert("La moyenne est " + result);
}

</script>
</head>

<body>
<input type="button" value="test" onclick="go()" />
</body>
</html>

Puisque la fonction retourne une valeur, dans ce cas-ci, vous pouvez placer l’appel de la fonction dans une expression :

score = moyenne ( 3, 4, 5, 6 ) ;
window.alert ( moyenne ( 1, 2, 3, 4 ) );
resultat = 2 * moyenne (1, 2, 3, 4 ) + 50;

Le langage JavaScript comprend plusieurs fonctions prédéfinies. Plusieurs des méthodes utilisées jusqu’à maintenant sont des fonctions :

window.prompt( message )
window.parseInt( chaine )
Math.random(), Math.max( nb1, nb2 )
chaine.charAt( position )
etc.

Autre exemple

Fonction carré

La fonction carre multiplie un nombre par lui-même.

<html>
<head>
<title>sous-programme de type fonction</title>
<script type="text/javascript" >
// définition de la fonction
function carre ( nb ) {
	return nb * nb;
}
// fin de la définition de la fonction
</script>

</head>
<body>
<p>
<script type="text/javascript" >

// 1 er appel de la fonction carre
document.write ("Le carré de " + 5 + " est " +  carre(5) + "<br/><br/>");

// 2 er appel de la fonction carre
for ( i =1; i <= 10; i=i+1) {
	document.write ("Le carré de " + i + " est " + carre (i) + "<br/>");
}
</script>
</p>
</body>
</html>

Fonction Math.max

La fonction max de l’objet prédéfini Math permet de déterminer le maximum de deux nombres lus avec la méthode window.prompt.

<!-- Utilisation de la fonction max de l'objet prédéfini 
Math; mentionnons que max est une des fonctions prédéfinies
de l'objet Math -->
<head>
<title>Trouver le maximum de deux nombres avec fenêtres de
dialogue</title>

</head>
<body>
<p>Depuis le navigateur, cliquez sur l'icône<br/>
<em>Actualiser </em>pour exécuter le script de nouveau</p>

<script type="text/JavaScript" >

let nbLu1, nbLu2, nb1, nb2, nbMax;

nbLu1 = window.prompt ( "Entrez le 1er nombre", "0" );
nbLu2 = window.prompt ( "Entrez le 2e nombre", "0" );
nb1 = window.parseFloat ( nbLu1 );
nb2 = window.parseFloat ( nbLu2 );

nbMax = Math.max ( nb1, nb2 );

document.write("1er nombre : "+nb1+"<br/>2e nombre : "
	+ nb2 + "<br/><br/>Le maximum est : " +nbMax );

</script>
</body>
</html>