Manejo de errores de JavaScript: SyntaxError: missing ) after argument list

Continuando con nuestra serie de manejo de errores de JavaScript, hoy vamos a ver de cerca el error de JavaScript Missing Parenthesis After Argument List. El error Missing Parenthesis After Argument List puede ocurrir por una variedad de razones, pero como la mayoría de los SyntaxErrors, comúnmente aparece cuando hay un error tipográfico, falta un operador, o una cadena no se escapa correctamente.

En este artículo vamos a examinar el error Missing Parenthesis After Argument List con un poco más de detalle, incluyendo donde encaja en la jerarquía de JavaScript Exception, y lo que hace que se produzcan tales errores.

El resumen técnico

• Todos los objetos de error de JavaScript son descendientes del objeto Error, o un objeto heredado del mismo.
• El objeto SyntaxError se hereda del objeto Error.
• El error Missing Parenthesis After Argument List es un tipo específico de objeto SyntaxError.

¿Cuándo debe utilizarlo?

Como se mencionó en la introducción, el error Missing Parenthesis After Argument List puede ocurrir por una variedad de razones. La mayoría de las veces, el problema está relacionado con un error tipográfico o un operador olvidado de algún tipo. Para ilustrar mejor esto, podemos explorar algunos ejemplos sencillos.

Una acción muy típica en JavaScript es concatenate juntar varias cadenas para formar una más grande. Esto se puede realizar utilizando un simple operador + entre dos cadenas: console.log("Hello " + "world");

O también se pueden concatenar cadenas en línea, utilizando la sintaxis de la palanca de retroceso (`) y el corchete ({}): console.log(`Hello ${worldVar}`);

Independientemente de cómo se haga, muchos métodos de JavaScript aceptan un número indefinido de argumentos (como cadenas), incluyendo el método console.log(). En el ejemplo siguiente, fíjese en lo que ocurre si nos olvidamos de incluir cualquier forma de concatenación para nuestras dos cadenas:

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

El resultado es que producimos inmediatamente un error Missing Parenthesis After Argument List:

Uncaught SyntaxError: missing ) after argument list

Como puede observar, pasamos dos argumentos a console.log(), pero no los separamos con la típica coma (,), ni concatenamos nuestros dos valores de cadena con uno de los métodos anteriores. Esto hace que JavaScript analice nuestro código sin problemas, hasta que llega al final de la primera cadena (is:") y pasa al siguiente argumento (name). Como no le hemos dicho que concatene, ni que espere otro argumento mediante el uso de un separador de comas, JavaScript espera que ese sea el final de nuestra lista de argumentos para el método console.log(), y encuentra que falta nuestro paréntesis de cierre ()), lanzando así un error Missing Parenthesis After Argument List.

La solución depende de cómo queramos que se comporte nuestro código, pero en este caso, como estamos pasando argumentos a console.log(), podemos lograr la concatenación directamente, o simplemente añadiendo un separador de comas. El separador de comas es generalmente más legible para nuestros propósitos, así que vamos a ir con esa opción:

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

Esto nos da nuestro nombre de salida como se esperaba:

Name is: Jane Doe

Una solución bastante simple, para estar seguro, pero ese es el problema con el error Missing Parenthesis After Argument List, y con SyntaxErrors en general. Todos son tan obvios una vez descubiertos, pero a menos que su editor de código analice y evalúe su código en busca de errores de sintaxis sobre la marcha, a menudo es fácil pasarlos por alto hasta que pruebe el código usted mismo.

También vale la pena señalar que, como otros SyntaxErrors, el error Missing Parenthesis After Argument List no puede ser fácilmente capturado por el típico bloque try-catch. Como el problema es de sintaxis, el intento del motor de JavaScript de ejecutar el código problemático falla en ese momento exacto. Esto suele significar que no llega al punto de ejecución en el que puede continuar con la parte catch del bloque, ya que no sabe cómo analizarlo correctamente. Esto se puede solucionar desplazando la ejecución a través de diferentes archivos y capas, pero para todos los propósitos básicos, catching SyntaxErrors es un desafío importante.

Para profundizar aún más en la comprensión de cómo sus aplicaciones se ocupan de los errores de JavaScript, echa un vistazo a la revolucionaria herramienta de seguimiento de errores de JavaScript Airbrake para alertas en tiempo real y una visión instantánea de lo que salió mal con su código JavaScript.