Descubra todo lo que necesita saber sobre las propiedades de los objetos de JavaScript
Los objetos JavaScript tienen propiedades, que están compuestas por una etiqueta asociada a un valor.
La sintaxis literal del objeto que vimos:
const car = {}
nos permite definir propiedades como esta:
const car = { color: 'blue'}
Aquí tenemos un car
objeto con una propiedad llamada color
, con valor blue
.
Las etiquetas pueden ser cualquier cadena. Observe que no usé comillas alrededor de color
, pero si hubiera querido incluir un carácter no válido como nombre de variable en el nombre de la propiedad, habría tenido que:
const car = { color: 'blue', 'the color': 'blue'}
Esto significa espacios, guiones y más caracteres especiales.
Como ves, separamos cada propiedad con una coma.
Recuperando el valor de una propiedad
Podemos recuperar el valor de una propiedad usando 2 sintaxis diferentes.
La primera es la notación de puntos :
car.color //'blue'
El segundo, que es obligatorio para propiedades con nombres inválidos, es utilizar corchetes:
car['the color'] //'blue'
Si accedes a una propiedad inexistente, obtienes undefined
:
car.brand //undefined
Una buena forma de comprobar el valor de una propiedad pero que tiene como valor predeterminado un valor predefinido es utilizar el ||
operador:
const brand = car.brand || 'ford'
Como se dijo, los objetos pueden tener objetos anidados como propiedades:
const car = { brand: { name: 'Ford' }, color: 'blue'}
Puede acceder al nombre de la marca utilizando
car.brand.name
o
car['brand']['name']
o incluso mezclando:
car.brand['name']car['brand'].name
Establecer el valor de una propiedad
Como viste arriba, puedes establecer el valor de una propiedad cuando defines el objeto.
Pero siempre puedes actualizarlo más tarde:
const car = { color: 'blue'}car.color = 'yellow'car['color'] = 'red'
También puedes agregar nuevas propiedades a un objeto:
car.model = 'Fiesta'car.model //'Fiesta'
Cómo eliminar una propiedad
Dado el objeto
const car = { color: 'blue', brand: 'Ford'}
Puedes eliminar una propiedad de este objeto usando
delete car.brand
Funciona también expresado como:
delete car['brand']delete car.branddelete newCar['brand']
Establecer una propiedad como indefinida
Si necesita realizar esta operación de una manera muy optimizada, por ejemplo, cuando está operando en una gran cantidad de objetos en bucles, otra opción es establecer la propiedad en undefined
. Todo sobre Apple, Mac e Iphone
Debido a su naturaleza, el rendimiento de delete
es mucho más lento que una simple reasignación a undefined
, más de 50 veces más lento.
Sin embargo, tenga en cuenta que la propiedad no se elimina del objeto. Su valor se borra, pero sigue estando allí si itera el objeto:
El uso delete
aún es muy rápido, solo debes considerar este tipo de problemas de rendimiento si tienes una muy buena razón para hacerlo, de lo contrario, siempre es preferible tener una semántica y una funcionalidad más claras.
Eliminar una propiedad sin mutar el objeto
Si la mutabilidad es una preocupación, puede crear un objeto completamente nuevo copiando todas las propiedades del antiguo, excepto la que desea eliminar:
const car = { color: 'blue', brand: 'Ford'}const prop = 'color'const newCar = Object.keys(car).reduce((object, key) = { if (key !== prop) { object[key] = car[key] } return object}, {})
Cómo contar el número de propiedades en un objeto JavaScript
Utilice el Object.keys()
método, pasando el objeto que desea inspeccionar, para obtener una matriz de todas las propiedades enumerables (propias) del objeto.
Luego calcula la longitud de esa matriz comprobando la length
propiedad:
const car = { color: 'Blue', brand: 'Ford', model: 'Fiesta'}Object.keys(car).length
Dije propiedades enumerables. Esto significa que su indicador de enumerabilidad interno está configurado como verdadero, que es el valor predeterminado. Consulte MDN para obtener más información sobre este tema.
Cómo comprobar si una propiedad de un objeto JavaScript no está definida
En un programa JavaScript, la forma correcta de comprobar si una propiedad de un objeto no está definida es utilizar el typeof
operador .
typeof
Devuelve una cadena que indica el tipo del operando. Se utiliza sin paréntesis, pasándole cualquier valor que se desee comprobar:
const list = []const count = 2typeof list //"object"typeof count //"number"typeof "test" //"string"typeof color //"undefined"
Si el valor no está definido, devuelve la cadenatypeof
‘indefinida’ .
Ahora supongamos que tienes un car
objeto, con solo una propiedad:
const car = { model: 'Fiesta'}
Así es como se comprueba si la color
propiedad está definida en este objeto:
if (typeof car.color === 'undefined') { // color is undefined}
Propiedades dinámicas
Al definir una propiedad, su etiqueta puede ser una expresión si se incluye entre corchetes:
const car = { ['c' + 'o' + 'lor']: 'blue'}car.color //'blue'
Sintaxis más sencilla para incluir variables como propiedades de objeto
En lugar de hacer
const something = 'y'const x = { something: something}
Puedes hacerlo de esta manera simplificada:
const something = 'y'const x = { something}
Tips para principiantes de JavaScript
Tal vez te puede interesar:
- Cómo generar un número aleatorio entre dos números en JavaScript
- Cómo esperar el evento DOM listo en JavaScript simple
- Cómo determinar si una fecha es hoy en JavaScript
- Cómo contar el número de propiedades en un objeto JavaScript
Propiedades de objetos de JavaScript
Recuperando el valor de una propiedadEstablecer el valor de una propiedadCómo eliminar una propiedadEstablecer una propiedad como indefinidaEliminar una propi
programar
es
https://aprendeprogramando.es/static/images/programar-propiedades-de-objetos-de-javascript-2025-0.jpg
2025-01-20

Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente