les Fonctions Arguments Object (L'objet arguments) en JavaScript

objet arguments object fonction javascript image

 

Parmi les fonctionnalités du langage Javascript les plus intéressantes se trouvent les arguments objects des fonctions.

Cette caractéristique permet de gérer de manière dynamique les paramètres passés à une fonction. Voici comment maîtriser cette fonctionnalité essentielle.

Qu’est-ce que l’Arguments Object ?

 
 

L’arguments object est une structure de données intégrée à chaque fonction en JavaScript. Il s’agit d’un objet semblable à un tableau (array-like) qui contient tous les arguments passés à une fonction. 

Contrairement à un tableau standard, cet objet n’a pas accès aux méthodes de tableau, mais il possède une propriété length qui indique le nombre d’arguments.

Exemple de l’objet arguments d’une fonction

 
 

function afficherArguments() {
    for (let i = 0; i < arguments.length; i++) {
        console.log(arguments[i]);
    }
}

afficherArguments('JavaScript', 2024, true);

 
 
Dans cet exemple, la fonction afficherArguments peut afficher n’importe quel nombre d’arguments passés lors de son appel, sans pour autant les déclarés avant lors de la création de la fonction. Grâce à une boucle Javascript for, chaque argument est affiché dans la console.
 
 
 

Utilisation Plus Avancée des Arguments Object

 

Manipuler l’arguments object peut apporter une flexibilité incroyable à votre code. Par exemple, vous pouvez créer des fonctions qui acceptent un nombre variable d’arguments ou même des arguments optionnels.

Fonction avec Nombre Variable d’Arguments

 

Voici un exemple de fonction qui calcule la somme de tous les arguments passés :

 
 

function somme() {
    let total = 0;
    for (let i = 0; i < arguments.length; i++) {
        total += arguments[i];
    }
    return total;
}

console.log(somme(1, 2, 3, 4)); // Affiche 10

 
 

Dans ce cas, la fonction somme additionne tous les nombres passés en arguments, quelle que soit leur quantité.

Arguments Optionnels

 

L’arguments object permet également de gérer des arguments optionnels :

 

function saluer(prenom, nom) {
    nom = nom || 'Inconnu';
    console.log('Bonjour ' + prenom + ' ' + nom);
}

saluer('Vito'); // Affiche "Bonjour Vito Inconnu"
saluer('Vito', 'Marchal'); // Affiche "Bonjour Vito Marchal"

 

Ici, si le nom de famille n’est pas fourni, la fonction utilise ‘Inconnu’ par défaut, démontrant ainsi la gestion d’arguments optionnels.

Les Limitations des Arguments Object

 

Bien que très utile, l’arguments object présente certaines limitations. Par exemple, il n’est pas véritablement un tableau et ne peut donc pas bénéficier directement des méthodes de tableau en JavaScript comme map ou filter.

Cependant, vous pouvez facilement convertir un arguments object en un vrai tableau en utilisant Array.prototype.slice.call(arguments) ou l’opérateur de déstructuration [...arguments]. (voir article sur le destructuring en JavaScript)

 

Conversion en Tableau pour l’utilisation des méthodes des tableaux :

 
 

function utiliserTableau() { let args = Array.prototype.slice.call(arguments); args.forEach(arg => console.log(arg)); } utiliserTableau('JavaScript', 'Node.js', 'Angular');
 
 En convertissant les arguments en tableau, vous accédez à toutes les méthodes de tableau, offrant ainsi encore plus de flexibilité.
 
 

Remplacer L’objet arguments avec les Paramètres Rest

 

Pour les développeurs cherchant à optimiser encore davantage leur code, les paramètres rest avec Javascript offrent une alternative moderne aux arguments object. Les paramètres rest permettent de passer un nombre indéfini d’arguments sous forme de tableau.

Exemple de Paramètres Rest

 
 
function multiplier(multiplier, ...nombres) {
    return nombres.map(nombre => nombre * multiplier);
}

console.log(multiplier(2, 1, 2, 3)); // Affiche [2, 4, 6]

 
Les paramètres rest simplifient aussi de la même manière le traitement des arguments multiples, rendant le code plus lisible et maintenable. Un article complet est disponible sur ce sujet.
 
 

Mise en garde

 

La recommandation de limiter le nombre d’arguments dans une fonction à un maximum de trois fait partie des bonnes pratiques pour écrire du code propre (clean code). Cette pratique vise à améliorer la lisibilité, la maintenabilité et la testabilité du code. Cependant, il peut y avoir des cas où passer plus de trois arguments est justifié. Voici pourquoi et comment gérer ces situations de manière propre :

Dans ce cas Pourquoi Passer Plus de Trois Arguments ?

 

Complexité du Problème

 

Certaines fonctions doivent traiter des problèmes complexes nécessitant de nombreuses informations pour accomplir leur tâche. Par exemple, une fonction de configuration pourrait avoir besoin de plusieurs paramètres pour être flexible.

Utilisation Pratique

 

Lorsque les arguments sont logiquement distincts et qu’il n’est pas pratique de les combiner, il peut être nécessaire de passer plusieurs arguments.

Exemple

Considérez une fonction qui doit initialiser une connexion à une base de données avec plusieurs paramètres de configuration.

 
 
function connecter(host, port, user, password, database) {
    // Code pour établir une connexion
    console.log(`Connecting to ${host}:${port} as ${user}`);
}

 

Dans cet exemple, chaque paramètre est essentiel et distinct.

Comment Gérer Plus de Trois Arguments de Manière Propre

 
 

Utiliser un Objet de Paramètres

 

Une approche courante pour gérer de nombreux arguments est de les regrouper dans un objet. Cela rend l’appel de la fonction plus lisible et permet de passer des arguments optionnels plus facilement.

 
function connecter({ host, port, user, password, database }) {
    // Code pour établir une connexion
    console.log(`Connecting to ${host}:${port} as ${user}`);
}

connecter({
    host: 'localhost',
    port: 3306,
    user: 'admin',
    password: 'secret',
    database: 'test_db'
});

 
 

Exemple avec Valeurs Par Défaut

Vous pouvez également fournir des valeurs par défaut pour certains paramètres, ce qui simplifie l’utilisation de la fonction.

function connecter({
    host = 'localhost',
    port = 3306,
    user = 'root',
    password = '',
    database = ''
} = {}) {
    // Code pour établir une connexion
    console.log(`Connecting to ${host}:${port} as ${user}`);
}

connecter({
    user: 'admin',
    password: 'secret',
    database: 'test_db'
});

 

Avantages de cette manière de faire

  1. L’utilisation d’un objet pour les paramètres améliore la lisibilité de l’appel de la fonction.
  2. Les paramètres peuvent être optionnels et avoir des valeurs par défaut.
  3. Il est facile d’ajouter de nouveaux paramètres sans changer la signature de la fonction.

 

Voici Maintenant Un Exemple de Gestion des Paramètres Optionnels avec Arguments object (L’objet arguments)

 

Cela si vous devez absolument utiliser l’arguments object pour sa flexibilité, assurez-vous d’être clair dans la documentation et les commentaires de votre code.

 
 
function configurerServeur() {
    let config = {
        host: arguments[0] || 'localhost',
        port: arguments[1] || 80,
        secure: arguments[2] || false
    };
    console.log(config);
}

configurerServeur('exemple.com', 8080, true); // { host: 'exemple.com', port: 8080, secure: true }

 
 
 

A retenir :

 

Néanmoins limiter le nombre d’arguments d’une fonction à trois autant que possible pour un code propre et lisible. Toutefois, lorsqu’une fonction nécessite plus d’arguments, regroupez-les dans un objet pour maintenir la lisibilité et la flexibilité. Il existe encore d’autre approche de découpe de fonctions pour un code clean (code propre) peut être le sujet d’un autre article.

Tout en sachant que l’objet d’arguments en javascript permet de donner un nombre aléatoire d’arguments pesez le pour et le contre de cette méthode dans vos programmes. Cette approche assure un équilibre entre les bonnes pratiques de programmation et les besoins pratiques de votre application.

Vous avez maintenant une compréhension approfondie des arguments objects en JavaScript, ainsi que des astuces pour les exploiter pleinement.

Pour les développeurs avides de perfectionner leurs compétences en JavaScript,..

 

J’offre ce Guide Bonus Exclusif

 

En allant plus loin, avec cette pépite rien que pour Toi !

Voici un guide complet le KIt JavaScript Pro, où tu verras des techniques pour performer en programmation Js.

Ce guide te permettra de perfectionner tes compétences et de devenir un expert JavaScript. Ne le rate pas et développe ton expertise !

En adoptant ce qu’il contient, tu rends ton apprentissage de JavaScript plus performant avec une plus grande facilité tous les jours . Voici de quoi enrichir tout de suite ton savoir-faire avec ce guide complet qui t’attend !

 
 

Quelques liens en supplément de cette article

Voici ma Chaîne YouTube sur la programmation et le métier de développeur : https://www.youtube.com/@Developpeur-Pro

Voici un Canal ou je partage sur LinkedIn des informations sur le développement : https://www.linkedin.com/company/developpeur-pro

Retrouve ici de nombreux articles sur le code et le métier de développeur : https://developpeur-pro.com/articles-developpeur

Si vous avez aimé l’article, vous êtes libre de le partager : )

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *