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

Operadores de asignación en JavaScript

Operadores de asignación en JavaScript

Resumen: en este tutorial, aprenderás a usar operadores de asignación de JavaScript para asignar un valor a una variable.

Ver artículo completo
Operadores aritméticos de JavaScript

Operadores aritméticos de JavaScript

Resumen: en este tutorial, aprenderás cuales son y cómo usar los operadores aritméticos de JavaScript para realizar cálculos aritméticos.

Ver artículo completo
Cómo usar la declaración if de JavaScript

Cómo usar la declaración if de JavaScript

Resumen: en este tutorial, aprenderás a usar la declaración if de JavaScript para ejecutar un bloque cuando una condición es verdadera.

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