Gestion des erreurs JavaScript : SyntaxError : missing ) after argument list

Poursuivant notre série sur la gestion des erreurs JavaScript, nous allons aujourd’hui examiner de près l’erreur JavaScript Missing Parenthesis After Argument List. L’erreur Missing Parenthesis After Argument List peut se produire pour une variété de raisons, mais comme la plupart des SyntaxErrors, elle surgit couramment lorsqu’il y a une faute de frappe, qu’un opérateur est manquant ou qu’une chaîne de caractères n’est pas échappée correctement.

Dans cet article, nous examinerons l’erreur Missing Parenthesis After Argument List un peu plus en détail, y compris où elle se situe dans la hiérarchie Exception de JavaScript, et ce qui provoque de telles erreurs. C’est parti !

Le tour d’horizon technique

• Tous les objets d’erreur JavaScript sont des descendants de l’objet Error, ou un objet hérité de celui-ci.
• L’objet SyntaxError est hérité de l’objet Error.
• L’erreur Missing Parenthesis After Argument List est un type spécifique d’objet SyntaxError.

Quand faut-il l’utiliser ?

Comme mentionné dans l’introduction, l’erreur Missing Parenthesis After Argument List peut se produire pour diverses raisons. La plupart du temps, le problème est lié à une faute de frappe ou à un opérateur oublié, quel qu’il soit. Pour mieux illustrer cela, nous pouvons juste explorer quelques exemples simples.

Une action très typique en JavaScript est de concatenateplusieurs chaînes de caractères ensemble pour former une chaîne plus grande. Ceci peut être effectué en utilisant un simple opérateur + entre deux chaînes de caractères : console.log("Hello " + "world");

Ou, vous pouvez également concaténer des chaînes de caractères en ligne, en utilisant la syntaxe du backtick (`) et des crochets ({}) : console.log(`Hello ${worldVar}`);

Quoi qu’il en soit, de nombreuses méthodes JavaScript acceptent un nombre indéfini d’arguments (tels que des chaînes de caractères), y compris la méthode console.log(). Dans l’exemple ci-dessous, remarquez ce qui se passe si nous oublions d’inclure une forme de concaténation pour nos deux chaînes de caractères:

var printError = function(error, explicit) { console.log(` ${error.name}: ${error.message}`);}try { var name = "Jane Doe"; console.log("Name is:" name);} catch (e) { if (e instanceof SyntaxError) { printError(e, true); } else { printError(e, false); }}

Le résultat est que nous produisons immédiatement une erreur Missing Parenthesis After Argument List:

Uncaught SyntaxError: missing ) after argument list

Comme vous pouvez le remarquer, nous avons passé deux arguments à console.log(), mais nous ne les avons pas séparés par une virgule typique (,), et nous n’avons pas concaténé nos deux valeurs de chaîne de caractères ensemble avec l’une des méthodes ci-dessus. JavaScript analyse donc très bien notre code, jusqu’à ce qu’il atteigne la fin de la première chaîne (is:") et passe à l’argument suivant (name). Puisque nous ne lui avons pas dit de concaténer, ni de s’attendre à un autre argument par l’utilisation d’un séparateur de virgule, JavaScript s’attend à ce que ce soit la fin de notre liste d’arguments à la méthode console.log(), et trouve que notre parenthèse fermante est manquante ()), lançant ainsi une erreur Missing Parenthesis After Argument List.

La solution dépend de la façon dont nous voulons que notre code se comporte, mais dans ce cas, parce que nous passons des arguments à console.log(), nous pouvons réaliser la concaténation directement, ou en ajoutant simplement un séparateur de virgule. Le séparateur de virgule est généralement plus lisible pour nos objectifs, alors allons-y avec cette option:

var printError = function(error, explicit) { console.log(` ${error.name}: ${error.message}`);}try { var name = "Jane Doe"; console.log("Name is:", name);} catch (e) { if (e instanceof SyntaxError) { printError(e, true); } else { printError(e, false); }}

Cela nous donne notre sortie de nom comme prévu:

Name is: Jane Doe

Une correction plutôt simple, pour être sûr, mais c’est le problème avec l’erreur Missing Parenthesis After Argument List, et avec SyntaxErrors en général. Elles sont toutes si évidentes une fois découvertes, mais à moins que votre éditeur de code analyse et évalue votre code pour les erreurs de syntaxe à la volée, il est souvent facile de les manquer jusqu’à ce que vous testiez le code vous-même.

Il est également intéressant de noter que, comme les autres SyntaxErrors, l’erreur Missing Parenthesis After Argument List ne peut pas être facilement capturée par le bloc try-catch typique. Puisque le problème est syntaxique, la tentative du moteur JavaScript d’exécuter le code problématique échoue à ce moment précis. Cela signifie généralement qu’il n’atteint pas le point d’exécution où il peut continuer à la partie catch du bloc, car il ne sait pas comment l’analyser correctement. Cela peut être contourné en déplaçant l’exécution à travers différents fichiers et couches, mais pour toutes les intentions de base, catching SyntaxErrors est un défi majeur.

Pour plonger encore plus profondément dans la compréhension de la façon dont vos applications traitent les erreurs JavaScript, consultez l’outil révolutionnaire de suivi des erreurs JavaScript Airbrake pour des alertes en temps réel et un aperçu instantané de ce qui s’est mal passé avec votre code JavaScript.