オブジェクトのキーとして Symbol を使う
衝突しないプロパティに Symbol を使います。
「オブジェクトのキーとして Symbol を使う」はCoddyKit上の無料JavaScript Academyレッスンです。 これはレッスン2/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavaScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 JavaScript Academyコースには全4レッスンが含まれています。
シンボルをキーとして使う
シンボルはオブジェクトのプロパティキーとして使えます。各シンボルは一意であるため、そのプロパティが文字列キーと意図せず衝突することはありません。
const id = Symbol("id")
const user = {}
user[id] = 123
console.log(user[id])計算シンボルキー
オブジェクトリテラルでシンボルをキーとして使うには、計算プロパティ名として角かっこで囲みます。
const id = Symbol("id")
const user = {
name: "Ann",
[id]: 99
}
console.log(user[id])シンボルプロパティを読み取る
そのプロパティを読み取るには、同じシンボルへの参照を保持していなければなりません。その参照がなければ、値には実質的にアクセスできません。
const secret = Symbol("secret")
const obj = { [secret]: "hidden" }
console.log(obj[secret])for-inでは列挙されない
シンボルキーは for-in ループでスキップされます。これにより、シンボルプロパティは通常の反復処理から除外されます。
const tag = Symbol("tag")
const obj = { a: 1, b: 2, [tag]: 3 }
for (const key in obj) {
console.log(key)
}Object.keysではスキップされる
Object.keys は文字列キーのみを返すため、シンボルをキーとするプロパティも除外されます。
const tag = Symbol("tag")
const obj = { a: 1, [tag]: 2 }
console.log(Object.keys(obj))JSONから隠される
JSON.stringify はシンボルキーを完全に無視するため、シリアライズされた出力には決して現れません。そのため、内部メタデータに便利です。
const meta = Symbol("meta")
const obj = { name: "Bo", [meta]: "internal" }
console.log(JSON.stringify(obj))シンボルキーを見つける
シンボルキーを一覧表示するには Object.getOwnPropertySymbols を使います。これにより、オブジェクトが持つシンボルプロパティの配列が返されます。
const tag = Symbol("tag")
const obj = { a: 1, [tag]: 2 }
const syms = Object.getOwnPropertySymbols(obj)
console.log(syms.length)名前の衝突を避ける
シンボルキーを使うと、異なるライブラリが同じオブジェクトにプロパティを追加しても、シンボルが異なるため互いに上書きする心配がありません。
const libA = Symbol("data")
const libB = Symbol("data")
const shared = {}
shared[libA] = 1
shared[libB] = 2
console.log(shared[libA], shared[libB])シンボルキーとスプレッド
オブジェクトのスプレッド構文は、for-in や Object.keys とは異なり、シンボルキーもコピーします。そのため、複製時に引き継がれることに注意してください。
const tag = Symbol("tag")
const src = { a: 1, [tag]: 2 }
const copy = { ...src }
console.log(copy[tag])プライベートに近いデータを保存する
シンボルキーは、緩やかなプライバシー機能を提供します。そのシンボルを保持するコードだけがデータにアクセスでき、通常のプロパティ一覧には表示されません。
const balance = Symbol("balance")
function makeAccount() {
const acct = {}
acct[balance] = 100
return { acct: acct, key: balance }
}
const a = makeAccount()
console.log(a.acct[a.key])シンボルプロパティを削除する
シンボルプロパティは他のプロパティと同じ方法で削除できます。シンボルへの参照と delete 演算子を使います。
const tag = Symbol("tag")
const obj = { [tag]: 5 }
delete obj[tag]
console.log(obj[tag])クイックチェック
シンボルキーに関する知識を確認しましょう。
まとめ
まとめ: シンボルは安全で隠れたオブジェクトキーになります。
- 計算シンボルキーには角かっこを使います
- for-in、Object.keys、JSON ではスキップされます
- Object.getOwnPropertySymbols で一覧表示できます
- 衝突のないメタデータに適しています
const k = Symbol("k")
const o = { [k]: 7 }
console.log(o[k])よくある質問
「オブジェクトのキーとして Symbol を使う」レッスンは無料ですか?
はい。「オブジェクトのキーとして Symbol を使う」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、JavaScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 JavaScript Academyコースには全4レッスンが含まれています。
「オブジェクトのキーとして Symbol を使う」で何を学びますか?
衝突しないプロパティに Symbol を使います。 ブラウザで直接実行するハンズオンコードでJavaScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
JavaScript Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのJavaScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/4です。
「オブジェクトのキーとして Symbol を使う」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このJavaScript Academyレッスンでコードを書いて実行できますか?
はい。すべてのJavaScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- 一意な Symbol を作成する
- オブジェクトのキーとして Symbol を使う
- グローバル Symbol レジストリ
- ウェルノウン Symbol