Introducción al manejo de objetos en JavaScript

Estrada Web Group
Estrada Web Group
Introducción al manejo de objetos en JavaScript

Resumen: en este tutorial, aprenderás sobres los objetos de JavaScript y cómo manipular las propiedades de los objetos de manera efectiva.

Introducción a los objetos JavaScript

En JavaScript, un objeto es una colección desordenada de pares clave-valor. Cada par clave-valor se denomina propiedad.

La clave de una propiedad puede ser una cadena. Y el valor de una propiedad puede ser cualquier valor, por ejemplo, una cadena, un número, una matriz e incluso una función.

JavaScript proporciona muchas formas de crear un objeto. El más comúnmente usado es usar la notación literal de objeto.

El siguiente ejemplo crea un objeto vacío utilizando la notación literal de objeto:

let empty = {};

Para crear un objeto con propiedades, utiliza los pares clave:valor entre llaves. Por ejemplo, lo siguiente ejemplo crea un nuevo objeto de persona:

let person = {
    firstName: 'John',
    lastName: 'Doe'
};

El objeto person tiene dos propiedades firstName y lastName con los valores correspondientes 'John' y 'Doe'.

Cuando un objeto tiene múltiples propiedades, usa una coma (,) para separarlas como en el ejemplo anterior.

Accediendo a las propiedades

Para acceder a una propiedad de un objeto, utiliza una de dos notaciones: la notación de puntos y la notación tipo matriz.

1) La notación de punto (.)

A continuación, se ilustra cómo utilizar la notación de puntos para acceder a una propiedad de un objeto:

objectName.propertyName

Por ejemplo, para acceder a la propiedad firstName del objeto persona, utiliza la siguiente expresión:

person.firstName

Este ejemplo crea un objeto de persona y muestra el nombre y el apellido en la consola:

let person = {
    firstName: 'John',
    lastName: 'Doe'
};

console.log(person.firstName);
console.log(person.lastName);

2) Notación tipo matriz ([])

A continuación, se ilustra cómo acceder al valor de la propiedad de un objeto a través de la notación tipo matriz:

objectName['propertyName']

let person = {
    firstName: 'John',
    lastName: 'Doe'
};

console.log(person['firstName']);
console.log(person['lastName']);

Cuando el nombre de una propiedad contiene espacios, debes colocarlo entre comillas. Por ejemplo, el siguiente objeto de dirección tiene el 'building no' como propiedad:

let address = {
    'building no': 3960,
    street: 'North 1st street',
    state: 'CA',
    country: 'USA'
};

Para acceder a la propiedad 'building no', debes usar la notación tipo matriz:

address['building no'];

Si usas la notación de puntos, obtendrás un error:

address.'building no';

Error:

SyntaxError: Unexpected string

Ten en cuenta que no es una buena práctica utilizar espacios en los nombres de propiedad de un objeto.

La lectura de una propiedad que no existe dará como resultado un valor indefinido. Por ejemplo:

console.log(address.district);

Resultado:

undefined

Modificar el valor de una propiedad

Para cambiar el valor de una propiedad, utiliza el operador de asignación (=). Por ejemplo:

let person = {
    firstName: 'John',
    lastName: 'Doe'
};

person.firstName = 'Jane';

console.log(person);

Resultado:

{ firstName: 'Jane', lastName: 'Doe' }

En este ejemplo, cambiamos el valor de la propiedad firstName del objeto persona de 'John' a 'Jane'.

Agregar una nueva propiedad a un objeto

A diferencia de los objetos en otros lenguajes de programación como Java y C#, puedes agregar una propiedad a un objeto después de la creación del objeto.

La siguiente declaración agrega la propiedad edad al objeto persona y le asigna 25:

person.age = 25;

Eliminar una propiedad de un objeto

Para eliminar una propiedad de un objeto, utiliza el operador de eliminación:

delete objectName.propertyName;

El siguiente ejemplo elimina la propiedad edad del objeto persona:

delete person.age;

Si intentas volver a acceder a la propiedad de edad, obtendrás un valor indefinido.

Comprobar si existe una propiedad

Para comprobar si existe una propiedad en un objeto, utiliza el operador in:

propertyName in objectName

El operador in devuelve verdadero si propertyName existe en objectName.

El siguiente ejemplo crea un objeto empleado y usa el operador in para verificar si las propiedades ssn y employeeId existen en el objeto:

let employee = {
    firstName: 'Peter',
    lastName: 'Doe',
    employeeId: 1
};

console.log('ssn' in employee);
console.log('employeeId' in employee);

Resultado

false
true

Resumen

  • Un objeto es una colección de pares clave-valor.
  • Utilice la notación de puntos (.) o la notación tipo matriz ([]) para acceder a una propiedad de un objeto.
  • El operador de eliminación, elimina una propiedad de un objeto.
  • El operador in comprueba si existe una propiedad en un objeto.
Compartir artículo:

Más artículos geniales

Introducción a los tipos octales y binarios en JavaScript

Introducción a los tipos octales y binarios en JavaScript

Resumen: en este tutorial, aprenderás cómo representar los tipos octales y binarios en ES6.

Ver artículo completo
¿Cómo utilizar las condiciones if else o estructuras de decisión en JavaScript? y ¿Qué es un if en JavaScript?

¿Cómo utilizar las condiciones if else o estructuras de decisión en JavaScript? y ¿Qué es un if en JavaScript?

La toma de decisiones en programación es similar a la toma de decisiones en la vida real. En programación también enfrentamos algunas situaciones en las que queremos que se ejecute un cierto bloque de código cuando se cumple alguna condición.

Ver artículo completo

Manténgase actualizado

Obtenga excelente contenido en su bandeja de entrada todas las semanas.
Solo contenido excelente, no compartimos su correo electrónico con terceros.
Subir al inicio de la pantalla