conceptos adicionales a la programación orientada a objetos con javascript
TRANSCRIPT
![Page 1: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/1.jpg)
Programación orientada a objetos con JavaScript
![Page 2: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/2.jpg)
La palabra reservada this
Con this indicamos que estamos trabajando “con este” objeto, sin necesidad de nombrarlo.
![Page 3: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/3.jpg)
ConstructoresOOP con JavaScript
![Page 4: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/4.jpg)
Constructores
En JavaScript todo el código que se encuentre dentro de una función se ejecuta inmediatemente y se puede considerar un “constructor”. O sea, no hay constructor propiamente dicho.
![Page 5: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/5.jpg)
UMLOOP con JavaScript
![Page 6: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/6.jpg)
UML
El lenguaje unificado de modelado o Unified Modeling Language (UML) permite visualizar las clases y las relaciones entre ellas.
![Page 7: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/7.jpg)
UML
En JavaScript, el constructor y el nombre de l clase son los mismos.Luego se enumeran las propiedades y posteriormente los métodos.
![Page 8: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/8.jpg)
UML
Aunque en JS no se definen los tipos de dato, en el UML se indica el tipo de mismo.Si el método no regresa ningún valor, se indica con :void.
![Page 9: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/9.jpg)
Modificadores de accesoOOP con JavaScript
![Page 10: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/10.jpg)
Modificadores de acceso
En JavaScript, en específico en ECMAScript 5 y anteriores, no hay modificadores de acceso, por lo que todas las propiedades y métodos son públicos.
![Page 11: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/11.jpg)
Modificadores de acceso
En JavaScript las funciones creadas dentro de la “clase” o mejor llamado métodos, son consideradas como otra variable.
![Page 12: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/12.jpg)
Referencias a clases externasOOP con JavaScript
![Page 13: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/13.jpg)
Referencias externas
En JavaScript, podemos definir un método dentro de una “clase” y tener el código fuera de la misma, es decir, escribir el código en una función externa.
![Page 14: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/14.jpg)
PrototypingOOP con JavaScript
![Page 15: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/15.jpg)
Prototyping
En JavaScript podemos añadir propiedades y métodos a una “clase” por medio del comando prototype.A la acción de añadir propiedades o métodos a una clase se le conoce como “prototyping”.
![Page 16: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/16.jpg)
Prototyping
Al usar prototype, no se duplica el código en las diferentes instancias creadas, pero todos pueden utilizar estos recursos añadidos.
![Page 17: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/17.jpg)
Prototyping
En JavaScript, todas las funciones tienen un propiedad llamada prototype, que es a su vez un objeto.
![Page 18: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/18.jpg)
Prototyping
Se puede utilizar prototype solo después de haber creado la función de la clase, no antes.
![Page 19: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/19.jpg)
Prototyping
Es una práctica común crear las propiedades dentro de la función de la clase, y añadir los métodos con prototype.
![Page 20: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/20.jpg)
Prototyping
SI nosotros modificamos un método haciendo referencia a una instancia, sólo será modificado o sobreescrito (overwriting) esa instancia, y no todas las demás instancias.
![Page 21: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/21.jpg)
Propiedades y métodos estáticosOOP con JavaScript
![Page 22: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/22.jpg)
Propiedades y métodos estáticos
Una propiedad estática no es otra cosa que una variable añadida a la función de la clase (sin prototype), pero por lo general se escriben con mayúsculas.
![Page 23: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/23.jpg)
Propiedades y métodos estáticos
Un método estático no es otra cosa que una función añadida a la función de la clase (sin prototype).
![Page 24: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/24.jpg)
Propiedades y métodos estáticos
En ambos casos pueden ser llamados sin necesidad de crear una instancia, sólo referenciarla con el nombre de la función clase.
![Page 25: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/25.jpg)
Propiedades privadasOOP con JavaScript
![Page 26: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/26.jpg)
Propiedades privadas
Aunque JavaScript no tiene modificadores de acceso propiamente dichos como los demás lenguajes orientados a objetos, podemos hacer propiedades privadas si las definimos dentro de la función de clase con la palabra reservada var.
![Page 27: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/27.jpg)
Propiedades privadas
Es una buena práctica diferencias a estas propiedades de alguna manera. Por lo general se le antepone un guión bajo en el nombre.
![Page 28: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/28.jpg)
Espacio de nombres o name space
OOP con JavaScript
![Page 29: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/29.jpg)
OOP con JavaScript
Un espacio de nombres (name space) es un contenedor que permite asociar toda la funcionalidad de un determinado objeto con un nombre único.
![Page 30: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/30.jpg)
OOP con JavaScript
En JavaScript un espacio de nombres es un objeto que permite asociarse a métodos, propiedades y objetos.
![Page 31: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/31.jpg)
OOP con JavaScript
La idea de crear namespace en JavaScript es simple: Crear un único objeto global para las variables, métodos y funciones, convirtiéndolos en propiedades de ese objeto.
![Page 32: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/32.jpg)
OOP con JavaScript
El uso de los namespace permite minimizar el conflicto de nombres con otros objetos haciéndolos únicos dentro de nuestra aplicación.
![Page 33: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/33.jpg)
OOP con JavaScript
JavaScript es un lenguaje basado en prototipos que no contiene ninguna declaración de clase, como se encuentra, por ejemplo, en C++ o Java.
![Page 34: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/34.jpg)
OOP con JavaScript
En su lugar, JavaScript utiliza funciones como clases. Definir una clase es tan fácil como definir una función.
![Page 35: Conceptos adicionales a la programación orientada a objetos con JavaScript](https://reader031.vdocuments.site/reader031/viewer/2022030318/58ef8db91a28ab053b8b4663/html5/thumbnails/35.jpg)
OOP con JavaScript
Como una buena práctica, los nombres de espacio los escribiremos con mayúsculas.