Métodos de objeto en JavaScript

Los métodos de objeto en javascript nos permiten realizar acciones con los objetos de forma sencilla. En esta entrada aprenderemos los conceptos básicos para usarlos.

Acceso a los métodos de objeto

Para acceder a un método de objeto primero debemos de crearlo, para ello utilizaremos la siguiente sintaxis:

NombreDelMetodo : function() { lineas de código }

Para acceder a un método de objeto utilizaremos la siguiente sintaxis:

nombreDelMetodo.function()

En el siguiente ejemplo vamos a ver cómo se utilizan las dos sintaxis para poder trabajar con los métodos:

<!DOCTYPE html>
<html>
<body>
<span id="demo"></span>
<script>
var persona = {
    nombre: "Juana",
    apellido : "Calamidad",
    nombreCompleto : function() {
       return this.nombre + " " + this.apellido;
    }
};
document.getElementById("demo").innerHTML = persona.nombreCompleto();
</script>
</body>
</html>

Aquí podemos observar perfectamente como creamos el método dentro de las propiedades del objeto persona y cómo luego accedemos a él utilizando la sintaxis apropiada.

Métodos nativos de JavaScript

Como ya hemos visto anteriormente existen funciones y métodos nativos de JavaScript como toUpperCase() que se pueden utilizar no solo en las propiedades normales si no tambien en aquellas que mantienen un método de la siguiente forma:

document.getElementById("demo").innerHTML = persona.nombreCompleto().toUpperCase();

Cambiando propiedades

Se pueden cambiar propiedades desde un método por medio de una función constructora, tal y como vemos en el siguiente ejemplo:

<!DOCTYPE html>
<html>
<body>
<span id="demo"></span>
<script>
function persona(nombre,apellido,edad,colorOjos) {
    this.nombre = nombre;
    this.apellido = apellido;
    this.edad = edad;
    this.colorOjos = colorOjos;
    this.changeName = function (apellido) {
        this.apellido = apellido;
    }
}
var personaje = new persona("Juana","Calamidad",24,"verdes");
personaje.changeName("Smith");
document.getElementById("demo").innerHTML =
"El apellido del personaje; " + personaje.apellido;
</script>
</body>
</html>

Aquí hemos creado el constructor del objeto y luego hemos creado el objeto por medio de la palabra reservada new.

Dentro del constructor hemos introducido el método changeName que tiene como argumento un apellido, por lo que al invocar el método en la línea 16 podemos cambiar la propiedad apellido del objeto.

Esto como introducción a los métodos de los objetos esta bien para empezar, pero la POO (programación orientada a objetos) es muy amplia y hasta cierto punto compleja, por lo que si quieres puedes profundizar mucho más en ella.