オブジェクト: キーと値のマップ

An object in JS is an unordered collection of key → value pairs. Keys are strings (or Symbol), values are anything: numbers, strings, arrays, other objects, functions. It's the most-used data structure in the language: every "record" in your domain will typically be an object.

const utente = {
  nome: 'Anna',
  eta: 28,
  attivo: true,
  ruoli: ['admin', 'editor'],
};

Reading properties: dot vs bracket

There are two equivalent notations:

utente.nome; // 'Anna'    (dot — the normal form)
utente['nome']; // 'Anna'    (bracket — equivalent)

// Brackets are MANDATORY when:
// 1) the key is not a valid identifier
const tag = { 'codice-fiscale': 'ABC123' };
tag['codice-fiscale']; // OK
// tag.codice-fiscale;      // syntax error

// 2) the key is computed (variable/expression)
const campo = 'eta';
utente[campo]; // 28

A missing property returns undefined, without errors:

utente.telefono; // undefined

Adding, modifying, removing

const u = { nome: 'Anna' };
u.eta = 28; // adds
u.nome = 'Anna B.'; // modifies
delete u.eta; // removes the property

delete is a keyword. It will turn out to be a rare use case: most of the time you'll want to produce a new object without that key (we'll see this with spread).

Shorthand: keys named like the variable

When the key name matches the variable name, you can omit the duplication:

const nome = 'Anna';
const eta = 28;

const u1 = { nome: nome, eta: eta }; // explicit form
const u2 = { nome, eta }; // shorthand, equivalent

Checking the presence of a property

Three options, in order of preference:

'nome' in utente; // true   ← in operator
utente.nome !== undefined; // true   ← works almost always
Object.hasOwn(utente, 'nome'); // true   ← modern, safe

Try it

運動#js.m3.l2.e1

試行回数: 0読み込み中…

Create the object user = { name: 'Sara', age: 22 }, then add the 'active' property set to true and return the object as the last expression.

エディターを読み込み中…

ヒントを表示

You can add properties after the fact with dot notation.

3 回の試行後に解決策が利用可能になります

Review exercise

運動#js.m3.l2.e2

試行回数: 0読み込み中…

Given `product = { code: 'A1', price: 9.9 }` and the string `key = 'price'`, return the price using bracket notation (the last expression must evaluate to 9.9).

エディターを読み込み中…

ヒントを表示

With brackets you can pass a variable as the key.

3 回の試行後に解決策が利用可能になります