Comprobar los tipos de datos almacenados en variables Javascript

  • Por
Funciones útiles para validar variables Javascript comprobando el tipo de datos que contienen, basadas en populares funciones de PHP.
Javascript es un lenguaje levemente tipado, donde no se especifica el tipo en las variables que se declaran y donde a lo largo de la vida de una variable se puede cambiar su tipo sin problemas. La mayoría de los lenguajes que se utilizan en el desarrollo de páginas web son como Javascript, por eso deben existir mecanismos para comprobar qué tipo tiene una variable, porque dependiendo de ello podremos hacer unas cosas con ella u otras.

Además, en las tareas comunes que se realizan en Javascript, muchas veces nos encontraremos con la necesidad de validar entrada enviada por el usuario, por medio de formularios, o entradas que nos vengan por medio de otras fuentes, como una respuesta Ajax. Para todo ello nos vendrá bien conocer algunas maneras de comprobar el tipo de las variables.

En este artículo vamos a presentar algunas de las funciones que nos ofrecen las librerías php.js, un paquete de cientos de funciones análogas a las que se disponen en el lenguaje de programación PHP, pero portadas a Javascript y disponibles de manera gratuita. Veremos pues varias funciones como isset(), is_object(), is_array(), is_integer(), etc. que están disponibles en PHP y que se utilizan bastante. Todas esas funciones, gracias al mencionado proyecto php.js, se pueden descargar en un paquete para Javascript y utilizar luego en nuestros desarrollos para lo que necesitemos.

Saber el tipo de una variable en Javascript con métodos nativos

En realidad Javascript ya dispone de un operador nativo para poder reconocer el tipo de dato que hay dentro de una variable. Se trata del operador typeof que está explicado en el artículo Control de tipos de variables. Lo cierto es que typeof es bastante útil para reconocer el tipo de cualquier variable, pero PHP dispone de varias funciones similares que nos permiten averiguar el tipo de una manera un poco distinta y quizás en ciertos casos, un poco más sencilla.

Además, typeof no tiene mecanismos para saber, por ejemplo, si una variable es de tipo array. Si le preguntamos el tipo de un array nos responderá que es un objeto y quizás eso puede llevarnos a un problema a la hora de tratar esa variable.

Además, existen otras funciones nativas de Javascript, como parseInt() o isNaN(), que también nos sirven para validar enteros o variables numéricas, por ejemplo. Estas funciones ya se han explicado en artículos como Funciones nativas Javascript, donde se explican varias funciones, o en Validar entero en campo de formulario, donde se muestra una posible manera de validar un entero, o incluso se ha discutido sobre la conveniencia o no de usar esas funciones en el artículo ¿Es Ventajoso el uso de ParseInt para validar números?

Funciones PHP, portadas a Javascript, para comprobar tipos de variables en Javascript

A modo de presentación de algunas de las posibilidades que ofrece el proyecto php.js vamos a mostrar el uso de otra serie de funciones que podemos utilizar libremente para comprobar los tipos de las variables en Javascript.

Nota: Para los que estén familiarizados con PHP resultará familiar el conjunto de funciones que vamos a utilizar, pues son bastante básicas. En concreto el paquete php.js nos permite comprobar el tipo de las variables por medio del siguiente listado de funciones: is_array, is_binary, is_bool, is_buffer, is_callable, is_double, is_float, is_int, is_integer, is_long, is_null, is_numeric, is_object, is_real, is_resource, is_scalar, is_string, is_unicode, y la útil función isset.

Todas esas funciones, portadas a Javascript, las tenemos que descargar desde la página del proyecto php.js y para ello, como ya se explicó en el artículo sobre las librerías de phpjs.org, lo más cómodo es acceder a la sección "Compile" y seleccionar los checkbox de las funciones que deseamos utilizar. Con ello conseguiremos descargar, en un solo archivo de código Javascript, las funciones marcadas y, automáticamente, también aquellas que se requieran para su buen funcionamiento.

Vamos a comenzar definiendo una serie de variables, que luego utilizaremos para comprobar sus tipos.

var indefinido;
var entero = 45;
var boleano = true;
var unarray = [12,92,"hola"];
var cadena = "una cadena";
var cadenanumerica = "23.89002";
var objeto = {
   algo: 23,
   otracosa: "loquesea"
}

Ahora podemos utilizar las mencionadas funciones para comprobar los tipos de las variables. Podemos comenzar por revisar el uso de la función is_integer, para comprobar si una variable es de tipo entero.

//validar si una variable es de tipo entero
if (is_integer(entero)){
   alert (entero + " es entero")
}else{
   alert (entero + " NO es entero")
}
if (is_integer(boleano)){
   alert (boleano + " es entero")
}else{
   alert (boleano + " NO es entero")
}

Nota: Si intentas validar una cadena de caracteres como "34322" (que contiene un entero, pero que en realidad el tipo es un string) con is_integer(), obtendrás como respuesta que NO es un entero. En el caso que obtengas el dato por medio de una entrada de datos del usuario, por ejemplo a través de un campo de un formulario, siempre será realmente una variable de tipo string, con lo que validarlo como entero por medio de is_integer() no te servirá. En lugar de ello te sugiero que utilices la función ctype_digit(), también de PHP y que está disponible en Javascript en el proyecto php.js, que sirve para comprobar si en una cadena hay sólo caracteres de dígitos numéricos.

Ahora podemos ver cómo se usaría la función is_string() para comprobar si una variable contiene un dato de tipo cadena de caracteres.

//validar si una variable es cadena (string)
if (is_string(cadena)){
   alert("cadena es un string");
}else{
   alert("cadena NO es un string")
}
if (is_string(entero)){
   alert("entero es un string");
}else{
   alert("entero NO es un string")
}

La función que veremos ahora, is_array(), es bastante interesante, pues si solicitamos su tipo por medio del operador typeof, Javascript nos diría que se trata de un objeto y no de un array. Con la función is_array() de las librerías php.js podemos estar seguros de que esa variable es un array.

//validar si una variable es de tipo array
if (is_array(unarray)){
   alert ("unarray es array")
}else{
   alert ("unarray NO es array")
}
if (is_array(boleano)){
   alert ("boleano es array")
}else{
   alert ("boleano NO es array")
}

Ahora veamos una función para comprobar si la variable es de tipo objeto.

//validar si una variable es un objeto
if (is_object(objeto)){
   alert ("objeto es un objeto");
}else{
   alert ("objeto NO es un objeto");
}
if (is_object(unarray)){
   alert ("unarray es un objeto");
}else{
   alert ("unarray NO es un objeto");
}

Por último vamos a ver varios usos de la función isset(), que resulta muy útil en PHP, pues nos sirve para saber si una variable está definida, comprobación clave para realizar antes de operar con ella. En el caso de su variante para Javascript no es tan interesante, pues el simple hecho de preguntar si existe esa variable, en caso que la variable no se encuentre definida, resultaría en un error del script, algo que no ocurre en PHP. No obstante, isset() puede servirnos perfectamente para comprobar el estado de una variable, que podría ser undefined (no definido), o cualquier otro valor. Así mismo, también nos sirve para comprobar si existe una propiedad de un objeto.

Por ejemplo, podemos utilizar el literal undefined y comprobarlo con isset() para ver lo que pasa. En este caso nos dirá que no existe undefined.

//probando el uso de isset
if (isset(undefined)){
   alert("Existe el literal undefined");
}else{
   alert("NO existe el literal undefined");
}

Una variable podría tener el valor undefined y en ese caso es como si no estuviera inicializada, aunque sí declarada y por tanto evaluarla no dará un error. Recordemos que la variable indefinido se había declarado pero no se le había asignado ningún valor, con lo que su valor es undefined.

if (isset(indefinido)){
   alert("Existe la variable indefinido");
}else{
   alert("NO existe la variable indefinido");
}

La función isset() también nos sirve para comprobar si se ha definido una propiedad de un objeto. Por ejemplo, en este caso estamos comprobando si existe una propiedad llamada "nada" en el objeto definido anteriormente. Como no existe esa propiedad, obtendremos el mensaje informando de ello.

if (isset(objeto.nada)){
   alert("Existe la propiedad de objeto.nada");
}else{
   alert("NO existe la propiedad de objeto.nada");
}

Por último probamos con isset() a ver si existe una variable cualquiera.

if (isset(cadena)){
   alert("Existe la variable cadena");
}else{
   alert("NO existe la variable cadena");
}

Para acabar, dejamos un enlace a una página con todo el código en funcionamiento que hemos relatado en el artículo.