JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのSymbol.toString()メソッドとは？シンボルを文字列に変換する方法を解説

JavaScriptのSymbol.toString()メソッドは、指定したシンボル（Symbol）オブジェクトの文字列表現を返すメソッドです。デバッグ時やログ出力の際に、シンボルの内容を確認したい場合に非常に便利です。

基本構文

symbol.toString()

このメソッドは引数を受け取らず、「Symbol(説明)」という形式の文字列を返します。ここでの「説明」とは、シンボルを生成する際に渡した説明文（description）のことです。

サンプルコード

以下は、Symbol.toString()メソッドを使って、複数のシンボルの文字列表現を取得して表示する具体例です。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   div {
      font-size: 20px;
      font-weight: 500;
   }
</style>
</head>
<body>
<h1>JavaScript symbol.toString() メソッド</h1>
<div class="sample"></div>
<button class="Btn">ここをクリック</button>
<h3>上のボタンをクリックすると、シンボルの文字列表現が表示されます</h3>
<script>
   let fillEle = document.querySelector(".sample");
   const symbol = Symbol.for("HELLO");
   const symbol1 = Symbol.for("NEW");
   const symbol2 = Symbol.for(711);
   document.querySelector(".Btn").addEventListener("click", () => {
      fillEle.innerHTML += symbol.toString() + "<br>";
      fillEle.innerHTML += symbol1.toString() + "<br>";
      fillEle.innerHTML += symbol2.toString() + "<br>";
   });
</script>
</body>
</html>

実行結果

ブラウザで上記のコードを実行すると、まず次のような画面が表示されます。

JavaScriptのSymbol.toString()メソッドとは？シンボルを文字列に変換する方法を解説

「ここをクリック」ボタンを押すと、以下のように各シンボルの文字列表現が出力されます。

JavaScriptのSymbol.toString()メソッドとは？シンボルを文字列に変換する方法を解説

出力される内容は以下の通りです。

  • Symbol.for("HELLO") → Symbol(HELLO)
  • Symbol.for("NEW") → Symbol(NEW)
  • Symbol.for(711) → Symbol(711)

注意点：シンボルは暗黙的に文字列化できない

シンボルは他のプリミティブ型と異なり、テンプレートリテラルや文字列連結による暗黙的な型変換が許されていません。例えば、以下のコードはエラーになります。

const sym = Symbol("test");
console.log(`値: ${sym}`); // TypeError: Cannot convert a Symbol value to a string
console.log("値: " + sym); // 同様にTypeErrorが発生

そのため、シンボルを文字列として扱いたい場合は、toString()メソッドかString()関数による明示的な変換が必要です。どちらも同じ結果を返します。

console.log(sym.toString()); // Symbol(test)
console.log(String(sym));    // Symbol(test)
  1. JavaScriptのSymbol.toStringTagシンボルとは？オブジェクトの型説明をカスタマイズする方法

    Symbol.toStringTagは、JavaScriptにおける「ウェルノウンシンボル（Well-known Symbols）」の一つで、最もよく知られているシンボルです。これは文字列値を持つプロパティであり、オブジェクトが生成される際に、そのオブジェクトの型に関する説明（description）を付与するために使用されます。 通常、Object.prototype.toString()メソッドを呼び出すと「[object Object]」のような文字列が返されますが、Symbol.toStringTagを独自に定義することで、この表示内容を自由にカスタマイズできます。 Symbol.to

  2. JavaScriptのSymbol（シンボル）とは？特徴と基本的な使い方を解説

    JavaScriptにおけるSymbol（シンボル）は、ES6（ECMAScript 2015）で新たに導入されたプリミティブデータ型の一つです。シンボルは呼び出されるたびに必ず完全に一意（ユニーク）な値を返し、組み込みのSymbol()ファクトリ関数を使って生成します。Symbolの主な特徴文字列や数値と同じくプリミティブ型として扱われるSymbol()を呼び出すたびに、たとえ同じ引数（説明用の文字列）を渡しても、必ず異なる新しいシンボルが生成されるオブジェクトのプロパティキーとして利用でき、名前の衝突を防ぐことができるJavaScriptシンボルのサンプルコード以下のコードでは、同じ文字列