Tipos de datos JavaScript.

Tipos primitivos y
objeto. Significado de undefined, null, NaN.
Ejemplos (CU01112E)
Escrito por Csar Krall

Resumen:

Entrega
n12: Orientacin
programador web: JavaScript desde cero".

sobre

el

curso "Tutorial

bsico

del

Codificacin aprenderaprogramar.com: CU01112E

TIPOS DE VARIABLES EN JAVASCRIPT

JavaScript permite trabajar con variables, como es habitual en los lenguajes de programacin.
Adems permite trabajar con objetos, un tipo de informacin ms compleja que una variable
simple. De forma general podramos referirnos a tipos de datos en JavaScript, y dentro de esos
tipos de datos tenemos dos grupos fundamentales: los tipos primitivos y los tipos objeto.

TIPOS DE DATOS EN JAVASCRIPT

Los tipos de datos JavaScript se dividen en dos grupos: tipos primitivos y tipos objeto.
Los tipos primitivos incluyen: cadenas de texto (String), variables booleanas cuyo valor puede
ser true o false (Boolean) y nmeros (Number). Adems hay dos tipos primitivos especiales que
son Null y Undefined. Es en los tipos primitivos donde vamos a centrarnos por el momento.

Los tipos objeto son datos interrelacionados, no ordenados, donde existe un nombre de objeto y
un conjunto de propiedades que tienen un valor. Un objeto puede ser creado especficamente por
el programador. No obstante, se dice que todo aquello que no es un tipo primitivo es un objeto y
en este sentido tambin es un objeto, por ejemplo, una funcin. Lo estudiaremos ms adelante.
Existen algunos objetos especiales con un comportamiento que estudiaremos por separado
ms adelante: el objeto global, el objeto prototipo, los arrays, las funciones, las clases
definidas por el programador, las clases predefinidas JavaScript (como la clase Date para manejo
de fechas, la clase RegExp para manejo de expresiones regulares y bsqueda de patrones en
texto, y la clase Error para almacenar informacin relacionada con los errores) y otros.
Los primeros lenguajes de programacin no usaban objetos, solo variables. Una variable
podramos decir que es un espacio de la memoria del ordenador a la que asignamos un
contenido que puede ser bsicamente un valor numrico (slo nmeros, con su valor de clculo)
o de tipo carcter o cadena de caracteres (valor alfanumrico que constar slo de texto o de
texto mezclado con nmeros).
Como ejemplo podemos definir una variable a que contenga 32 y esto lo escribimos como a =
32. Posteriormente podemos cambiar el valor de a y hacer a = 78. O hacer a equivalente al
valor de otra variable b as: a = b.
Dado que antes hemos dicho que un objeto tambin ocupa un espacio de memoria: en qu se
parecen y en qu se diferencia un objeto de una variable? Consideraremos que las variables son
entidades elementales: un nmero, un carcter, un valor verdadero o falso mientras que los
objetos son entidades complejas que pueden estar formadas por mucha informacin. Pero ambas
cosas ocupan lo mismo: un espacio de memoria (que puede ser ms o menos grande).
El siguiente esquema es un resumen sobre tipos de datos en JavaScript.

Este esquema no es necesario aprendrselo de memoria en todos sus detalles, aunque s lo

iremos memorizando poco a poco a medida que lo utilicemos. A continuacin mostramos el
mismo esquema en formato de tabla:

TIPOS DE
DATOS EN

NOMBRE

DESCRIPCIN
aprenderaprogramar.com

TIPOS
PRIMITIVOS

String

Cadenas de texto

Number

Valores numricos

Boolean

true false

Null
Undefined

Tipos
predefinidos
de JavaScript
JAVASCRIPT

TIPOS
OBJETO

Tipos
definidos por
el
programador /
usuario

Arrays

Tipo especial, contiene null

Tipo especial, contiene undefined

Date (fechas)
RegExp (expresiones regulares)
Error (datos de error)

Funciones simples
Clases

Serie de elementos o formacin

tipo vector o matriz. Lo
consideraremos un objeto
especial que carece de mtodos.
Objeto global

Objetos
especiales

Objeto prototipo
Otros

No te preocupes ahora por conocer todos los posibles tipos de datos de JavaScript ni su
significado. Los iremos estudiando y trabajando con ellos poco a poco.
Frente a otros lenguajes fuertemente tipados (las variables tienen un tipo declarado y no pueden
cambiar

el

tipo

de

contenido

que

almacenan)

como

Java,

JavaScript

es

un

un

lenguaje dbilmente tipado: las variables pueden no ser de un tipo especfico y cambiar el tipo
de contenido que almacenan.

Expresiones simples
Una expresin regular se construye con una cadena de texto que representa el formato que debe
cumplir el texto. En javascript se puede hacer de dos formas, bien instanciando una clase RegExp
pasndo como parmetro la cadena de formato, bien poniendo directamente la cedena de formato,
en vez de entre comillas, entre /
?

1// Son equivalentes

2var reg = new RegExp("aa")
3var reg = /aa/
Ver si un texto tiene una determinada secuencia de letras o nmeros fija es fcil. La expresin
simplemente es esa cadena y podemos ver si un texto la tiene usando el mtodo match() de ese
texto
?

1var reg = /javascript/;

2"hola javascript".match(reg);

3// devuelve un array de 1 elemento ["javascript"], indicando que s existe esa cadena d
4
5"adios tu".match(reg);
6// devuelve null, indicando que no existe javascript dentro de "adios tu".

No es necesario definir la expresin regular antes, podemos hacerlo as

?

1"hola javascript".match(/javascript/);
2// Devuelve ["javascript"]
Y para verificar si existe o no la cadena, podemos poner directamente un if
?

1if ("hola javascript".match(/javascript/) {

2

// Pasar por aqu, porque un array con un elemento se evalua como true en el if

3}
4
5if ("adios tu".match(/javascript/) {
6

// No pasa por aqu, null se evala como false en el if.

7}

Caracteres no alfabticos ni numricos

Algunos de los caracteres no numricos ni alfabticos tienen un significado especial (lo vemos ms
adelante), como por ejemplo [ ] { } ( ) * . ^ $ etc. No podemos ponerlos tal cual si forman parte de
nuestro formato, debemos "escaparlos" poniendo \ delante
?

1"esto es un *".match(/\*/);
2// Devuelve ["*"] indicando que existe un asterisco.

Conjunto opcional de caracteres

A veces nos da igual que una letra, por ejemplo, sea mayscula o minscula, o queremos que sea
una vocal, o un dgito. Cuando queremos que una de las letras de nuestro texto pueda ser una
cualquiera de un conjunto de letras determinado, las ponemos entre [] en nuestra expresin. Por
ejemplo, si nos vale "Javascript" y "javascript", podemos poner la expresin como /[Jj]avascript/
para indicar que nos vale J mayscula o j minscula

1"javascript con minuscula".match(/[Jj]avascript/);

2// S encuentra la cadena
3"Javascript con minuscula".match(/[Jj]avascript/);
4// Tambin la encuentra.
Si los caracteres vlidos son varios y van ordenados segn el juego de caracteres, podemos poner
el primero y el ltimo separados por un -. Por ejemplo, [a-z] vale para cualquier letra minscula, [09] para cualquier dgito y [a-zA-Z] para cualquier letra mayscula o minscula
?

1"aa2bb".match(/[0-9]/);

// Encuentra el 2, devolviendo ["2"].

Podemos hacer lo contrario, es decir, que la letra no est en ese conjunto de caracteres. Se hace
poniendo el juego de caracteres que no queremos entre [^ y ]. Por ejemplo, para no dgitos
pondramos [^0-9]
?

1"22 33".match(/[^0-9]/); // Encuentra el espacio en blanco, devolviendo [" "]

Conjuntos habituales
Hay varios conjuntos que se usan con frecuencia, como el de letras [a-zA-Z], el de dgitos [0-9] o el
de espacios en blanco (espacio, tabulador, etc). Para estos conjuntos la expresin regular define
formas abreviadas, como

\w para letras, equivalente a [a-zA-Z]

\W para no letras, equivalente a [^a-zA-Z]
\d para dgitos, equivalente a [0-9]
\D para no dgitos, equivalente a [^0-9]
\s para espacios en blanco (espacios, tabuladores, etc).
\S para no espacios en blanco.
ver Metacharacters

Por ejemplo
?

1"aa2bb".match(/\d/); // Encuentra el 2, devolviendo ["2"]

Repeticin de caracteres
Podemos querer buscar por ejemplo un conjunto de tres digitos, podemos hacerlo repitiendo tres
veces el \d
?

1"aa123bb".match(/\d\d\d/);

// Encuentra el 123, devolviendo ["123"]

pero esta forma es un poco engorrosa si hay muchos caracteres y es poco verstil. Las
expresiones regulares nos permiten poner entre {} un rango de veces que debe repetirse. por
ejemplo

/\d{3}/
/\d{1,5}/
/\d{2,}/

Busca 3 dgitos en la cadena

Busca entre 1 y 5 dgitos en la cadena.
Busca 2 dgitos o ms en la cadena.

como ejemplos
?

1"1234".match(/\d{2}/);
2["12"]
3
4"1234".match(/\d{1,3}/);
5["123"]
6
7"1234".match(/\d{3,10}/)
8["1234"]
Tambin suele haber rangos habituales como 0 o ms veces, 1 o ms veces, 0 1 vez. Estos
rangos habituales tienen caracteres especiales que nos permiten ponerlos de forma ms simple.

* equivale a 0 o ms veces {0,}

+ equivale a 1 o ms veces {1,}
? equivale a 0 1 vez {0,1}

Por ejemplo
?

1"a2a".match(/a\d+a/);

// Encuentra a2a

2"a234a".match(/a\d+a/);

// Encuentra a234a

Cosas como * o + encuentran el mximo posible de caracteres. Por ejemplo, si nuestro patrn es
/a+/ y nuestra cadena es "aaaaa", el resultado ser todo la cadena
?

1"aaaaa".match(/a+/);

// Devuelve ["aaaaa"]

Para hacer que se encuentre lo menos posible, se pone un ? detrs. As por ejemplo, si nuestra
expresin regular es /a+?/ y nuestra cadena es "aaaaa", slo se encontrar una "a"
?

1"aaaaa".match(/a+?/);

// Devuelve ["aaaaa"]

El comportamiento inicial se conoce como "greedy" o codicioso, en el que el patrn intenta coger la
mayor parte de la cadena de texto posible. En segundo comportamiento se conoce como
"nongreedy" o no codicioso, en el que el patrn coge lo menos posible de la cadena.

Extraer partes de la cadena

A veces nos intersa no slo saber si una cadena cumple un determinado patrn, sino extraer
determinadas partes de l. Por ejemplo, si una fecha est en el formato "27/11/2012" puede
interesarnos extraer los nmeros. Una expresin regular que vale para esta cadena puede ser
?

1/\d{1,2}\/\d{1,2}\/\d{4}/
suponiendo que el da y el mes puedan tener una cifra y que el ao sea obligatoriamente de 4
cifras. En este caso

1"27/11/2012".match(/\d{1,2}\/\d{1,2}\/\d{4}/);
nos devuelve un array con un nico elemento que es la cadena "27/11/2012". Para extraer los
trozos, nicamente debemos poner entre parntesis en la expresin regular aquellas partes que
nos interesan. Es decir,
?

1/(\d{1,2})\/(\d{1,2})\/(\d{4})/
Si ahora ejecutamos el mtodo match() con la misma cadena anterior, obtendremos un array de 4
cadenas. La primera es la cadena completa que cumple la expresin regular. Los otros tres
elementos son lo que cumple cada uno de los parntesis
?

1"27/11/2012".match(/(\d{1,2})\/(\d{1,2})\/(\d{4})/);

// Devuelve el array

2["27/11/2012", "27", "11", "2012"]

Los parntesis tambin nos sirven para agrupan un trozo y poner detrs uno de los smbolos de
cantidades. Por ejemplo
?

1"xyxyxyxy".match(/(xy)+/);

// Se cumple, hay xy una o ms veces.

Usar lo encontrado en la expresin

Las partes de la cadena que cumplen la parte de expresin regular entre parntesis, se pueden
reutilizar en la misma expresin regular. Estas partes encontradas se van almacenando en \1, \2, \
3... y podemos usarlas. Este posibilidad es realmente interesante si queremos por ejemplo, verificar
que una cadena de texto va cerrada entre comillas del mismo tipo, es decir, queremos buscar algo
como 'esto' o "esto", pero no nos vale 'esto".
La expresin regular para buscar una cadena entre este tipo de comillas puede ser /(['"]).*\1/ es
decir, buscamos una ' o una " con ['"]. Hacemos que lo que se encuentre se guarde metindolo
entre parntesis (['"]) y a partir de ah nos vale cualquier conjunto de caracteres terminados en \1,
que es lo que habamos encontrado al principio.

1"'hola tu' turur".match(/(["']).*\1/); // Devuelve ["'hola tu'", "'"]

2"\"hola tu' turur".match(/(["']).*\1/); // Devuelve null, la cadena comienza con " y te

Ignorar lo encontrado
A veces nos interesa encontrar una secuencia que se repita varias veces seguidas y la forma de
hacerlo es con los parntesis, por ejemplo, si ponemos /(pa){2}/ estamos buscando "papa". Para
evitar que esos parntesis guarden lo encontrado en \1, podemos poner ?:, tal que as /(?:pa){2}/,
de esta forma encontraremos "papa", pero se nos devolver el trozo "pa" encontrado ni lo
tendremos disponible en \1. Compara las dos siguientes
?

1"papa".match(/(pa){2}/);

// Devuelve ["papa", "pa"]

2"papa".match(/(?:pa){2}/);

// Devuelve ["papa"]

Posicin de la expresin
A veces nos interesa que la cadena busque en determinadas posiciones. Las expresiones
regulares nos ofrecen algunos caracteres espaciales para esto.
^ indica el principo de cadena, por ejemplo, /^hola/ vale si la cadena "hola" est al principio
?

1"hola tu".match(/^hola/);

// Devuelve ["hola"]

2"pues hola tu".match(/^hola/);

// Devuelve null

$ es el final de la cadena, por ejemplo /tu$/ vale si la cadena termina en "tu"

?

1"hola tu".match(/tu$/);

// Devuelve ["tu"]

2"hola tu turur".match(/tu$/);

// Devuelve null

\b indica una frontera de palabra, es decir, entre un caracter "letra" y cualquier otra cosa como
espacios, fin o principio de linea, etc. De esta forma, por ejemplo, /\bjava\b/ buscar la palabra java,
pero ignorar javascript
?

1"java es gay".match(/\bjava\b/);

// Devuelve ["java"]

2"javascript es gay".match(/\bjava\b/);

// Devuelve null

\B es lo contrario de \b, as por ejemplo, /\bjava\B/ buscar una palabra que empiece por "java",
pero no sea slo java sino que tenga algo ms
?

1"java es gay".match(/\bjava\B/);

// Devuelve null

2"javascript es gay".match(/\bjava\B/); // Devuelve ["java"]

(?=expresion) sirve para posicionar el resto de la expresin regular y buscar antes o depus. Por
ejemplo si queremos buscar un nmero que vaya delante de km, podemos hacer esto /\d+(?=
km)/ , es decir, uno o ms dgitos seguidos de un espacio y las letras km. La diferencia con esta
expresin (/\d+ km/) es que en el primer caso slo casan con la expresin los nmeros, mientras
que en el segundo caso se incluye tambin el " km"
?

1"11 millas 10 km".match(/\d+(?= km)/);

// Devuelve ["10"]

2"11 millas 10 km".match(/\d+ km/);

// Devuelve ["10 km"]

Hay que tener cuidado si buscamos detrs, porque como el trozo (?=expresion) no se tiene en
cuenta, sigue contando para el resto de la expresin. Por ejemplo, si queremos extraer la parte
decimal de "11.22" podramos pensar en hacer esto /(?=\.)\d+/ , pero no funciona porque el .
decimal no se "consume" con (?=\.), as que debemos tenerlo en cuenta y ponerlo detrs, as /(?
=\.)\.\d+/
?

1"11.22".match(/(?=\.)\d+/); // Devuelve null

2"11.22".match(/(?=\.)\.\d+/); // Devuelve [".22"]

(?!expresion) hace lo contrario que (?=expresion), es decir, busca una posicin donde no se
cumpla expresin. Por ejemplo, para sacar lo que no sean km de "11 km, 12 km, 14 m" podemos
poner /\d{2}(?! km)/
?

1"11 km 12 km 14 m".match(/\d{2}(?! km)/); // Devuelve ["14"]

Flags de opciones
Hemos visto que una expresin regular es /expresion/. Podemos poner algunos flags detrs,
bsicamente unas letras que cambian algo el comportamiento
i es para ignorar maysculas y minsculas
?

1"hola".match(/HOLA/);

// Devuelve null

2"hola".match(/HOLA/i);

// Devuelve ["hola"]

g es para buscar todas las veces posibles la expresin, no slo una vez
?

1"11 223 44 66 77".match(/\d+/);

// Devuelve ["11"]

2"11 223 44 66 77".match(/\d+/g);

// Devuelve ["11", "223", "44", "66", "77"]

m busca en cadenas con retornos de carro \n considerando estos como inicios de linea ^ o fin $
?

1"hola\ntu".match(/^tu/);

// Devuelve null

2"hola\ntu".match(/^tu/m);

// Devuelve ["tu"]

3"hola\ntu".match(/hola$/);

// Devuelve null

4"hola\ntu".match(/hola$/m);

// Devuelve ["hola"]

Otros mtodos de cadena y de expresin regular

Para todos estos ejemplos hemos usado el mtodo match() de la clase String, ya que nos devuelve
un array con las cosas que se encuentran y viendo los resultados es la forma ms clara de ver
cmo funcionan las distintas partes de la expresin regular. Sin embargo, tanto String como
RegExp tienen otros mtodos tiles

String.search(/expresion/)
Devuelve la posicin donde se encuentra esa expresin dentro de la cadena, o -1 si no se
encuentra.

String.replace(/expresion/,cadena)
Busca el trozo de cadena que casa con la expresin y la reemplaza con lo que le pasemos en el
parmetro cadena. Este mtodo tiene adems un detalle intresante. Cuando en la expresin
regular tenemos parntesis para extraer algunas partes de la cadena, la misma expresin regular
recuerda qu ha encontrado. En el mtodo replace, si en la cadena de segundo parmetro
aparecen cosas como $1, $2, utilizar lo encontrado.
?

1"ho3la".replace(/\d/,"X"); // Devuelve "hoXla"

2"ho3la".replace(/(\d)/,"-$1-"); // Devuelve "ho-3-la"

String.match(/expresion/)
Ya lo hemos visto.

String.split(/expresion/)
Usa lo que sea que case con la expresin como separador y devuelve un array con la cadena
partida en trozos por ese separador
?

1"hola, dos tres; cuatro".split(/\W+/); // Devuelve ["hola", "dos", "tres", "cuatro"]

RegExp constructor
Adems de crear las expresiones regulares con /expresion/flags, podemos hacerlo con un new de
la clase RegExp, por ejemplo new RegExp("expresion","flags").
?

1var reg = new RegExp("\\d+","g");

2
"11 22 33".match(reg);

// Devuelve ["11","22","33"]

Hay que fijarse en este caso que las \ debemos escaparlas, con \\

RegExp.exec()
Es similar a match() de String, pero slo devuelve un resultado y hace que RegExp guarde la
posicin en la que lo ha encontrado. Sucesivas llamadas a exec(), nos iran devolviendo los
siguientes resultados
?

1
2
3

var reg = new RegExp("\\d+");

reg.exec("11 22 33");

// Devuelve ["11"]

reg.exec("11 22 33");

// Vuelve a devolver ["11"], puesto que no hay flag g

4
5
6

var reg = new RegExp("\\d+","g");

reg.exec("11 22 33");

// Devuelve ["11"]

7 reg.exec("11 22 33");

// Vuelve a devolver ["22"], puesto que si hay flag g

8 reg.exec("11 22 33");

// Vuelve a devolver ["33"], puesto que si hay flag g

9 reg.exec("11 22 33");

// Devuelve null, ya no hay ms resutlados.

1 reg.exec("11 22 33");
0

// Vuelve a devolver ["11"], despues de devolver null la RegE

RegExp.test()
Similar a exec(), pero en vez de devolver lo encontrado, devuelve true si ha encontrado algo o false
si no. Como la expresin regular recuerda las bsquedas anteriores, sucesivas llamadas a test()
pueden devolver resultados distintos
?

1var reg = new RegExp("\\d+","g");

2reg.test("11 22 33");

// Devuelve true, porque encuentra el ["11"]

3reg.test("11 22 33");

// Vuelve a devolver true, porque encuentra el ["22"], puesto

4reg.test("11 22 33");

// Vuelve a devolver true, porque encuentra el ["33"], puesto

5reg.test("11 22 33");

// Devuelve false, ya no hay ms resutlados.

6reg.test("11 22 33");

// Vuelve a devolver true, porque vuelve a encontrar el ["11"]