はじめに
Udemyの【JS】ガチで学びたい人のためのJavaScriptメカニズムの講座の振り返りです。
前回の記事
目的
- 関数とオブジェクトについての理解を深める
本題
1.Symbol
Symbolとはプロパティの重複を避けるために必ず一意の値を返す関数
例1
Symbolの使い方
// Symbolを定義
// コンストラクター関数とは違い、new演算子を使わない
const a = Symbol();
// Symbol()と出力される
console.log(a);
// 文字列や数値も引数として渡せる
const b = Symbol("hello");
// Symbol(hello)と出力される
console.log(b);
// 例えば同じ値を別な変数に入れると
const c = Symbol("hello");
console.log(c);
// 下記の結果はfalseとなる
console.log(b === c);
// 一意の値なのでそれぞれ別な値として識別される
// Symbolはプリミティブ型のひとつなので、typeofで確認するとsymbolというデータ型となる
console.log(typeof c);
例2
どのように利用されているのか
// new演算子を使用して文字列を作る
const str = new String("Jun");
console.log(str);
// 下記のように記述するとSymbolをキーにしたプロパティがプロトタイプに格納される
String.prototype[s] = function(){
}
// 出力結果の中にSymbol(hello): ƒ () が追加される
String.prototype[s2] = function(){
}
// このようにしても同じ名前のプロパティが格納されているが、別々のプロパティとして認識される
例3
より詳しい使い方
const s = Symbol("hello");
const s2 = Symbol("hello");
console.log(typeof s);
const str = new String("Jun");
console.log(str);
String.prototype[s] = function(){
// returnでhello とthis(外で定義した値)を返す
return "hello " + this;
}
const jun = "Jun";
// Symbolを使っているので、ドット記法ではなくブラケット記法で書く
console.log(jun[s]());
// hello junと出力される
今日はここまで！