Javascript para novatos 15º

Javascript para novatos 15º

publicado en: Diseño web | 0

En este segundo capítulo dedicado a la Programación Orientada a Objetos vamos a conocer un poco más sobre las propiedades y los métodos.

Las propiedades

Ahora que ya sabemos cómo definir y acceder a una propiedad, vamos a ver qué más podemos hacer con ellas.

Si tenemos que cambiar el valor de una propiedad tan solo debemos asignarle un nuevo valor como haríamos con una variable.

cliente1.edad = 24;

 

De igual manera podemos añadir una nueva propiedad a la instancia.

cliente1.telefono = 688808080;

En el caso de que queramos eliminar una propiedad, deberemos utilizar el operador «delete».

 

delete cliente1.apellido;

Nota:

Estos cambios sólo afectarán a la instancia que estamos modificando, no al objeto constructor. Más adelante veremos cómo añadir propiedades y métodos al constructor con «prototype».

Los métodos

Los métodos son las acciones que pueden ejecutar los objetos. Como ya adelantamos anteriormente los métodos son funciones dentro de objetos. Más concretamente son funciones almacenadas como propiedades de un objeto.

Existen dos maneras de incluir esas funciones en nuestros objetos:

1 – Directamente cuando definimos el método

Guardando en la propiedad que representa al método una función anónima. La función anónima no posee un nombre propio sino que adopta el del método que la contiene.

Sintaxis metodo en objeto
15.1 Sintaxis metodo en objeto

Ejemplo:

var cliente1 = {
      nombre: "Juan",
      edad: 30,
      saludar: function() { alert("Hola " + cliente1.nombre); }
};
 
cliente1.saludar();

En el ejemplo de arriba hemos definido un método llamado «saludar». Para ello simplemente hemos colocado dos puntos «:» entre el nombre del método y la función.

Posteriormente para llamar al  método colocamos el nombre del objeto seguido de un punto y del nombre del método, para finalizar escribimos dos paréntesis «()».

De similar manera definimos un método en un constructor. La diferencia radica al igual que con las propiedades en el uso de «this».

function Persona (valorNombre, valorApellido, valorEdad) {
      this.nombre = valorNombre; 
      this.saludar = function () {alert("Hola " + this.nombre)}; // Método
};
 
var cliente1 = new Persona("Ander", "Sagasta", 34);
 
cliente1.saludar(); // Accedemos al método

2 – Asignando una función ya existente

Asignando al método el nombre de la función creada previamente.

Sintaxis metodo llamando a funcion
15.2 Sintaxis metodo llamando a funcion

Ejemplo:

function fSaludar (nombre){
       alert("Hola " + nombre);
}; // Se declara la función con un parámetro
 
var cliente1 = {
       saludar: fSaludar // Asignamos la función al método 
};
 
cliente1.saludar("Santi"); // Invocamos el método y le pasamos unargumento

En el ejemplo de la parte superior también hemos añadido un parámetro a la función, al invocar el método le hemos pasado el argumento como si de una función cualquiera se tratase.
De igual manera se trabajaría con los objetos constructores. Vamos con un ejemplo.

function fSaludar (nombre){
       alert("Hola " + nombre);
       }; // Se declara la función
 
 function Persona (){ 
       this.saludar= fSaludar; // Creamos constructor y asignamos la función al método
 };
 
 var cliente1 = new Persona(); // Creamos instancia
 
 cliente1.saludar("Paco"); // Invocamos instancia pasándole un argumento

Importante:

En el momento de asignar una función a un método, no se deben poner los paréntesis al final de la función.

También podemos acceder a las propiedades del objeto desde el método con «this».

function fSaludar (){
      alert("Hola " + this.nombre);
}; // Se declara la función

function Persona (valorNombre){
      this.nombre = valorNombre;
      this.saludar = fSaludar;
}; // Creamos constructor y asignamos la función al método

var cliente1 = new Persona("Ander"); // Creamos instancia pasándole un argumento

cliente1.saludar(); // Invocamos instancia

Como podemos ver en el ejemplo, el método accede a la propiedad gracias a «this».

Objetos dentro de objetos

También tenemos la posibilidad de crear objetos dentro de otros objetos.

var objetoCine = {
       nombre : "Cine Apolo",
       localidad : "Londres",
       objetoCartelera : {
             sala1 : "pelicuala1",
             sala2 : "pelicuala2"
       }  // Objeto dentro de objeto
};

alert(objetoCine.objetoCartelera.sala2);

El objeto interno lleva dos puntos “:” en vez del signo igual “=” antes de las llaves.

Para acceder a los objetos internos tan solo tenemos que concatenar los respectivos nombres con el signo punto.

Y hasta aquí el segundo capítulo dedicado a la Programación Orientada a Objetos, en el siguiente conoceremos cómo funciona la herencia y los prototipos en la POO.

 


Ir a Javascript para novatos 16ª parte

Share on LinkedInShare on FacebookShare on Google+Tweet about this on Twitter

Dejar una opinión