Scribd
Cargar
36 vistas8 páginas

Introducción A JavaScript Orientado A Objetos

Este documento introduce conceptos básicos de programación orientada a objetos en JavaScript. Explica que JavaScript admite OOP a pesar de algunos debates sobre sus diferencias con otros lenguajes. Define clases, objetos, propiedades, métodos y constructores, y muestra ejemplos de cómo crear clases personalizadas, establecer propiedades y métodos, y usar el constructor en JavaScript.

Cargado por

oxidey
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
36 vistas8 páginas

Introducción A JavaScript Orientado A Objetos

Este documento introduce conceptos básicos de programación orientada a objetos en JavaScript. Explica que JavaScript admite OOP a pesar de algunos debates sobre sus diferencias con otros lenguajes. Define clases, objetos, propiedades, métodos y constructores, y muestra ejemplos de cómo crear clases personalizadas, establecer propiedades y métodos, y usar el constructor en JavaScript.

Cargado por

oxidey
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 8

Introducción a JavaScript orientado a objetos

JavaScript dispone de fuertes capacidades de programación orientada a objetos, a


pesar de que han tenido lugar algunos debates respecto a las diferencias de sus
capacidades en comparación con otros lenguajes.

Programación orientada a objetos


La programación orientada a objetos es un paradigma de programación que utiliza
la abstracción para crear modelos basados en el mundo real. Utiliza diversas técnicas de
paradigmas previamente establecidas, incluyendo la modularidad, polimorfismo y
encapsulamiento. Hoy en día, muchos lenguajes de programación (como Java, JavaScript,
C#, C++, Python, PHP, Ruby y Objective-C) soportan programación orientada a objetos
(POO).

La programación orientada a objetos puede considerarse como el diseño de


software a través de un conjunto de objetos que cooperan, a diferencia de un punto de
vista tradicional en el que un programa puede considerarse como un conjunto de
funciones, o simplemente como una lista de instrucciones para la computadora. En la
programación orientada a objetos, cada objeto es capaz de recibir mensajes, procesar
datos y enviar mensajes a otros objetos. Cada objeto puede verse como una pequeña
máquina independiente con un papel o responsabilidad definida.

POO pretende promover una mayor flexibilidad y facilidad de mantenimiento en la


programación y es muy popular en la ingeniería de software a gran escala. Gracias a su
fuerte énfasis en la modularidad, el código orientado a objetos está concebido para ser
más fácil de desarrollar y más fácil de entender posteriormente, prestándose a un análisis
más directo, a una mayor codificación y comprensión de situaciones y procedimientos
complejos que otros métodos de programación menos modulares.

Terminología
Clase

Define las características del Objeto.

Objeto

Una instancia de una Clase.


Propiedad

Una característica del Objeto, como el color.

Método

Una capacidad del Objeto, como caminar.

Constructor

Es un método llamado en el momento de la creación de instancias.

Herencia

Una Clase puede heredar características de otra Clase.

Encapsulamiento

Una Clase sólo define las características del Objeto, un Método sólo define cómo
se ejecuta el Método.

Abstracción

La conjunción de herencia compleja, métodos y propiedades que un objeto debe


ser capaz de simular en un modelo de la realidad.

Polimorfismo

Diferentes Clases podrían definir el mismo método o propiedad.

Programación orientada a objetos de JavaScript


Namespace

Un espacio de nombres es un contenedor que permite asociar toda la


funcionalidad de un determinado objeto con un nombre único. En JavaScript un espacio
de nombres es un objeto que permite a métodos, propiedades y objetos asociarse. La idea
de crear espacios de nombres en JavaScript es simple: Crear un único objeto global para
las variables, métodos, funciones convirtiendolos en propiedades de ese objeto. El uso de
los namespace permite minimizar el conflicto de nombres con otros objetos haciéndolos
únicos dentro de nuestra aplicación.
Un espacio de nombres es un objeto:

Vamos a crear un objeto global llamado MIAPLICACION

En el código de ejemplo comprobamos si MIAPLICACION ya se encuentra definida.


Si es así utilizamos el objeto global MIAPLICACION que existe; si este no existe creamos un
objeto vacío llamado MIAPLICACION que encapsulará métodos, funciones, variables y
otros objetos que vayamos a crear.

// namespace global

var MIAPLICACION = MIAPLICACION || {};

Objetos básicos
JavaScript tiene varios objetos incluidos en su núcleo, como Math, Object, Array y
String. El siguiente ejemplo muestra cómo utilizar el objeto Math para obtener un número
al azar mediante el uso de su método random().

console.log( (Math.random ());

Objetos personalizados
La clase

JavaScript es un lenguaje basado en prototipos que no contiene ninguna


declaración de clase, como se encuentra, por ejemplo, en C + + o Java. Esto es a veces
confuso para los programadores acostumbrados a los lenguajes con una declaración de
clase. En su lugar, JavaScript utiliza funciones como clases. Definir una clase es tan fácil
como definir una función. En el ejemplo siguiente se define una nueva clase llamada
Persona.
function Persona() { }

El objeto (ejemplo de clase)

Para crear un nuevo ejemplo de un objeto obj utilizamos la declaración new obj ,
asignando el resultado (que es de tipo obj ) a una variable para tener acceso más tarde.

En el siguiente ejemplo se define una clase llamada Persona y creamos dos


instancias ( persona1 y persona2 ).

function Persona() {

var persona1 = new Persona();

var persona2 = new Persona();

Por favor, consulta también Object.create para ver un método nuevo y alternativo
de creación de ejemplos.

El constructor

El constructor es llamado en el momento de la creación de la instancia (el


momento en que se crea la instancia del objeto). El constructor es un método de la clase.
En JavaScript, la función sirve como el constructor del objeto, por lo tanto, no hay
necesidad de definir explícitamente un método constructor. Cada acción declarada en la
clase es ejecutada en el momento de la creación de la instancia.

El constructor se usa para establecer las propiedades del objeto o para llamar a los
métodos para preparar el objeto para su uso. Más adelante describiremos como agregar
métodos a clase y sus definiciones ya que se realiza utilizando una sintaxis diferente.

En el siguiente ejemplo, el constructor de la clase Persona muestra un alerta que


dice (Una instancia de persona) cuando se crea la instancia de la clase Persona.
function Persona() {
console.log(“Una instancia de Persona”);
}

var persona1 = new Persona();


var persona2 = new Persona();

La propiedad (atributo del objeto)

Las propiedades son variables contenidas en la clase, cada instancia del objeto
tiene dichas propiedades. Las propiedades deben establecerse a la propiedad prototipo de
la clase (función), para que la herencia funcione correctamente.

Para trabajar con propiedades dentro de la clase se utiliza la palabra reservada this
, que se refiere al objeto actual. El acceso (lectura o escritura) a una propiedad desde
fuera de la clase se hace con la sintaxis: NombreDeLaInstancia.Propiedad. Es la misma
sintaxis utilizada por C++, Java y algunos lenguajes más. (Desde dentro de la clase la
sintaxis es this.Propiedad que se utiliza para obtener o establecer el valor de la
propiedad).

En el siguiente ejemplo definimos la propiedad primerNombre de la clase Persona


y la definimos en la creación de la instancia.

function Persona(primerNombre) {

this.primerNombre = primerNombre;

console.log("Una instancia de Persona");

var persona1 = new Persona("Alicia");

var persona2 = new Persona("Sebastian");

// Muestra el primer nombre de persona1

console.log ("persona1 es " + persona1.primerNombre); // muestra "persona1 es Alicia"

console.log ("persona2 es " + persona2.primerNombre); // muestra "persona2 es


Sebastian"
https://codepen.io/isbelymor/pen/oNbxZBo?editors=1112

Los métodos
Los métodos siguen la misma lógica que las propiedades, la diferencia es que son
funciones y se definen como funciones. Llamar a un método es similar a acceder a una
propiedad, pero se agrega () al final del nombre del método, posiblemente con
argumentos.

En el siguiente ejemplo se define y utiliza el método diHola() para la clase Persona.

function Persona(primerNombre) {

this.primerNombre = primerNombre;

Persona.prototype.diHola = function() {

console.log ("Hola, Soy " + this.primerNombre);

};

var persona1 = new Persona("Alicia");

var persona2 = new Persona("Sebastian");

// Llamadas al método diHola de la clase Persona.

persona1.diHola(); // muestra "Hola, Soy Alicia"

persona2.diHola(); // muestra "Hola, Soy Sebastian"

https://codepen.io/isbelymor/pen/ZEQWeXO?editors=1112

En JavaScript los métodos son objetos como lo es una función normal y se


vinculan a un objeto como lo hace una propiedad, lo que significa que se pueden invocar
desde "fuera de su contexto". Considera el siguiente código de ejemplo:
function Persona(primerNombre) {

this.primerNombre = primerNombre;

Persona.prototype.diHola = function() {

console.log ("Hola, Soy " + this.primerNombre);

};

var persona1 = new Persona("Alicia");

var persona2 = new Persona("Sebastian");

var funcionSaludar = persona1.diHola;

persona1.diHola(); // muestra "Hola, Soy Alicia"

persona2.diHola(); // muestra "Hola, Soy Sebastian"

funcionSaludar(); // muestra "Hola, Soy undefined (ó da un error con el

// TypeError en modo estricto

console.log(funcionSaludar === persona1.diHola); // muestra true (verdadero)

console.log(funcionSaludar === Persona.prototype.diHola); // muestra true (verdadero)

funcionSaludar.call(persona1); // muestra "Hola, Soy Alicia"

https://codepen.io/isbelymor/pen/ZEQWeXO?editors=1112

En el ejemplo se muestran todas las referencias que tenemos de la función


diHola — una de ellas es persona1, otra en Persona.prototype, en la variable
funcionSaludar, etc. — todas se refieren a la misma función. El valor durante una llamada
a la función depende de como realizamos esa llamada. En el común de los casos cuando la
llamamos desde una expresión donde tenemos a la función desde la propiedad del objeto
— persona1.diHola().— Se establece en el objeto que tenemos en la función (persona1),
razón por la cual persona1.diHola() utiliza el nombre "Alicia" y persona2.diHola() utiliza el
nombre "Sebastian". Pero si realizamos la llamada de otra manera, se establecerá de
forma diferente: Llamándola desde una variable —funcionSaludar() — Este establece al
objeto global (windows, en los navegadores). Desde este objeto (probablemente) no tiene
a la propiedad primerNombre, por lo que finalizará con "Hola, Soy indefinido". (El cual se
incluye en modo de código suelto, sino sería diferente [un error] en modo estricto, pero
para evitar confusiones ahora no vamos a entra en detalles.) O podemos establecerla de
forma explicita utilizando Function.call (ó Function.apply), como se muestra al final del
ejemplo funcionSaludar.call(persona1).

También podría gustarte