3.1.1 Explicación del modelo de herencia basada en prototipos de JavaScript
En JavaScript, cada objeto tiene una propiedad interna llamada [[Prototype]] que apunta a otro objeto. Este objeto es conocido como su prototipo. Cuando intentas acceder a una propiedad o método en un objeto, JavaScript primero busca en el propio objeto. Si no encuentra la propiedad o método, busca en el prototipo del objeto, y así sucesivamente, hasta llegar a null.
Ejemplo 1. Como funciona la Herencia Basada en Prototipos. Método directo
El script crea un objeto solacida que representa una solución química ácida.
Este objeto hereda la propiedad reactivo y el método reaccion() del prototipo test.
Luego, el script muestra en la consola y en la página web información sobre las
propiedades de solacida y ejecuta el método reaccion(). El proceso que transcurre es que se evalúa
cualitativamente si una solución cambia el color del indicador de PH a rojo,
lo que indica que es ácida.
Método Directo
a) El enfoque de herencia utilizado en este código es el más directo y común en JavaScript:
- Asignación directa del prototipo: Se asigna explícitamente el objeto test como prototipo de solacida usando __proto__.
- Herencia de propiedades y métodos: El nuevo objeto solacida hereda todas las propiedades y métodos de su prototipo test.
- Adición de propiedades específicas: El objeto solacida puede tener sus propias propiedades y métodos adicionales,
que no se encuentran en el prototipo.
Ventajas del algoritmo
- Flexible: Permite modificar el comportamiento de los objetos en tiempo de ejecución.
- Dinámica: Facilita la creación de objetos personalizados y la extensión de objetos existentes.
- Basada en objetos: Todo en JavaScript es un objeto, incluyendo los prototipos.
Ejemplo 2. Crear un prototipo con el método Object.create
Este enfoque utiliza el método Object.create() para
crear un nuevo objeto que hereda directamente del prototipo especificado.
Es una forma explícita y directa de establecer herencia en JavaScript.
Características principales:
- Prototipo explícito: Con Object.create(), se define explícitamente
que el nuevo objeto hereda de un prototipo específico.
- Sin constructores: Este enfoque no utiliza constructores. En su lugar, se
crean objetos directamente.
- Configuración directa del prototipo: El nuevo objeto está conectado a su
prototipo base (baby en este caso), pero no hay una "función constructora"
que inicialice propiedades dinámicas.
Ventajas del algoritmo:
- Sencillo y claro para establecer relaciones prototípicas.
- Ideal para objetos simples o jerarquías poco profundas.
Ejemplo 3. Herencia con Funciones Constructoras y new
En este enfoque, se define una función constructora para establecer
propiedades únicas por instancia, y se utiliza la propiedad prototype para definir métodos
compartidos. Luego, se llama a la función con new para crear instancias.
Características principales
- Uso de funciones constructoras: Cada "clase" es representada por una función
que inicializa propiedades específicas para cada instancia.
- Métodos compartidos en el prototipo: Los métodos que deben ser compartidos
por todas las instancias se definen en la propiedad prototype.
- Herencia mediante Object.create(): El prototipo del constructor hijo (Congelador)
se conecta al prototipo del constructor padre (Camara) utilizando Object.create().
Ventajas
- Soporta inicialización de propiedades únicas por instancia mediante la función
constructora.
- Compatible con el patrón clásico de creación de instancias usando new,
que es más familiar para programadores que vienen de lenguajes orientados
a objetos como Java o C#.
- Escalable para jerarquías más complejas y relaciones entre clases.
3.1.2. Herencia Basada en Clases en JavaScript
Ejemplo 1. Herencia Basada en Clases
El código demuestra cómo funciona la herencia basada en clases en JavaScript. La clase Nave extiende la funcionalidad de la clase Flight, creando una jerarquía de clases. Un objeto de la clase Nave puede acceder tanto a las propiedades y métodos heredados de Flight como a sus propias propiedades y métodos.
3.1.3 Concepto de la cadena de prototipos (`prototype chain`)
Ejemplo 1. Demostrando como funciona la cadena de prototipo
La cadena de prototipos es un mecanismo poderoso en JavaScript
que permite crear objetos complejos y reutilizables. Al comprender cómo funciona,
podemos escribir código más eficiente y flexible.
Estudiemos en este ejemplo cómo funciona.
- Creación del prototipo: Se crea un objeto deportista que servirá como
prototipo para otros objetos.
- Creación de un objeto que hereda: Se crea un objeto entrenándose
que hereda de deportista usando Object.create. Esto significa que entrenándose
tiene acceso a todos los métodos y propiedades de deportista.
- Añadir propiedades y métodos específicos: Se añade un nuevo método
correr al objeto entrenándose.
- Creación de otro objeto que hereda: Se crea un objeto novato que hereda
de entrenándose , por lo tanto, también hereda de deportista.
- Acceso a propiedades y métodos: Al acceder a novato.saludar(),
JavaScript busca primero en novato , luego en entrenándose (su prototipo)
y finalmente en deportista donde encuentra el método.
Visualización de la cadena de prototipos
novato > entrenándose > deportista > Object.prototype > null
3.2 Diferencias entre las propiedades `__proto__ , Object.getPrototypeOf()` y prototype.
3.2.1 Propiedad __proto__. Confirma el prototipo de una instancia de Objeto
Ejemplo 1. Comprobando el prototipo de un objeto
Ejemplo 2. Crear un nuevo objeto y establecer su prototipo usando __proto__
Caracteristicas fundamentales:
- Acceso directo al prototipo: Es una propiedad que apunta directamente al objeto prototipo de un objeto.
- Sintaxis concisa: Su sintaxis es sencilla y directa.
- Modificable: Aunque es posible modificar __proto__, no se recomienda debido a que puede llevar a
comportamientos inesperados y hacer el código menos mantenible.
- No estándar: Aunque es ampliamente utilizado, __proto__ no está
completamente estandarizado y su comportamiento puede variar entre diferentes navegadores.
3.2.2. Propiedad Object.getPrototypeOf(). Obtener el prototipo de un Objeto en específico
Ejemplo 1. Propiedad Object.getPrototypeOf()
Object.getPrototypeOf() es una función predefinida en JavaScript
que te permite obtener el prototipo de un objeto específico. En términos más simples,
nos dice de qué otro objeto "hereda" sus propiedades y métodos un objeto determinado.
En el ejemplo realizado nos informa de qué otro objeto, (en el ejemplo el objeto auto) la instancia Ford
"hereda" sus propiedades y métodos.
Cualidades::
- Método estándar: Es un método del objeto Object que se utiliza
para obtener el prototipo de un objeto de forma segura y estándar.
- Acceso indirecto: Devuelve una referencia al prototipo, pero no permite
modificarlo directamente.
- Recomendado: Es la forma recomendada de acceder al prototipo de
un objeto, ya que es más segura y compatible.
3.2.3. Propiedad prototype. Confirma a que prototipo pertenece una instancia de Objeto, devolviendo true o false.
Ejemplo 1. Uso de la propiedad prototype
Propiedad prototype
Propiedad del constructor: Es una propiedad de las funciones constructoras que
se utiliza para especificar el prototipo que se asignará a los objetos creados
a partir de esa función.
!prototype no es lo mismo que __proto__!.
prototype se refiere al prototipo que se utilizará para crear nuevos objetos,
mientras que __proto__ apunta al prototipo de un objeto existente.
3.2.4. Que entendemos por objeto base Object.prototype
Ejemplo 1. Extendiendo el método activar
Object.prototype
Es el objeto más básico y sirve como prototipo para todos los demás objetos en JavaScript.
Esto significa que todos los objetos heredan propiedades y métodos de Object.prototype.
Ejemplo 2. Agregando la propiedad laMayorPotencia a todos los equipos que tengan la propiedad potencia
En JavaScript, la búsqueda de propiedades en la cadena de
prototipos es un proceso fundamental para la herencia prototípica.
En la sección 3.1.3, a través de un ejercicio práctico, se demostró cómo
funciona la cadena de prototipos en JavaScript. Se creó un objeto 'deportista'
que sirvió como prototipo para un nuevo objeto 'novato',
el cual heredó sus características y comportamientos
3.3. Modificación del prototipo usando `Object.setPrototypeOf()
Ejercicio 1. Cambio del prototipo utilizando Object.setPrototypeOf
Description del código:
a) El código comienza definiendo dos objetos: águila y cisne. Cada uno tiene una propiedad única:
- águila: Tiene la propiedad eats con el valor "SI. Ya se alimentó".
- cisne: Tiene la propiedad flight con el valor "no vuela".
b) Herencia a través de Object.setPrototypeOf
La línea clave es Object.setPrototypeOf(cisne, águila).
Esta línea establece al objeto águila como el prototipo del objeto cisne.
Esto significa que el objeto cisne heredará las propiedades y métodos
del objeto águila si no los tiene definidos por sí mismo.
3.3.3. Diferencia entre `Object.create()` y la notación de literales de objeto (`{}`).
Ejemplo 1. Usando notación de literales de objeto {}
Ejemplo 2. Usando Object.create()
La notación de literales de objeto es más sencilla y directa para crear objetos básicos, mientras que Object.create() ofrece mayor flexibilidad al permitir la especificación del prototipo del objeto.
3.4 Explicación de la propiedad `constructor`y cómo restaurarla en casos de herencia
Llamadas a los métodos presentar() y entregar()
Invocando la propiedad sección del constructor Plano
Accediendo al constructor de Plano y el nativo.
3.5. Prototipos y Métodos Nativos de JavaScript
Por el volumen de impresión que se genera al ejecutar estos scripts,
solo imprimiremos sus resultados en la consola del navegador, obviando
mostrarlos en la vista local del navegador.
Los scripts de estos ejercicios se encuentran en el Capitulo 3 del
Libro 3 "Programando Paso a Paso y Más".
Ejercicio 1. Métodos de Array
Ejercicio 2. Métodos de String
Ejercicio 3. Métodos de Numeros
Ejercicio 4. Métodos de Date