Tipos de datos en Javascript

Los tipos en Javascript son una representación de los datos, ya que no requiere que las variables declaren su tipo, porque todos los tipos se convierten de forma automática

Tipo booleano

El tipo booleano simplemente distingue entre dos estados, un estado de éxito o de activado, valor verdadero, true, y un estado de fracaso o de desactivado, valor falso, false

Tipos numéricos

Los tipos numéricos los podemos dividir en reales y enteros

Tipo numérico entero

• Decimal

  enteros en base 10

  Tanto positivos como negativos

• Hexadecimal

  enteros en base 16

  Se coloca antes del número en base 16 0x ó 0X

• Octal

  enteros en base 8

  Colocamos un cero antes de dicho número en octal

Tipo numérico real

Los reales se componen de una parte entera y otra fraccionaria separada por un punto de la anterior

La parte fraccionaria puede estar compuesta por un indicador de exponente E o e seguido de un número entero que indica el valor del exponente

var1 = 20; //decimal
var2 = 0x14; //hexadecimal
var3 = 024; //octal

//real
var4 = 25.478;
var5 = 2.3E45;
var6 = 5.6E-2;
var7 = -3.789;

Tipo string

Un string es una cadena de caracteres delimitadas por comillas

Las comillas serán simples o dobles atendiendo a una determinada regla

Por defecto se usarán comillas dobles ("), pero si alguna sentencia a de ir incluida entre dichas comillas, si esa sentencia contiene un string o a su vez otra sentencia que también deba ir delimitada por dichas comillas, estas comillas serán entonces comillas simples (‘)

confirm("¿Estas seguro?");
OnMouseOver = "confirm('¿Estas seguro?');

Por otro lado, hay que tener en cuenta la escritura de caracteres especiales en lo que denominamos secuencias de escape

La secuencia de escape comienza siempre con el carácter \ y a continuación se escribe otro carácter que representa el código especial o el número en octal o hexadecimal de su código ASCII

Las secuencias de escape representan un único carácter en las strings en donde aparecen

Arrays

Podemos crear arrays a los que le daremos un nombre y a los que accederemos con un índice que comenzará desde el elemento número 1 (no desde el 0 como en Java o en C / C++)

En los arrays al igual que con las variables no existen tipos predeterminados. Para crear un array es necesario definir una función como la que veremos a continuación:

function CreaArray(n){
    this.length = n;
    for (var i=1; i<=n; i++){
        this[i] = 0;
    }
    return this;
}

Comentar sobre la función que la palabra reservada this hace referencia a la variable a actual, es decir, a la variable que contendrá el array

Por otro lado, observar que los array tienen una propiedad length que nos muestra la longitud de dicho array

Por último mostrar el uso de dicha función:

mi_array = new CreaArray (2);
// new: Creamos una instancia del objeto, en este caso un array
// Llenamos el array
mi_array[1] = "Pepe";
mi_array[2] = 35;
longitud = mi_array.length; //longitud será 2

Objetos

Los objetos se componen de un conjunto de valores, propiedades y un conjunto de métodos aplicados a esos valores

Son estos métodos los que nos permiten modificar el estado de dicho objeto, es decir, el valor de sus propiedades

En JavaScript existen objetos predefinidos

A parte, el programador también puede crear sus propios objetos

Para hacer uso de las propiedades de un objeto basta con utilizar la siguiente notación:

mi_objeto.propiedad

Esto se verá con más claridad en el siguiente ejemplo, en el cual tenemos un objeto Universitario en el que tenemos las propiedades: Nombre, Apellido, Edad y Facultad. Suponiendo que tenemos una variable Uni1 que contiene en un momento determinado un objeto Universitario:

Uni1.Nombre = "Pedro";
Uni1.Apellido = "Navarro";
Uni1.Edad = 13;
Uni1.Facultad = "Telecomunicaciones";

Pero no sólo podemos acceder a las propiedades de un objeto mediante la notación expuesta anteriormente, ya que, existe una relación entre los objetos y los arrays, puesto que podemos acceder a un objeto como si este fuera un array y sus elementos fueran los propiedades de dicho objeto en el orden en que se definieron

Uni1[1] = "Pedro";
Uni1[2] = "Navarro";
Uni1[3] = 13;
Uni1[4] = "Telecomunicaciones";

Uni1["Nombre"] = "Pedro";
Uni1["Apellido"] = "Navarro";
Uni1["Edad"] = 13;
Uni1["Facultad"] = "Telecomunicaciones";

Este tipo de vectores se denominan arrays asociativos

Un método es una función asignada a un objeto. Así para asignar una función como método de un objeto se utiliza la siguiente sintaxis:

Podemos observar que el nombre del método es la manera en la que queremos nombrar a la función dentro del objeto

Un método puede ser llamado en un contexto mediante la sintaxis:

Objeto.nombreDelMétodo(parámetros);

La palabra reservada this nos permite referenciar al objeto actual

Por ejemplo, supongamos que la función validate permite validar las propiedades de un objeto mediante un mínimo y un máximo asociados; tendremos:

function validate(obj, lowval, hival){
    if((obj.value < lowval) || (obj.value > hival))
        alert("Valor no válido");
}

Se podrá llamar entonces a la función validate a cambio de los valores de un formulario mediante la palabra reservada this y el atributo OnChange que permite detectar los cambios de valores

Esto se hace mediante la marca HTML y el evento:

<input type = "text" name = "edad" OnChange = "validate(this,18,99)">

De manera general, la palabra this se refiere al objeto actual

El cliente y el servidor tienen un conjunto de objetos predefinidos que pueden ser completados mediante nuevos objetos

La creación de un objeto se hace en dos etapas:

1. Definir el objeto mediante una función
2. Crear un objeto mediante la palabra reservada new

Para definir un objeto, se creará una función que permita precisar su nombre, sus funciones y sus métodos asociados

Por ejemplo, si se quiere crear un objeto universitario cuyas propiedades serían nombre, apellido, edad y dni, se definirá la función genérica siguiente:

function Univers(nom, apell, edad, dni){
    this.nom = nom;
    this.apell = apell;
    this.edad = edad;
    this.dni = dni;
}  // this: propiedad del objeto a partir de los argumentos

//La instancia del objeto la crearemos de la siguiente forma:
alumno = new univers("Juan","Delgado",12,44565789);

Las propiedades de un objeto pueden describirse mediante otros objetos

function Nota_M(curso1, curso2, curso3, final){
    this.curso1 = curso1;
    this.curso2 = curso2;
    this.curso3 = curso3;
    this.final = final;
}

Hacemos que el objeto universitario tenga un propiedad del objeto Nota_Media por tanto:

function Univers(nom, apell, edad, dni, exp){
    this.nombre = nom;
    this.apellido = apell;
    this.edad = edad;
    this.dni = dni;
    this.expediente = exp;
}

Por tanto, para acceder a la nota final:

alumno.expediante.final

Cuando se define un objeto, es posible enriquecer su descripción mediante nuevas propiedades

alumno.dni = 44567234;

Ahora la propiedad dni pertenece a la instancia del objeto contenido en alumno

Esta modificación no afectará a los otros objetos del tipo universitario, ya que para añadir una propiedad a un tipo de objeto esta debe figurar en la definición del mismo

La definición de métodos asociados a un objeto puede precisarse en la definición del objeto

Por ejemplo, para el objeto universitario definimos una función que muestre el nombre, apellidos, dni y facultad de un alumno

function Datos(){
    var cadena = this.nombre + " " + this.apellido +
    " " + this.edad + " " + this.dni +
    " " + this.expediente.curso1 + " " +
    this.expediente.curso2 + " " + this.expediente.curso3 +
    " " + this.expediente.final;
    alert(cadena);
}  //this: objeto al que pertenece el método

Esta función se convierte en un método asociado al tipo realizando en su definición lo siguiente:

function Univers(nom, apell, edad, dni, exp){
    this.nombre = nom;
    this.apellido = apell;
    this.edad = edad;
    this.expediente = exp;
    this.dni = dni;
    this.Datos = Datos;
}

Su forma de uso será:

alumno.Datos();

En el siguiente ejemplo se muestra el funcionamiento del tipo universitario que hemos creado

Para ello creamos el siguiente formulario:

<center>
<form id="form1" name="form1">
<table border="1" style="font-size: 7.5px;">
    <thead>
         <tr>
             <th colspan="4"><center>Nota media de la etapa académica</center></th>
         </tr>
     </thead>
        <td><label for="nombre"><strong>Nombre:</strong></label><input type="text" id="nombre" name="nombre" value="ninguno" size="15" /></td>
        <td><label for="apellido"><strong>Primer Apellido:</strong></label><input  type="text" id="apellido" name="apellido" value="ninguno" size="15" /></td>
        <td><label for="edad"><strong>Edad:</strong></label><input type="text" id="edad" name="edad" value="ninguno" size="15" /></td>
        <td><label for="DNI"><strong>DNI:</strong></label><input type="text" id="DNI" name="DNI" value="ninguno" size="15" /></td>
    </tr>
    <tr>        
        <td><label for="nota1"><strong>Primer curso:</strong></label><input type="text" id="nota1" name="nota1" value="0" size="4" /></td>
        <td><label for="nota2"><strong>Segundo curso:</strong></label><input type="text" id="nota2" name="nota2" value="0" size="4" /></td>
        <td><label for="nota3"><strong>Tercer curso:</strong></label><input type="text" id="nota3" name="nota3" value="0" size="4" /></td>
        <td><label for="final"><strong>Nota final:</strong></label><input type="text" id="final" name="final" value="0" size="4" /></td>
    </tr>  
</table>

<input type="button" value=" Ver datos" onClick="Mostrar_Univers(this.form)"></input>
</form>
</center>

La función Mostrar_Univers(form) se define como sigue:

function Mostrar_Univers(form){
    var notas = new Nota_M(form.nota1.value, form.nota2.value,
    form.nota3.value, form.final.value);
    var alumno = new Univers(form.nombre.value, form.apellido.value,
    form.edad.value, form.DNI.value, notas);
    alumno.Datos();
}

Nota No se han comprobado si los datos que se insertan en el formulario son "correctos", es decir, si las notas están entre 0 y 10, si los nombres y apellidos se componen sólo de letras o la edad sea numérica

Valor nulo

En JavaScript a las variables se les puede asignar un valor que indica el valor vacío, este valor es el valor null

La conversión de tipos de datos

Antes que nada, recordar que JavaScript no necesita declaración de tipos

El contenido de la variable se convertirá automáticamente en el transcurso del programa según su uso

El esquema de conversión del tipo se basa en el principio siguiente: el tipo asociado corresponde al del operando de la izquierda

Esto se debe a que la evaluación se realiza de izquierda a derecha

Por ejemplo, supongamos la definición de las variables siguientes:

var una_string = "7";
var un_numero = 42;

Si evaluamos las siguientes expresiones

x = una_string + un_numero;
y = un_numero + una_string;

La primera expresión convertirá la variable un_numero en una cadena de caracteres porque el operando de la izquierda una_string es una cadena de caracteres

Esta expresión concatena las dos cadenas de caracteres y el resultado de x es: "742"

Por el contrario, la segunda expresión convierte la cadena una_string en un valor numérico porque el operando de la izquierda un_numero, es como su propio nombre indica, un número

Esta segunda expresión suma los dos números y el resultado de y es: 49

La conversión de tipos no puede hacerse en todos los casos posibles: ciertas cadenas de caracteres no pueden convertirse en número

Tales conversiones generan un error

Por ejemplo:

var una_string = "Pepe";
var un_numero = 578;
y = un_numero + una_string; // ERROR: Pepe no puede convertirse en número

Tabla que resume la conversión de tipos en JavaScript: