TypeScriptのSymbolを使用する場面

Typescript Javascript

TypeScriptのsymbol型

TypeScriptのsymbol型は、ES6 (ECMAScript 2015)で導入されたプリミティブデータ型で、ユニークで変更不可の識別子を生成するために使用されます。
symbol型の値は、Symbol()関数を呼び出すことで生成されます。

基本的な使い方

const sym1 = Symbol();
const sym2 = Symbol("description");

console.log(sym1 === sym2); // false: 各Symbolはユニーク

Symbolのプロパティとしての使用

オブジェクトのプロパティキーとしてsymbolを使用すると、プロパティはユニークになり、名前の衝突を避けることができます。

const sym = Symbol();

const obj = {
  [sym]: "value"
};

console.log(obj[sym]); // "value"

Well-known Symbols

TypeScriptでは、JavaScriptに組み込まれているいくつかの「Well-known Symbols」をサポートしています。
これらは特定の言語機能をカスタマイズするために使用されます。

  • Symbol.iterator: オブジェクトを反復可能にする
  • Symbol.asyncIterator: 非同期反復をサポートする
  • Symbol.hasInstance: instanceof演算子のカスタム動作を定義する
  • Symbol.toStringTag: Object.prototype.toStringのカスタムタグを定義する

例: Symbol.iterator

const iterable = {
  *[Symbol.iterator]() {
    yield 1;
    yield 2;
    yield 3;
  }
};

for (const value of iterable) {
  console.log(value); // 1, 2, 3
}

Symbolの利点

1. 名前の衝突を防ぐ:
シンボルはユニークなので、異なるライブラリやコードベースで同じ名前のプロパティを使用しても衝突しません。
2. 非列挙プロパティ:
シンボルプロパティは、デフォルトでfor...inループやObject.keys()などで列挙されません。

注意点

シンボルはtoStringや+演算子で文字列に変換されないため、文字列操作に使用することはできません。
また、シンボルは独自の識別子としての役割に限定されているため、一般的なデータ値としての使用には向いていません。

これらの機能を活用することで、より安全で衝突の少ないコードを作成することができます。

symbolを使用する具体的な場面

symbolを使用する具体的な場面はいくつかあります。
以下にいくつかの例を示します。

1. ユニークなプロパティキーの作成

シンボルはユニークなプロパティキーを作成するために使用できます。
これにより、異なるライブラリやコードベースで同じ名前のプロパティを使用しても衝突を避けることができます。

const sym1 = Symbol('key');
const sym2 = Symbol('key');

const obj = {
  [sym1]: 'value1',
  [sym2]: 'value2',
};

console.log(obj[sym1]); // 'value1'
console.log(obj[sym2]); // 'value2'

2. クラスのプライベートプロパティ

シンボルを使用してクラスのプライベートプロパティを実現することができます。
シンボルで定義されたプロパティは外部からアクセスされにくいため、プライバシーを保つのに役立ちます。

const _privateProperty = Symbol('privateProperty');

class MyClass {
  constructor() {
    this[_privateProperty] = 'secret';
  }

  getPrivateProperty() {
    return this[_privateProperty];
  }
}

const instance = new MyClass();
console.log(instance.getPrivateProperty()); // 'secret'
console.log(instance._privateProperty); // undefined

3. Well-known Symbolsを使用したカスタム動作

Well-known Symbolsを使って、特定のJavaScript動作をカスタマイズすることができます。
例えば、Symbol.iteratorを使用してカスタム反復可能オブジェクトを作成できます。

const myIterable = {
  *[Symbol.iterator]() {
    yield 1;
    yield 2;
    yield 3;
  }
};

for (const value of myIterable) {
  console.log(value); // 1, 2, 3
}

4. メタデータの追加

シンボルを使用してオブジェクトにメタデータを追加することができます。
これにより、通常のプロパティと衝突することなく、追加情報を格納することができます。

const metadata = Symbol('metadata');

const obj = {
  data: 'some data',
  [metadata]: 'some metadata'
};

console.log(obj.data); // 'some data'
console.log(obj[metadata]); // 'some metadata'

5. プロトコルやインターフェースの実装

ライブラリやフレームワークが特定のシンボルを使用してプロトコルやインターフェースを定義する場合があります。
例えば、Symbol.toStringTagを使用して、Object.prototype.toStringのカスタムタグを定義できます。

class MyClass {
  get [Symbol.toStringTag]() {
    return 'MyClass';
  }
}

const instance = new MyClass();
console.log(Object.prototype.toString.call(instance)); // [object MyClass]

これらの場面でシンボルを使用することで、コードの安全性と可読性を向上させることができます。