Symbolを理解したい

はいどーもみなさんMVってますか。
どのMVか知りませんけど、僕もMVってます。
本日はみんな大好きJavaScriptのSymbolについて見ていきたいと思います。

ツクールMVでSymbol使えるのか?

SymbolはES6で追加された機能です。
最初の問題はツクールMV(RMMV)でSymbolが使えるのかどうか? ということでしょう。
こんなときはトリアコンタンさんの記事を見てみましょう。
僕はツクールMVにおけるES6のことについて調べるなら、まずはこの記事を読むようにしています。
https://qiita.com/triacontane/items/c696f314e70edb383202

が、今回は残念ながらSymbolについて触れられていませんでした。
仕方なく適当に自分で試してみたところ、普通に動きました
第一の問題はクリアです。

Symbolってそもそもなんやねん?

シンボルについて簡単に説明してみます。

シンボルは常にユニークです。
他のシンボルと同じになることは原則ありません

これに何の意味があるのかと言えば、例えばRMMVの既存クラスに新しいプロパティを追加したくなったとします。
このとき、すでに同名のプロパティがあるかもしれません。
そこでシンボル君に登場願いましょう。
シンボルを使えば、すでにあるプロパティを上書きしてしまう危険性がなくなるのです!
また、シンボルで作られたプロパティはfor-inで列挙されることがありません
プライベートなプロパティを作るのに使われることもあるようですね。

と、書きましたが、実際に僕がRMMVの既存クラスにプロパティを追加する際にシンボルを使ったことはありませんw
実際に使うときあるかなー? と悩んでいるレベルです。
まあ知識として知っておいても損はないだろうということで、この記事を書いています。

あ、ちなみにシンボルはプリミティブ型です。
ラッパーオブジェクトのSymbolを使って生成することが多いようですが、typeof演算子を使うとsymbolという型が返ってきますよ。

実際に試してみる

能書きはこの辺にしておいて、実際にSymbolを使ってみましょう。

const WHITE = Symbol();
const obj = {WHITE:'真っ白しろすけ', RED:'あかいで!'};

console.log(obj[WHITE]);
console.log(obj['WHITE']);
obj[WHITE] = 'おしろいさん';
console.log(obj[WHITE]);
console.log(obj[RED]);

上記のコードを順番に見ていきます。
まず一行目でWHITEシンボルを作成していますね。
二行目でジェネリックなオブジェクトを作成しています。
プロパティに’WHITE’と’RED’がありますね。

次にコンソールログにobj[WHITE]とobj[‘WHITE’]を出力していますね。
前者はundefinedになり、後者が’真っ白しろすけ’と表示されます。
オブジェクトのプロパティにブラケット構文でアクセスするとき、通常は文字列を指定する必要があるためですね。
つまりobj[WHITE]の値はまだ定義されていません。
ではその次の行でobj[WHITE] = ‘おしろいさん’;としているのはどうでしょうか?
今回ブラケット構文の中で指定したWHITEはシンボルです。

実はブラケット構文ではシンボルを指定してプロパティにアクセスすることもできます。
今回の場合ですと、シンボルWHITEを識別子として使用し、obj[WHITE]にアクセスしていることになるのです。

console.log(obj[WHITE]);
を実行すると、今度は’おしろいさん’と表示されます。

ここで注意したいのは、文字列とシンボルを混同しないことです。
この二つは別のものです。
事実、ここからさらにconsole.log(obj['WHITE']);と実行すると’おしろいさん’ではなく’真っ白しろすけ’が表示されます。

さてそのことをさらにわかりやすくしたのが
console.log(obj[RED]);
です。
シンボルREDは存在しないので、ここでエラーが発生します。

終わりに

自分の勉強がてらサラっとまとめてみました。
なんやら他にも色々と機能があるようなので、そのうちそれも調べてみたいと思います。
あとは……そうですね。
どこで使えばいいのかなあと悩んではいますが、使えそうな場所があれば積極的に使っていきたいと思います。
ほなそんな感じで。

フォローする