---
type: learn
language: javascript
slug: object/basics
title: "オブジェクトの基本 — 作る・読む・書き換える"
title_tag: "JavaScript オブジェクトの基本 — 作る・読む・書く【第1回】"
summary: >
  オブジェクトは名前を付けて値をまとめる入れ物です。作り方、ドットと角括弧の使い分け、
  無い鍵を読んだときの結果、あるかどうかの調べ方、同じものを指すという性質までを確かめます。
description: >
  無い鍵を読んでも落ちず undefined が返ります。in と hasOwn の違い、変数を鍵にする書き方、
  代入しても元が変わる「同じものを指す」性質まで、実行しながら確かめられます。
status: published
difficulty: 1
minutes: 9

versions:
  verified: "Node 22.22.3"
  since: "ES1"
  deprecated: null
  removed: null

sources:
  - title: "Object Objects — ECMAScript® 2026 Language Specification"
    url: "https://tc39.es/ecma262/#sec-object-objects"
  - title: "Object.hasOwn — ECMAScript® 2026 Language Specification"
    url: "https://tc39.es/ecma262/#sec-object.hasown"
  - title: "オブジェクトの操作 — MDN"
    url: "https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Working_with_objects"

terms: [オブジェクト, プロパティ, 鍵, 参照, 計算プロパティ]

links:
  prev: null
  next: javascript/learn/object/nested
  related:
    - javascript/learn/array/basics
    - javascript/reference/object/keys
    - javascript/why/typeof-null

content_updated_at: 2026-09-08
published_at: 2026-09-08
---

[type:オブジェクト]は、値に**名前を付けてまとめる**入れ物です。
配列が[key:順番]で管理するのに対して、オブジェクトは[key:名前]で管理します。

```js run
const user = { name: 'あ', age: 20 };

console.log(user);
console.log(typeof user);
```
```output
{ name: 'あ', age: 20 }
object
```

`名前: 値` の組を `,` で区切って並べます。この組ひとつを[type:プロパティ]と呼び、
名前の側を[type:鍵]、値の側を[type:値]と呼びます。

## 読む

書き方は[num:2]つあります。

```js run
const user = { name: 'あ', age: 20 };

console.log(user.name);
console.log(user['name']);
```
```output
あ
あ
```

- `user.name` … **ふだんはこちら。** 短くて読みやすい
- `user['name']` … 鍵を[key:文字列]で渡す。**変数や、記号を含む名前**のときに使う

## 無い鍵を読んでも落ちない

```js run
const user = { name: 'あ' };

console.log(user.nothing);
```
```output
undefined
```

**エラーになりません。** `undefined` が返るだけです。

配列で範囲の外を読んだときと同じで、[bad:間違いに気づきにくい]性質です。
→ [配列の基本](/ja/javascript/learn/array/basics/)

## 鍵は文字列

```js run
const key = 'age';

const user = { name: 'あ', [key]: 20, 'full name': 'あ い' };

console.log(user[key]);
console.log(user['full name']);
console.log(Object.keys(user));
```
```output
20
あ い
[ 'name', 'age', 'full name' ]
```

- `[key]` … 変数の**中身**を鍵にする（[type:計算プロパティ]）
- `'full name'` … 空白や記号を含む鍵は引用符で囲む。読むときは角括弧

[bad:`user.key` と書くと、変数の中身ではなく `key` という名前を探します。]
ここは取り違えやすいところです。

## 書き換える・足す・消す

```js run
const user = { name: 'あ' };

user.age = 20;
user.name = 'い';

console.log(user);

delete user.age;

console.log(user);
```
```output
{ name: 'い', age: 20 }
{ name: 'い' }
```

**無い鍵に代入すると、そのまま足されます。** 宣言のようなものは要りません。

> `const` で宣言していても、**中身は変えられます。**
> `const` が固定するのは名前と値の[key:結びつき]で、中身ではありません。
> → [TypeError: Assignment to constant variable.](/ja/javascript/errors/assignment-to-constant-variable/)

## あるかどうかを調べる

`undefined` かどうかで判断すると、[bad:取り違えることがあります]。

```js run
const user = { name: 'あ', nothing: undefined };

console.log(user.nothing === undefined);
console.log('nothing' in user);
```
```output
true
true
```

**「鍵が無い」と「鍵はあるが値が `undefined`」を区別できていません。**
区別したいなら `in` か `Object.hasOwn()` を使います。

```js run
const user = { name: 'あ' };

console.log('name' in user);
console.log('age' in user);
console.log(Object.hasOwn(user, 'name'));
```
```output
true
false
true
```

### `in` と `Object.hasOwn()` の違い

```js run
const user = { name: 'あ' };

console.log('toString' in user);
console.log(Object.hasOwn(user, 'toString'));
```
```output
true
false
```

`in` は[key:受け継いだもの]まで見ます。`toString` は自分で書いていないのに `true` です。

**自分で持っている鍵だけを見たいなら `Object.hasOwn()`** を使ってください。
利用者の入力を鍵にするときは、この差が事故になります。

[dim:`Object.hasOwn()` は Node 16.9 / Chrome 93 以降。それより前は `Object.prototype.hasOwnProperty.call(user, 'name')` と書きます。]

## 短く書く

変数名と鍵名が同じなら、片方を省けます。

```js run
const name = 'あ';
const age = 20;

const user = { name, age };

console.log(user);
```
```output
{ name: 'あ', age: 20 }
```

関数も入れられます。**オブジェクトの中の関数を[type:メソッド]と呼びます。**

```js run
const user = {
  name: 'あ',
  greet() {
    return this.name;
  },
};

console.log(user.greet());
```
```output
あ
```

`this` は「[key:呼ばれ方]」で決まります。取り出して呼ぶと外れるので注意してください。
→ [なぜ this は呼び方で変わるのか](/ja/javascript/why/this-binding/)

## よくある間違い

### 変数を鍵にするつもりでドットを書く

```js bad
const key = 'age';
const user = { name: 'あ', age: 20 };

console.log(user.key);
```
```output
undefined
```

`user.key` は「`key` という名前の鍵」を探します。**変数の中身は見ません。**
落ちないので、`undefined` が出るまで気づけません。

変数の中身で引きたいなら[key:角括弧]です。

```js run
const key = 'age';
const user = { name: 'あ', age: 20 };

console.log(user[key]);
```
```output
20
```

## 代入しても複製されない

**ここがいちばん大事な性質です。**

```js run
const a = { n: 1 };
const b = a;

b.n = 2;

console.log(a.n);
console.log(a === b);
```
```output
2
true
```

`b` に入ったのは[key:同じオブジェクトを指す矢印]で、中身の複製ではありません。
**`b` を触ると `a` も変わります。**

複製したいなら、はっきりそう書きます。

```js run
const a = { n: 1 };
const c = { ...a };

c.n = 3;

console.log(a.n, c.n, a === c);
```
```output
1 3 false
```

[bad:ただしこれも1段だけです。] 入れ子の中身は共有されたままになります。
→ [オブジェクトを結合する](/ja/javascript/how-to/object/merge/)

## まとめ

- オブジェクトは[key:名前]で値をまとめる。配列は[key:順番]
- 読み方は `user.name` と `user['name']`。**変数を鍵にするなら角括弧**
- 無い鍵を読んでも[bad:落ちない]。`undefined` が返る
- 「無い」と「`undefined`」は別。区別するなら `Object.hasOwn()`
- **`in` は受け継いだ鍵まで見る。** `Object.hasOwn()` は自分の分だけ
- 代入は複製ではない。**同じものを指す**

## 次に学ぶ

実際のデータは[key:入れ子]になっています。
`data.user.address.city` のように深く辿るときに落ちない書き方と、
必要な値だけ取り出す方法を学びます。

→ [第2回: 入れ子のオブジェクトを安全に扱う](/ja/javascript/learn/object/nested/)