Hantering av JavaScript-fel: SyntaxError: missing ) after argument list

Fortsatt i vår serie om hantering av JavaScript-fel ska vi idag titta närmare på Missing Parenthesis After Argument List JavaScript-felet. Missing Parenthesis After Argument List-felet kan uppstå av en mängd olika anledningar, men liksom de flesta SyntaxErrors-felen dyker det ofta upp när det finns ett skrivfel, en operatör saknas eller en sträng inte har escapats på rätt sätt.

I den här artikeln ska vi undersöka Missing Parenthesis After Argument List-felet lite mer i detalj, bland annat var det passar in i JavaScript Exception-hierarkin och vad som orsakar att sådana fel uppstår. Nu kör vi!

Den tekniska genomgången

• Alla JavaScript-felobjekt är ättlingar till Error-objektet, eller ett ärvt objekt därifrån.
• Objektet SyntaxError är ärvt från Error-objektet.
• Felet Missing Parenthesis After Argument List är en särskild typ av SyntaxError-objekt.

När ska du använda det?

Som nämndes i inledningen kan Missing Parenthesis After Argument List-felet uppstå av olika skäl. Oftast handlar det om ett skrivfel eller en glömd operatör av något slag. För att bättre illustrera detta kan vi bara utforska några enkla exempel.

En mycket typisk åtgärd i JavaScript är att concatenate flera strängar tillsammans för att bilda en större sträng. Detta kan utföras med hjälp av en enkel + operator mellan två strängar: console.log("Hello " + "world");

Och du kan också sammanfoga strängar inline med hjälp av syntaxen för backtick (`) och parentes ({}): console.log(`Hello ${worldVar}`);

Oavsett hur det görs accepterar många JavaScript-metoder ett obegränsat antal argument (t.ex. strängar), inklusive metoden console.log(). I exemplet nedan kan du se vad som händer om vi glömmer att inkludera någon form av sammanlänkning för våra två strängar:

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

Resultatet är att vi omedelbart producerar ett Missing Parenthesis After Argument List-fel:

Uncaught SyntaxError: missing ) after argument list

Som du kanske märker skickade vi två argument till console.log(), men vi separerade dem inte med ett typiskt kommatecken (,), och vi sammanlänkar inte heller våra två strängvärden tillsammans med någon av ovanstående metoder. Detta gör att JavaScript analyserar vår kod utan problem, tills den når slutet av den första strängen (is:") och går vidare till nästa argument (name). Eftersom vi inte har sagt att den ska sammanfoga eller förvänta sig ytterligare ett argument genom att använda en kommaseparator, förväntar sig JavaScript att det är slutet på vår argumentlista till console.log()-metoden, och finner att vår avslutande parentes saknas ()), vilket ger upphov till ett Missing Parenthesis After Argument List-fel.

Lösningen beror på hur vi vill att vår kod ska uppträda, men i det här fallet, eftersom vi överlämnar argument till console.log(), kan vi åstadkomma sammanfogning direkt eller genom att helt enkelt lägga till en kommaseparator. Kommaseparatorn är generellt sett mer läsbar för våra syften, så låt oss välja det alternativet:

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

Detta ger oss vår namnutgång som förväntat:

Name is: Jane Doe

En ganska enkel lösning, förvisso, men det är problemet med Missing Parenthesis After Argument List-felet, och med SyntaxErrors i allmänhet. De är alla så uppenbara när de väl upptäcks, men om inte din kodredigerare analyserar och utvärderar din kod för syntaxfel i farten är det ofta lätt att missa dem tills du testar koden själv.

Det är också värt att notera att Missing Parenthesis After Argument List-felet, precis som andra SyntaxErrors, inte enkelt kan fångas upp av det typiska try-catch-blocket. Eftersom problemet är syntax, misslyckas JavaScript-motorns försök att exekvera den problematiska koden i exakt det ögonblicket. Detta innebär vanligtvis att den inte når den punkt i utförandet där den kan fortsätta till catch-delen av blocket, eftersom den inte vet hur den ska analysera den korrekt. Detta kan man komma runt genom att förflytta utförandet genom olika filer och lager, men för alla grundläggande syften är catching SyntaxErrors en stor utmaning.

Om du vill dyka ännu djupare in i förståelsen av hur dina tillämpningar hanterar JavaScript-fel kan du kolla in det revolutionerande verktyget Airbrake för spårning av JavaScript-fel, som ger dig varningar i realtid och omedelbar insikt i vad som gick fel med din JavaScript-kod.