内部メソッドとSymbolの連携 | シンボルとユニークプロパティ | JavaScript 超完全入門 基本から発展までのすべて

amazon

スマイルSALE

--:--:--

～

検索

ad. 価格範囲を指定して商品を探せます

内部メソッドとSymbolの連携とは？

JavaScriptには、オブジェクトの動作を内部的に制御する内部メソッド（Internal Methods）や内部スロット（Internal Slots）という仕組みがあります。

通常、これらを直接呼び出すことはできませんが、一部の動作はSymbolを利用してカスタマイズできます。

例えば、文字列への変換方法や、for...ofでの繰り返し方法などを独自に定義できます。

主なSymbolと役割

JavaScriptには、特別な動作を定義するための組み込みSymbolが用意されています。

これらは通常のアプリケーション開発で頻繁に利用するものではありませんが、ライブラリ開発や高度なカスタマイズでは役立ちます。

Symbol.toStringTag

Symbol.toStringTagを利用すると、Object.prototype.toString()の表示を変更できます。

使用例

const myObject = {
    [Symbol.toStringTag]: "MyCustomObject"
};

console.log(Object.prototype.toString.call(myObject));

// [object MyCustomObject]

この機能は、独自クラスやライブラリでオブジェクトの種類を分かりやすく表示したい場合に利用されます。

Symbol.iterator

Symbol.iteratorを実装すると、自作オブジェクトをfor...ofで繰り返し処理できるようになります。

使用例

const iterableObject = {
    data: ["apple", "banana", "cherry"],

    *[Symbol.iterator]() {
        for (const item of this.data) {
            yield item;
        }
    }
};

for (const value of iterableObject) {
    console.log(value);
}

// apple
// banana
// cherry

現在では、このようにジェネレーター関数を利用した実装が分かりやすく、よく利用されています。

Symbol.toPrimitive

Symbol.toPrimitiveは、オブジェクトが文字列や数値へ変換される際の動作を定義します。

使用例

const myNumber = {
    value: 42,

    [Symbol.toPrimitive](hint) {
        if (hint === "string") {
            return `数値は ${this.value} です`;
        }

        return this.value;
    }
};

console.log(+myNumber);
console.log(`${myNumber}`);

// 42
// 数値は 42 です

用途によって数値や文字列への変換方法を変更できます。

Symbol.replace

Symbol.replaceを実装すると、replace()で利用される置換処理を自由に定義できます。

使用例

const replacer = {
    [Symbol.replace](target, replacement) {
        return target.split(" ").join(replacement);
    }
};

const result = "Hello World".replace(replacer, "-");

console.log(result);

// Hello-World

このように、正規表現以外のオブジェクトでもreplace()の動作をカスタマイズできます。

初心者が知っておきたいポイント

• SymbolはJavaScriptの内部動作をカスタマイズするための仕組みである。
• 通常のWebアプリでは利用する機会は多くない。
• Symbol.iteratorは比較的利用する機会がある。
• Symbol.toPrimitiveやSymbol.toStringTagはライブラリ開発で使われることが多い。
• まずは存在を知っておけば十分であり、初心者がすべて覚える必要はない。

まとめ

• JavaScriptには内部動作を変更するための組み込みSymbolが用意されている。
• Symbol.iteratorを利用するとオブジェクトを繰り返し処理できる。
• Symbol.toPrimitiveではプリミティブ値への変換方法を定義できる。
• Symbol.toStringTagではオブジェクトの表示名を変更できる。
• 高度な機能であり、ライブラリやフレームワーク開発で利用されることが多い。