Objetos JavaScript – 03

Resumo : neste tutorial, você aprenderá sobre objetos JavaScript e como manipular propriedades de objetos de maneira eficaz.

Introdução aos objetos JavaScript

Em JavaScript, um objeto é uma coleção não ordenada de pares chave-valor. Cada par de valores-chave é chamado de propriedade.

A chave de uma propriedade pode ser uma string. O valor de uma propriedade pode ser qualquer valor, por exemplo, uma string , um número , um array e até mesmo uma função .

JavaScript fornece muitas maneiras de criar um objeto. O mais comumente usado é usar a notação literal de objeto.

O exemplo a seguir cria um objeto vazio usando a notação literal de objeto:

let empty = {};Linguagem de código:  JavaScript  ( javascript )

Para criar um objeto com propriedades, você usa key:valueentre chaves. Por exemplo, o seguinte cria um novo personobjeto:

let person = {
    firstName: 'John',
    lastName: 'Doe'
};Linguagem de código:  JavaScript  ( javascript )

O personobjeto possui duas propriedades firstNamee lastNamecom os valores correspondentes 'John'e 'Doe'.

Quando um objeto possui múltiplas propriedades, você usa uma vírgula ( ,) para separá-las como no exemplo acima.

Acessando propriedades

Para acessar uma propriedade de um objeto, você usa uma de duas notações: a notação de ponto e a notação semelhante a uma matriz.

1) A notação de ponto (.)

O seguinte ilustra como usar a notação de ponto para acessar uma propriedade de um objeto:

objectName.propertyNameLinguagem de código:  CSS  ( css )

Por exemplo, para acessar a firstNamepropriedade do personobjeto, você usa a seguinte expressão:

person.firstNameLinguagem de código:  CSS  ( css )

Este exemplo cria um personobjeto e mostra o nome e o sobrenome no console:

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

console.log(person.firstName);
console.log(person.lastName);Linguagem de código:  JavaScript  ( javascript )

2) Notação tipo array ( [])

O seguinte ilustra como acessar o valor da propriedade de um objeto por meio da notação semelhante a um array:

objectName['propertyName']Linguagem de código:  CSS  ( css )

Por exemplo:

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

console.log(person['firstName']);
console.log(person['lastName']);Linguagem de código:  JavaScript  ( javascript )

Quando o nome de uma propriedade contém espaços, você precisa colocá-lo entre aspas. Por exemplo, o addressobjeto a seguir tem 'building no'como propriedade:

let address = {
    'building no': 3960,
    street: 'North 1st street',
    state: 'CA',
    country: 'USA'
};
Linguagem de código:  JavaScript  ( javascript )

Para acessar a 'building no'propriedade, você precisa usar a notação semelhante a um array:

address['building no'];Linguagem de código:  CSS  ( css )

Se você usar a notação de ponto, receberá um erro:

address.'building no';Linguagem de código:  JavaScript  ( javascript )

Erro:

SyntaxError: Unexpected stringLinguagem de código:  JavaScript  ( javascript )

Observe que não é uma boa prática usar espaços nos nomes das propriedades de um objeto.

A leitura de uma propriedade que não existe resultará em um arquivo undefined. Por exemplo:

console.log(address.district);Linguagem de código:  CSS  ( css )

Saída:

undefinedLinguagem de código:  JavaScript  ( javascript )

Modificando o valor de uma propriedade

Para alterar o valor de uma propriedade, você usa o operador de atribuição ( =). Por exemplo:

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

person.firstName = 'Jane';

console.log(person);Linguagem de código:  JavaScript  ( javascript )

Saída:

{ firstName: 'Jane', lastName: 'Doe' }Linguagem de código:  CSS  ( css )

Neste exemplo, alteramos o valor da firstNamepropriedade do personobjeto de 'John'para 'Jane'.

Adicionando uma nova propriedade a um objeto

Ao contrário dos objetos em outras linguagens de programação, como Java e C# , você pode adicionar uma propriedade a um objeto após a criação do objeto.

A instrução a seguir adiciona a agepropriedade ao personobjeto e atribui 25 a ele:

person.age = 25;

Excluindo uma propriedade de um objeto

Para excluir uma propriedade de um objeto, você usa o deleteoperador:

delete objectName.propertyName;Linguagem de código:  JavaScript  ( javascript )

O exemplo a seguir remove a agepropriedade do personobjeto:

delete person.age;Linguagem de código:  JavaScript  ( javascript )

Se você tentar acessar novamente a propriedade age, receberá um undefinedvalor.

Verificando se existe uma propriedade

Para verificar se existe uma propriedade em um objeto, você usa o inoperador:

propertyName in objectName

O inoperador retorna truese propertyNameexistir no arquivo objectName.

O exemplo a seguir cria um employeeobjeto e usa o inoperador para verificar se as propriedades ssne employeeIdexistem no objeto:

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

console.log('ssn' in employee);
console.log('employeeId' in employee);Linguagem de código:  JavaScript  ( javascript )

Saída:

false
trueLinguagem de código:  JavaScript  ( javascript )

Resumo

• Um objeto é uma coleção de pares de valores-chave.
• Use a notação de ponto ( .) ou notação semelhante a array ( []) para acessar a propriedade de um objeto.
• Use o deleteoperador para remover uma propriedade de um objeto.
• Use o inoperador para verificar se existe uma propriedade em um objeto.