Programmation JavaScript/Fonctions utilisateur

Un livre de Wikilivres.
Aller à : navigation, rechercher
Programmation JavaScript
Programmation JavaScript
Sommaire
  1. Introduction 100%.svg
  2. Présentation
  3. Syntaxe 50%.svg
    1. Ligne d'instruction 100%.svg
    2. Ordre d'évaluation 100%.svg
    3. Bloc d'instructions 100%.svg
    4. Identificateurs 100%.svg
    5. Expression littérale 100%.svg
    6. Commentaire 100%.svg
    7. Mots réservés et constantes 100%.svg
    8. Variables 100%.svg
    9. Opérateurs 100%.svg
    10. Structures de contrôle 75%.svg
      1. if else
      2. ? :
      3. switch
      4. for
      5. while
      6. do
    11. Fonctions utilisateur 100%.svg
    12. Évènement 75%.svg
  4. Objets prédéfinis 00%.svg
    1. window 25%.svg
    2. document 25%.svg
    3. navigator 25%.svg
    4. Array (tableaux) 100%.svg
    5. Boolean 00%.svg
    6. Date 25%.svg
    7. Error 00%.svg
    8. Function 00%.svg
    9. Math 25%.svg
    10. Number 25%.svg
    11. Object 00%.svg
    12. RegExp 00%.svg
    13. String 25%.svg
  5. Fonctions prédéfinies
  6. Mise en œuvre
  7. Programmation avancée
    1. Opérateurs de bits 00%.svg
    2. Programmation objet 00%.svg
    3. Gestion d'évennements 00%.svg
    4. Exceptions et erreurs 00%.svg
    5. Interface DOM 00%.svg
    6. Objets Microsoft 00%.svg
    7. Applets Java 00%.svg
    8. Notation JSON 00%.svg
    9. AJAX 00%.svg
  8. Debuggage
  9. Exemples commentés
  10. Références00%.svg
    1. Évènements
    2. Liens
Modifier ce modèle ce sommaire
<< Retour au sommaire détaillé / Événement >>

Déclaration et identification[modifier | modifier le wikicode]

Dans tous les cas (sauf deux), la fonction nécessite un Identificateur établi avec les mêmes règles que pour les variables.
Pour déclarer une fonction, on emploie la syntaxe suivante:

Déclaration d'une fonction
function ma_fonction()

C'est à dire, utilisation du mot réservé>> function suivi de l'identificateur et de parenthèses. Ces dernières serviront à définir les paramètres de la fonction.

Fonction sans paramètres[modifier | modifier le wikicode]

La plupart des fonctions servent à effectuer des opérations sur des variables données en argument, mais ce n'est pas une obligation.

Fonction sans paramètres
function init()
{
   if (!navigator.cookieEnabled)...
}

Transmission de paramètres[modifier | modifier le wikicode]

Transmission classique[modifier | modifier le wikicode]

Les paramètres sont transmis à la fonction entre les parenthèses de la déclaration. Comme javascript est un langage à typage dynamique, les paramètres se résument à de simples identificateurs séparés par des virgules.

Transmission de paramètres (mode classique)
function display_message(s1,s2)
{
    var result = s1 + " " + s2;
    alert(result);
}

Autre mode de paramétrage[modifier | modifier le wikicode]

JavaScript offre beaucoup de souplesse dans l'envoi d'arguments à une fonction.
le langage ne vous oblige pas à rédiger des fonctions au nombre d'arguments préétablis.
Un mécanisme simple permet à tout moment de compter et d'accéder aux paramètres.
JavaScript autorise l'appel d'une fonction en ométant les paramètres. Ceci ne déclenche pas d'erreur, mais c'est une incivilité, source de bugs.
La fonction, elle, peut à tout moment se rendre compte de la présence, absence, nombre et nature des paramètres, et ceci à travers un tableau intégré à la fonction et nommé "arguments".

Argument non-renseigné
function foo(param1)
{
   if (arguments.length==0)
        alert("fonction foo : paramètre manquant");
}

// Appel de la fonction sans paramètre :
foo(); // Affiche "paramètre manquant";

L'exemple suivant montre comment tirer partie du tableau arguments pour traiter des données dont on ne connaît pas le nombre au départ

Propriété arguments (Array)
function concat_chaînes()
{
    result = "";
    for(i = 0; i < arguments.length; i++)     // Pour chaque argument
    {
         result +=  arguments[i] + " ";       // Ajouter le contenu et un espace à result
    }
    return result;                            // renvoyer le résultat
}
alert(concat_chaînes("Concaténation","de","chaînes")); // Affiche "Concaténation de chaînes"

Valeur renvoyée[modifier | modifier le wikicode]

Avec le mot réservé return, la fonction est capable de renvoyer une valeur au programme appelant. Cette valeur est contenue dans une donnée en tout point comparable à une variable typée.

return vide[modifier | modifier le wikicode]

Le mot réservé return peut s'employer sans valeur de retour, uniquement dans le but de "sortir" de la fonction. Il est possible d'utiliser plusieurs fois return dans une fonction, l'exécution sera interrompue au premier return rencontré.

return multiples
function foo(p)
{
   var resultat = "";
   if (condition_1)
      return;            // Sortie de secours
         else
            resultat = traitement(p);
   return resultat;      // Sortie normale
}

Note : Possible, cette pratique est généralement déconseillée en algorithmie. Une fonction doit s'efforcer d'avoir une entrée et une sortie.

Corps de la fonction[modifier | modifier le wikicode]

Variables[modifier | modifier le wikicode]

La fonction peut avoir besoin de créer des variables pour mener à bien ses calculs. Dans ce cas, il est indispensable de garder en tête qu'une variable non-précédée du mot réservé var se révèle globale, et donc source de conflits. Une bonne pratique consiste à déclarer ses variables en début de fonction, même si rien ne vous y oblige.

Variables locales
function foo()
{
   var v1;
   var v2;
}

Sous-fonction[modifier | modifier le wikicode]

Une fonction peut contenir des sous-fonctions qui lui sont propre et l'aide à accomplir sa tâche.

Sous-fonction
function foo(n)
{
   function bar(p)
   {
       return p*p*p;
   }

   for (var i = 0; i < n; i++)
      bar(i);
}

Appel de la fonction[modifier | modifier le wikicode]

Nous pouvons admettre quatre modèles de fonction : Avec ou sans paramètres, avec ou sans valeur de retour.

Sans valeur de retour[modifier | modifier le wikicode]

Sans valeur de retour, la fonction est un verbe. Il suffit de la nommer avec ses paramètres, et elle s'exécute :

Fonction sans valeur de retour
<body onload="init()">

Avec valeur de retour[modifier | modifier le wikicode]

Si l'on a prévu que la fonction renvoie une valeur, on peut recueillir celle-ci dans une variable, ou l'utiliser directement, ou l'ignorer si bon nous semble. Le résultat renvoyé par la fonction a toute les carcatéristiques d'une variable (type, valeur, utilisabilité avec des opérateurs...

Avec valeur de retour
var le_cube_de_trois = cube(3); // Valeur de retour recueillie dans une variable
alert("Cube de 3 : " + cube(3)); // Affiche "Cube de 3 : 27" (concaténation)
cube(3); // Appel sourd de la fonction, on ignore le résultat

Sans paramètre[modifier | modifier le wikicode]

Les parenthèses demeurent nécessaire à l'identification complète de la fonction. Elles restent vide. (Les espaces sont possibles, ainsi que les commentaires slash-étoile)

Entre parenthèses
n = foo();
n = foo ( );
n = foo(/* J'occupe l'espace... */);

Avec paramètre[modifier | modifier le wikicode]

Les paramètres envoyés à une fonction peuvent être sous forme de constante, de référence à une variable ou d'expression littérale.

Types d'arguments
result = foo("Chaîne littérale", ma_var, true); // Littéral, variable et constante booléenne

Que deviennent les variables envoyées[modifier | modifier le wikicode]

Les variables envoyées en paramètre d'une fonction subissent ou ne subissent pas de modifications selon leur nature:

Primitives[modifier | modifier le wikicode]

Si la variable est d'un type primitif comme string, bool et number, le mécanisme d'appel de la fonction envoie en fait des copies de la variable. Les modifications opérées par la fonction n'ont pas de répercussion sur la variable originale, sous réserve, bien entendu qu'il n'y ait pas de collision d'identification avec une variable globale.

Variables préservées
function foo(str)
{
    str = "c'est pas si important";
}

s = "Trés important";
foo(s);
alert(s); // Affiche "Trés important" : pas d'altération

Instance d'un objet[modifier | modifier le wikicode]

Il en est tout autrement avec les instances d'un objet transmis en paramètre. Dans ce cas, le mécanisme d'appel de la fonction envoie un pointeur sur l'objet, et la fonction a toute lattitude pour opérer des modifications sur les propriétés ou données de l'objet.

Objet modifié
function modif_array(tab)
{
   tab[0] = "c'est pas si important";

}
t = Array();
t[0] = "Trés important";
modif_array(t);
alert(t[0]); // Affiche "c'est pas si important" : modification du contenu de l'objet

Fonction sans identificateur[modifier | modifier le wikicode]

Une fonction déclarée sans identificateur est une expression de type "function" qui peut être utilisée comme argument d'une fonction, ou affectée à une variable. L'invocation d'une telle fonction se fait en utilisant le paramètre ou la variable.

Fonction sans identificateur
var superieur = function(a,b){
        return a>b;
    };
 
if (superieur(5,4)) alert("5 > 4");
Fonction sans identificateur
function affiche(objet, f_tostring)
{
    alert( f_tostring(objet) );
}
 
var personne = { "nom":"clinton", "prenom":"bill" };
 
affiche(personne, function(o){
    return o.prenom + " " + o.nom;
    }
    );

Objets prédéfinis