Gestione degli errori JavaScript: SyntaxError: missing ) after argument list

Continuando la nostra serie sulla gestione degli errori JavaScript, oggi guarderemo da vicino l’errore JavaScript Missing Parenthesis After Argument List. L’errore Missing Parenthesis After Argument List può verificarsi per una varietà di ragioni, ma come la maggior parte dei SyntaxErrors, si presenta comunemente quando c’è un errore di battitura, manca un operatore, o una stringa non è sfuggita correttamente.

In questo articolo esamineremo l’errore Missing Parenthesis After Argument List un po’ più in dettaglio, compreso dove si colloca nella gerarchia di JavaScript Exception, e cosa causa il verificarsi di tali errori. Andiamo!

Il resoconto tecnico

• Tutti gli oggetti di errore JavaScript sono discendenti dell’oggetto Error, o un oggetto ereditato da esso.
• L’oggetto SyntaxError è ereditato dall’oggetto Error.
• L’errore Missing Parenthesis After Argument List è un tipo specifico di oggetto SyntaxError.

Quando dovresti usarlo?

Come detto nell’introduzione, l’errore Missing Parenthesis After Argument List può verificarsi per una varietà di ragioni. La maggior parte delle volte, il problema riguarda un errore di battitura o un operatore dimenticato di qualche tipo. Per illustrare meglio questo, possiamo solo esplorare alcuni semplici esempi.

Un’azione molto tipica in JavaScript è quella di concatenate più stringhe insieme per formare una stringa più grande. Questo può essere eseguito usando un semplice operatore + tra due stringhe: console.log("Hello " + "world");

Oppure, puoi anche concatenare stringhe in linea, usando la sintassi backtick (`) e bracket ({}): console.log(`Hello ${worldVar}`);

A prescindere da come viene fatto, molti metodi JavaScript accettano un numero indefinito di argomenti (come le stringhe), incluso il metodo console.log(). Nell’esempio qui sotto, notate cosa succede se dimentichiamo di includere qualsiasi forma di concatenazione per le nostre due stringhe:

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); }}

Il risultato è che produciamo immediatamente un errore Missing Parenthesis After Argument List:

Uncaught SyntaxError: missing ) after argument list

Come potete notare, abbiamo passato due argomenti a console.log(), ma non li abbiamo separati con una tipica virgola (,), né abbiamo concatenato i nostri due valori stringa insieme con uno dei metodi di cui sopra. Questo fa sì che JavaScript analizzi il nostro codice senza problemi, finché non raggiunge la fine della prima stringa (is:") e passa all’argomento successivo (name). Poiché non gli abbiamo detto di concatenare, né di aspettarsi un altro argomento attraverso l’uso di un separatore di virgole, JavaScript si aspetta che questa sia la fine della nostra lista di argomenti per il metodo console.log(), e scopre che manca la nostra parentesi di chiusura ()), lanciando così un errore Missing Parenthesis After Argument List.

La soluzione dipende da come vogliamo che il nostro codice si comporti, ma in questo caso, poiché stiamo passando argomenti a console.log(), possiamo ottenere la concatenazione direttamente, o semplicemente aggiungendo un separatore di virgole. Il separatore a virgola è generalmente più leggibile per i nostri scopi, quindi scegliamo questa opzione:

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); }}

Questo ci dà l’output del nostro nome come previsto:

Name is: Jane Doe

Una correzione piuttosto semplice, per essere sicuri, ma questo è il problema con l’errore Missing Parenthesis After Argument List, e con SyntaxErrors in generale. Sono tutti così ovvi una volta scoperti, ma a meno che il vostro editor di codice non analizzi e valuti il vostro codice per gli errori di sintassi al volo, è spesso facile non vederli fino a quando non testate voi stessi il codice.

E’ anche da notare che, come altri SyntaxErrors, l’errore Missing Parenthesis After Argument List non può essere facilmente catturato dal tipico blocco try-catch. Poiché il problema è sintattico, il tentativo del motore JavaScript di eseguire il codice problematico fallisce in quel preciso momento. Questo di solito significa che non raggiunge il punto dell’esecuzione in cui può continuare alla porzione catch del blocco, poiché non sa come analizzarlo correttamente. Questo può essere aggirato spostando l’esecuzione attraverso diversi file e livelli, ma per tutti gli intenti e gli scopi di base, catching SyntaxErrors è una grande sfida.

Per capire ancora più a fondo come le vostre applicazioni affrontano gli errori JavaScript, date un’occhiata al rivoluzionario strumento di tracciamento degli errori JavaScript Airbrake per avvisi in tempo reale e una comprensione istantanea di cosa è andato storto nel vostro codice JavaScript.