6時だョ!!全員集合!!

Rails・JavaScrictを中心にアウトプットします。

2021年11月11日 JavaScript (JS Primer) toStringメソッド

toStringメソッド

  • オブジェクトのtoStringメソッドは、オブジェクト自身を文字列化するメソッドです。
  • Stringコンストラクタ関数は、引数に渡されたオブジェクトのtoStringメソッドを呼び出しています。
const obj = { key: "value" };
console.log(obj.toString()); // => "[object Object]"

console.log(String(obj)); // => "[object Object]"

toStringメソッドは上書きできます。以下の場合、toStirngメソッドをcustomObjectに定義すると、String(customObject)で、customObjectに定義したtoStringメソッドを実行します。

// 独自のtoStringメソッドを定義
const customObject = {
    // メソッドの短縮記法でメソッドを定義している。
    toString() {
        return "custom value";
    }
};
console.log(String(customObject)); // => "custom value"

[コラム] オブジェクトのプロパティ名は文字列化される

オブジェクトのプロパティへアクセスする際に、指定したプロパティ名は暗黙的に文字列に変換されます。
ブラケット記法では、オブジェクトをプロパティ名に指定することもできますが、これは意図したようには動作しません。 なぜなら、オブジェクトを文字列化すると"[object Object]"という文字列になるためです。

const obj = {};
const keyObject1 = { a: 1 }; 
const keyObject2 = { b: 2 };
// どちらも同じプロパティ名("[object Object]")に代入している
obj[keyObject1] = "1";
obj[keyObject2] = "2"; // keyObject1は同じプロパティ名のため上書きされる
console.log(obj); //  { "[object Object]": "2" }

ただし、Symbolだけは文字列化されずにオブジェクトのプロパティ名として扱えます。 不変なデータ型で、オブジェクトのプロパティ識別子として使われたりします。

Symbol("abc") === Symbol("abc"); // false

オブジェクトのプロパティを列挙する方法

オブジェクトのプロパティを列挙する方法として、次の3つの静的メソッドが挙げられます。

  • Object.keysメソッド: オブジェクトのプロパティ名を要素とした配列を返します。
  • Object.valuesメソッド: オブジェクトの値を要素とした配列を返します。
  • Object.entriesメソッド: オブジェクトのプロパティ名と値(プロパティ)の配列を要素とした配列を返します。 例: [[a: b], [c: d], [e: f]]

これらのメソッドは引数にオブジェクトを指定します。

const obj = {
    "one": 1,
    "two": 2,
    "three": 3
};

// `Object.keys`はキーを列挙した配列を返す
console.log(Object.keys(obj)); // => ["one", "two", "three"]
// `Object.values`は値を列挙した配列を返す
console.log(Object.values(obj)); // => [1, 2, 3]
// `Object.entries`は[キー, 値]の配列を返す
console.log(Object.entries(obj)); // => [["one", 1], ["two", 2], ["three", 3]]

参考

JavaScript Primer toStringメソッド