Uso de Métodos Estáticos del Objeto en JavaScript
Curso Intermedio de Programación Orientada a Objetos en JavaScript
Contenido del curso
Profundicemos en los objetos
Cómo copiar objetos en JavaScript
Recursividad en JavaScript
Abstracción y encapsulamiento sin prototipos
- 10

Creación de Fábricas de Objetos con Patron RORO en JavaScript
18:52 min - 11

Abstracción y Encapsulamiento en JavaScript Sin Prototipos ni Clases
12:58 min - 12

Encapsulamiento en JavaScript: Propiedades Privadas y Públicas
13:31 min - 13

Getters y Setters en JavaScript: Protección y Validación de Propiedades
09:40 min
Cómo identificar objetos
- 14

Duck Typing en JavaScript: Identificación de Objetos y Tipos
05:30 min - 15

Validación de Propiedades en Objetos JavaScript
14:22 min - 16

Validación de Instancias y Prototipos en JavaScript
17:45 min - 17

Protección de Propiedades Privadas en Prototipos JavaScript
15:10 min - 18

Métodos Estáticos en JavaScript: Creación de SuperObject
07:52 min
Próximos pasos
Recursos
Resumen
Comprender cómo funcionan los métodos estáticos del superprototipo Object es fundamental para trabajar con objetos en JavaScript de forma profesional. Más allá de acceder a propiedades con el punto o los corchetes, existen herramientas que permiten listar, inspeccionar y definir propiedades con un nivel de control que pocos desarrolladores aprovechan desde el inicio.
¿Cómo listar las propiedades de un objeto con Object.keys y Object.getOwnPropertyNames?
Para este ejercicio se parte de un objeto llamado juan con atributos como name, edad, approvedCourses (un array de cursos aprobados) y un método addCourse que utiliza this.approvedCourses.push(newCourse) para agregar nuevos cursos a la lista [01:00].
El primer método estático es Object.keys, que recibe un objeto como argumento y devuelve un array con los nombres de todas sus propiedades, sin importar si son atributos o métodos [02:42].
javascript Object.keys(juan); // ["name", "edad", "approvedCourses", "addCourse"]
El segundo es Object.getOwnPropertyNames, que en apariencia hace lo mismo: retorna un array con cada propiedad del objeto [03:10]. La diferencia entre ambos se vuelve relevante cuando existen propiedades no enumerables, algo que se explora más adelante.
¿Qué devuelve Object.entries y por qué cambia el contexto de this?
Object.entries va un paso más allá. Retorna un array de arrays, donde cada sub-array contiene dos elementos: la llave y el valor de cada propiedad [03:25].
javascript Object.entries(juan); // [["name", "Juanito"], ["edad", 18], ["approvedCourses", [...]], ["addCourse", ƒ]]
Es posible acceder a posiciones específicas de este resultado. Por ejemplo, Object.entries(juan)[3] muestra el array ["addCourse", ƒ] y con [3][1] se obtiene la función en sí [04:10].
Sin embargo, ejecutar un método desde Object.entries genera un problema con this. Al intentar Object.entries(juan)[3][1]("curso 3"), se obtiene un TypeError: Cannot read property push of undefined [05:05]. La razón es que this ya no apunta al objeto juan, sino al array donde está almacenada la función. Este comportamiento está directamente relacionado con los conceptos de closures y scope:
- Cuando se llama
juan.addCourse("curso 2"),thisreferencia correctamente al objetojuan[05:55]. - Cuando se ejecuta la misma función a través de
Object.entries, el contexto cambia:thispasa a ser el array interno, no el objeto original [07:00].
Este detalle es crucial al trabajar con funciones extraídas de objetos mediante Object.entries.
¿Qué son writable, enumerable y configurable en Object.getOwnPropertyDescriptors?
El método más revelador es Object.getOwnPropertyDescriptors [08:00]. En lugar de un array, devuelve un objeto donde cada propiedad contiene un descriptor con estos atributos:
- value: el valor almacenado en la propiedad.
- writable: indica si el valor puede ser modificado.
- enumerable: determina si la propiedad aparece al iterar el objeto.
- configurable: controla si la propiedad puede ser eliminada o si sus descriptores pueden cambiar.
javascript Object.getOwnPropertyDescriptors(juan); // { name: { value: "Juanito", writable: true, enumerable: true, configurable: true }, ... }
Estos tres atributos por defecto están en true cuando se crean propiedades de forma convencional. Revelan que los objetos en JavaScript no son simples pares de llave-valor, sino que cada propiedad lleva consigo metadatos que definen su comportamiento.
¿Cómo crear propiedades con Object.defineProperty?
Para manipular estos descriptores existe Object.defineProperty, que recibe tres argumentos [09:30]:
- El objeto destino.
- El nombre de la nueva propiedad como string.
- Un objeto con
value,writable,enumerableyconfigurable.
javascript Object.defineProperty(juan, "pruebaNasa", { value: "extraterrestres", writable: true, enumerable: true, configurable: true });
A diferencia de asignar propiedades con el punto o los corchetes, este método permite controlar exactamente el comportamiento de cada propiedad desde su creación, lo que abre la puerta al encapsulamiento en objetos de JavaScript.
Experimenta cambiando writable, enumerable o configurable a false y observa cómo se restringe el acceso y la modificación de tus propiedades. ¿Ya probaste qué sucede cuando enumerable es false y ejecutas Object.keys? Comparte tu resultado en los comentarios.