Symbol | Frontend Practical Guide

概要

Symbol は ES2015 で追加された一意のプリミティブ型です。プロパティキーとして使用でき、名前の衝突を防ぎます。Symbol.iterator 等の well-known Symbol でオブジェクトの動作をカスタマイズできます。

対応ブラウザ

機能	デスクトップ				モバイル
機能	Chrome	Edge	Firefox	Safari	Chrome Android	Safari iOS
`Symbol`	38	12	36	9	38	9
`Array.@@species` Array[Symbol.species] 静的アクセサープロパティは、配列のメソッドからの返値を構築するのに使われたコンストラクターを返します。	51	79	48	10	51	10
`Symbol.@@toPrimitive` [Symbol.toPrimitive]() メソッドは、Symbol オブジェクトをプリミティブ値に変換します。	47	15	44	10	47	10
`Symbol.Symbol` Symbol() 関数は、シンボル型のプリミティブ値を返します。	38	12	36	9	38	9
`Symbol.description` description は Symbol 値のアクセサープロパティで、このシンボルの説明を格納した文字列を返し、シンボルに説明がない場合は undefined を返します。	70	79	63	12.1	70	12.2
`Symbol.for` Symbol.for() は静的メソッドで、引数で与えられたキーでランタイム全体のシンボルレジストリー内に存在しているシンボルを検索し、見つかった場合はそれを返します。さもなければ、新しいシンボルがこのキーでグローバルシンボルレジストリー内に生成されます。	40	12	36	9	40	9
`Symbol.hasInstance` Symbol.hasInstance は静的データプロパティで、ウェルノウンシンボルの Symbol.hasInstance を表します。Operators/instanceof 演算子は右辺オペランドに対して、コンストラクターオブジェクトがオブジェクトをそのインスタンスとして認識するかどうかを判断する際に使用されるメソッドを、このシンボルで探します。	50	15	50	10	50	10
`Symbol.isConcatSpreadable` Symbol.isConcatSpreadable は静的データプロパティで、ウェルノウンシンボルの Symbol.isConcatSpreadable を表します。Array.prototype.concat() メソッドは、連結される各オブジェクトに対してこのシンボルを探し、配列風オブジェクトとして扱って配列要素を平坦化すべきかどうかを判断します。	48	15	48	10	48	10
`Symbol.iterator` Symbol.iterator は静的データプロパティで、ウェルノウンシンボルの Symbol.iterator を表します。反復可能プロトコルは、オブジェクトのイテレーターを返すメソッドを、このシンボルで探します。オブジェクトが反復可能であるためには、[Symbol.iterator] キーを持っていなければなりません。	43	12	36	10	43	10
`Symbol.keyFor` Symbol.keyFor() 静的メソッドは、指定されたシンボルについて、共有シンボルキーをグローバルシンボルレジストリーから受け取ります。	40	12	36	9	40	9
`Symbol.match` Symbol.match は静的データプロパティで、ウェルノウンシンボルの Symbol.match を表します。String.prototype.match() メソッドは第 1 引数に対して、入力文字列と現在のオブジェクトとの照合に使われるメソッドを、このシンボルで探します。このシンボルは、オブジェクトが正規表現として扱われるべきかどうかを決定するためにも使用されます。	50	79	40	10	50	10
`Symbol.matchAll` Symbol.matchAll は静的データプロパティで、ウェルノウンシンボルの Symbol.matchAll を表します。String.prototype.matchAll() メソッドは最初の引数に対して、文字列に対する現在のオブジェクトの照合を行うイテレーターを返すメソッドを、このシンボルで探します。	73	79	67	13	73	13
`Symbol.replace` Symbol.replace は静的データプロパティで、ウェルノウンシンボルの Symbol.replace を表します。String.prototype.replace() および String.prototype.replaceAll() メソッドは第 1 引数で、現在のオブジェクトに一致する部分文字列を置き換えるメソッドを、このシンボルで探します。	50	79	49	10	50	10
`Symbol.search` Symbol.search は静的データプロパティで、ウェルノウンシンボルの Symbol.search を表します。String.prototype.search() メソッドは第一引数から、文字列内で現在のオブジェクトに一致する場所を返すメソッドを、このシンボルで探します。	50	79	49	10	50	10
`Symbol.species` Symbol.species は静的データプロパティで、ウェルノウンシンボルの Symbol.species を表します。オブジェクトのコピーを作成するメソッドは、このシンボルで、コピーを作成するときに使用するコンストラクター関数を探すことがあります。	51	13	41	10	51	10
`Symbol.split` Symbol.split は静的データプロパティで、ウェルノウンシンボルの Symbol.split を表します。String.prototype.split() メソッドは、最初の引数でこのシンボルを検索し、現在のオブジェクトと一致するインデックスで文字列を分割するメソッドを呼び出します。	50	79	49	10	50	10
`Symbol.toPrimitive` Symbol.toPrimitive は静的データプロパティで、ウェルノウンシンボルの Symbol.toPrimitive を表します。すべての型変換アルゴリズムにおいて、オブジェクト上でこのシンボルを使って、その valueOf() や toString() メソッドを使用する前に、望ましい型を受け入れ、オブジェクトのプリミティブ表現を返すメソッドを調べます。	47	15	44	10	47	10
`Symbol.toString` toString() メソッドは、指定された Symbol オブジェクトを表す文字列を返します。	38	12	36	9	38	9
`Symbol.toStringTag` Symbol.toStringTag は静的データプロパティで、ウェルノウンシンボルの Symbol.toStringTag を表します。Object.prototype.toString() は this に対して、このオブジェクトの型を表す文字列を持つプロパティを、このシンボルで探します。	49	15	51	10	49	10
`Symbol.toStringTag.dom objects` 2020 年半ばの WebIDL 仕様変更により、ブラウザーはすべての DOM プロトタイプオブジェクトに Symbol.toStringTag プロパティを追加します。たとえば、HTMLButtonElement の Symbol.toStringTag プロパティにアクセスするには、次のようにします。	50	79	78	14	50	14
`Symbol.valueOf` valueOf() は Symbol 値のメソッドで、このシンボル値を返します。	38	12	36	9	38	9

1+対応 (バージョン) 未対応 ※注釈ありサブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT

const id = Symbol('id');
const user = { [id]: 123, name: 'Taro' };

user[id]; // 123
Object.keys(user); // ['name'] (Symbols are not enumerated)

// Well-known Symbol
class Range {
  constructor(start, end) { this.start = start; this.end = end; }
  [Symbol.iterator]() {
    let current = this.start;
    return { next: () => ({ value: current, done: current++ > this.end }) };
  }
}

ライブデモ

Symbol one

sameDescriptiontext has Symbol create also, each that to differentvalue in exists and inspect it..

プレビュー全画面表示

privateproperty. simulate

Symbol ki- to and, Object.keys etc. Normal. columnraise from is hide..

プレビュー全画面表示

Iterateprocessing. kastamize

Looppossible to.. with Symbol.iterator implementation,. Object for...of.

プレビュー全画面表示

実務での使いどころ

Symbol の活用

一意で不変のプリミティブ値。プロパティキーの衝突回避やオブジェクトの内部動作のカスタマイズに使用。

注意点

特になし。すべての主要ブラウザで安定して動作する。

参考リンク

MDN Web Docs — Symbol

Powered by web-features

概要

対応ブラウザ

基本構文

ライブデモ

Symbol one

privateproperty. simulate

Iterateprocessing. kastamize

実務での使いどころ

Symbol の活用

注意点

アクセシビリティ

参考リンク