Acceso a las propiedades de un objeto

Hay dos formas de acceder a las propiedades de un objeto:

  • Notación de puntos
  • Notación de corchetes

La notación de puntos es la más utilizada. A continuación nos sumergiremos en cada una de ellas y descubriremos algunas de las diferencias.

Notación de puntos

Veamos primero la notación de puntos. Considere este ejemplo a continuación:

let obj = {
cat: 'meow',
dog: 'woof'
};let sound = obj.cat;console.log(sound);
// meow

Quiero llamar su atención sobre la quinta línea donde estamos utilizando la notación de puntos: let sound = obj.cat;. Este es un ejemplo de notación por puntos. Puedes acceder a las propiedades de un objeto especificando el nombre del objeto, seguido de un punto seguido del nombre de la propiedad. Esta es la sintaxis: objectName.propertyName;.

Cuando se trabaja con la notación de puntos, los identificadores de las propiedades sólo pueden ser alfanuméricos (y _ y $). Las propiedades no pueden empezar por un número.

La notación por puntos es mucho más fácil de leer que la notación por corchetes y por ello se utiliza más a menudo. Sin embargo, hay una segunda forma de acceder a las propiedades de un objeto que debes conocer. Se llama notación de corchetes.

Notación de corchetes

Aquí tienes un ejemplo de notación de corchetes:

let obj = {
cat: 'meow',
dog: 'woof'
};let sound = obj;console.log(sound);
// meow

De nuevo, llama tu atención la quinta línea: let sound = obj;. Puedes acceder a las propiedades de un objeto especificando el nombre del objeto seguido del nombre de la propiedad entre paréntesis. Esta es la sintaxis: objectName.

Probablemente has visto la notación de corchetes cuando trabajas con Arrays. En el siguiente ejemplo accederemos al segundo elemento de nuestro arr utilizando la sintaxis: arrayName

let arr = ;let letter = arr;console.log(letter);
// b

Pero la notación de corchetes también es útil cuando se trabaja con Objetos.

Cuando se trabaja con la notación de corchetes, los identificadores de propiedades sólo tienen que ser una Cadena. Pueden incluir cualquier carácter, incluyendo espacios. También se pueden utilizar variables siempre que la variable resuelva a una Cadena.

Esto significa que hay menos limitaciones cuando se trabaja con la notación de corchetes. Ahora podemos tener espacios en nuestras cadenas, e incluso podemos empezar las cadenas con números.

Quizás lo más importante es que ahora podemos usar variables para acceder a las propiedades de un objeto. Es importante que la variable que estás usando haga referencia a una Cadena.

Echa un vistazo a este ejemplo de variable. Puede ser un poco confuso al principio, así que ten paciencia conmigo:

let obj = {
cat: 'meow',
dog: 'woof'
};let dog = 'cat';
let sound = obj;console.log(sound);
// meow

El ejemplo anterior es similar a un ejemplo anterior que ya hemos visto. La principal diferencia es que ahora estamos utilizando la notación de corchetes para pasar una variable. Cuidado, puede parecer que estamos buscando la propiedad dog en nuestro obj, pero eso no es del todo correcto. dog es una variable con un valor de 'cat'. Como estamos usando paréntesis, se pasa el valor de la cadena y se busca la propiedad 'cat'obj. Por lo tanto, meow se registra en la consola.

A continuación, vamos a tratar de hacer lo mismo, pero con la notación de puntos:

let obj = {
cat: 'meow',
dog: 'woof'
};let dog = 'cat';
let sound = obj.dog;console.log(sound);
// woof

De inmediato debería notar que estamos recibiendo woof. Esto es muy diferente del otro ejemplo y es porque no podemos usar variables con notación de puntos. Al intentar buscar obj.dog se buscará el valor de la cadena 'dog' dentro de nuestro objeto en lugar de utilizar el valor de las variables. Así, obj.dog devuelve woof.

Recapitulación

Hay algunas diferencias importantes entre la notación de puntos y la de corchetes:

Notación de puntos:

  • Los identificadores de propiedad sólo pueden ser alfanuméricos (y _ y $)
  • Los identificadores de propiedad no pueden empezar por un número.
  • Los identificadores de propiedad no pueden contener variables.
  • Aceptable – obj.prop_1, obj.prop$
  • No aceptable – obj.1prop, obj.prop name

Notación deracket:

  • Los identificadores de propiedad tienen que ser una Cadena o una variable que haga referencia a una Cadena.
  • Está bien usar variables, espacios y cadenas que empiecen por números
  • Ok – obj, obj

¡Gracias por leer! Si estás listo para aprender finalmente el desarrollo web, echa un vistazo a La guía definitiva para aprender desarrollo web full stack en 6 meses, por 30 dólares. Si sólo estás buscando mejorar tus habilidades en JavaScript, echa un vistazo a: A Beginners Guide to Advanced JavaScript

Publico 4 artículos sobre desarrollo web cada semana. Por favor, considere introducir su correo electrónico aquí si desea ser añadido a mi lista de correo electrónico una vez a la semana, o sígame en Twitter.

Deja una respuesta

Tu dirección de correo electrónico no será publicada.