【面試題】JS第七種數(shù)據(jù)類型Symbol詳解

JS第七種數(shù)據(jù)類型Symbol詳解

點擊打開視頻講解更加詳細(xì)

一粥庄、什么是Symbol?

Symbol是ES6中引入的一種新的基本數(shù)據(jù)類型识窿,用于表示一個獨一無二的值浮驳。它是JavaScript中的第
七種數(shù)據(jù)類型余佃,與undefined学搜、null、Number(數(shù)值)焚虱、String(字符串)骏融、Boolean(布爾值)链嘀、
Object(對象)并列。

Symbol特點:

  • Symbol的值是唯一的档玻,用來解決命名沖突問題
  • Symbol值不能與其他數(shù)據(jù)進(jìn)行運算
  • Symbol定義的對象屬性不能使用for...in循環(huán)遍歷怀泊,但是可以使用Reflect.ownKeys來獲取對象的所有鍵名

基本用法:

let a = Symbol("末晨曦吖");
console.log(a); // Symbol(末晨曦吖)
console.log(typeof a); //symbol

// 相同參數(shù) Symbol() 返回的值不相等
let b = Symbol("末晨曦吖");
console.log(a === b); //false

為什么相同參數(shù) Symbol() 返回的值不相等?误趴?霹琼?

因為使用Symbol()創(chuàng)建一個Symbol類型的值并賦值給a變量后,你就得到了一個在內(nèi)存中獨一無二的值×沟保現(xiàn)在除了通過變量a枣申,任何人在任何作用域內(nèi)都無法重新創(chuàng)建出這個值。所以就算我們通過相同參數(shù)創(chuàng)建的b看杭,結(jié)果還是不相等的忠藤。

盡管a和b都是使用Symbol()創(chuàng)建出來的,但是它們在內(nèi)存中看起來卻是這樣的:

11111111111111111.png

實際上楼雹,a變量拿到了內(nèi)存中某塊內(nèi)存的唯一引用(這里所說的引用模孩,其實就是該內(nèi)存的地址)尖阔。如果不借助a變量,你不可能再得到這個地址榨咐。因此:

a !== b;  //a和b持有的是兩塊內(nèi)存的引用
 
const c = a;  //手動把a里保存的地址保存在c變量中
a === c;  //c和a現(xiàn)在指向同一塊內(nèi)存介却,因為它們保存了同樣的地址
222222222222222.png

這種行為看似難以理解,但其實它與對象遵循相同的規(guī)則块茁,如:

let a = {};
let b = {};
 
a !== b;  //a和b各自被分配了不同的內(nèi)存齿坷,因此它們保存了不同的地址
 
//借助變量a,變量c拿到了a指向的那個對象的地址龟劲,因此兩者相等
let c = a;
a === c;

但是對于同為基本數(shù)據(jù)類型的字符串來說胃夏,它不遵循類似的規(guī)則轴或。比如:

let a = "123";
let b = "123";
 
a === b;  //返回true昌跌。兩者在常量區(qū)引用同一個字符串
3333333333333.png

我們首先通過變量a在內(nèi)存中創(chuàng)建了字符串“123”,然后在不借助變量a的情況下照雁,又通過var b = "123"拿到了對“123”這個字符串的引用蚕愤,兩者指向內(nèi)存中的同一塊內(nèi)存地址。

因此我們說饺蚊,a無法確保別的變量無法拿到它保存的地址(前提是不通過a)萍诱。但是對于var a = Symbol()這樣的語句,a變量內(nèi)保存的值是唯一的污呼,因為除了借助a變量裕坊,你永遠(yuǎn)無法得到a中保存的值。這也是Symbol的本質(zhì)燕酷。

作為屬性名的Symbol

let mySymbol = Symbol();
// 第一種寫法
let a = {};
a[mySymbol] = 'Hello!';
// 第二種寫法
let a = {
  [mySymbol]: 'Hello!'
};
// 第三種寫法
let a = {};
Object.defineProperty(a, mySymbol, { value: 'Hello!' });
// 以上寫法都得到同樣結(jié)果
a[mySymbol] // "Hello!"
注意籍凝,Symbol值作為對象屬性名時,不能用點運算符苗缩。

let a = {};
let name = Symbol();
a.name = 'lili';
a[name] = 'lucy';
console.log(a.name,a[name]);//lili,lucy
Symbol值作為屬性名時饵蒂,該屬性還是公開屬性,不是私有屬性酱讶。

二退盯、Symbol中的方法

1、Symbol.for()

我們知道Symbo()創(chuàng)建的兩個變量永遠(yuǎn)不會是相同的泻肯。那么如果我們需要重新使用同一個Symbol怎么辦渊迁,總不能需要挨個去進(jìn)行比較吧。還好灶挟,es6為我們提供了Symbol.for()方法琉朽。

參數(shù)是symbol類型的描述信息,不同于Symbol()膏萧,這個而參數(shù)只能是字符串或者是undefined漓骚,若已經(jīng)創(chuàng)建了則返回這個symbol蝌衔,否則就進(jìn)行創(chuàng)建并將這個新的symbol返回,代碼如下

let name = Symbol.for("末晨曦");
let name1 = Symbol.for("末晨曦");
console.log(name === name1);  // true

請注意蝌蹂,我們在使用創(chuàng)建描述信息為"末晨曦"的變量的時候噩斟,使用的是for,而不是Symbol()孤个,倘若使用Symbol()進(jìn)行首次創(chuàng)建剃允,for會再次創(chuàng)建一次,二者不會相等齐鲤,代碼如下:

let name = Symbol("末晨曦");
let name1 = Symbol.for("末晨曦");
console.log(name === name1);  // false

原因在于Symbol.for()會有一個登記機制斥废,使用for只會對通過for創(chuàng)建的symbol進(jìn)行檢查,不會對Symbol()創(chuàng)建的進(jìn)行檢查给郊。

2牡肉、Symbol.keyFor()

這個方法參數(shù)是一個通過Symbol.for()創(chuàng)建的symbol類型變量,返回這個symbol變量的描述信息淆九。

let name = Symbol.for("末晨曦");
console.log(Symbol.keyFor(name)); // "末晨曦"
let name1 = Symbol("末晨曦");
console.log(Symbol.keyFor(name1)); // undefined 不能查找Symbol()創(chuàng)建的變量

若對您有幫助统锤,請點擊跳轉(zhuǎn)B站一鍵三連哦!感謝支持L棵怼K橇!

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末焕蹄,一起剝皮案震驚了整個濱河市逾雄,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌腻脏,老刑警劉巖鸦泳,帶你破解...
    沈念sama閱讀 207,248評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異迹卢,居然都是意外死亡辽故,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,681評論 2 381
  • 文/潘曉璐 我一進(jìn)店門腐碱,熙熙樓的掌柜王于貴愁眉苦臉地迎上來誊垢,“玉大人,你說我怎么就攤上這事症见∥棺撸” “怎么了?”我有些...
    開封第一講書人閱讀 153,443評論 0 344
  • 文/不壞的土叔 我叫張陵谋作,是天一觀的道長芋肠。 經(jīng)常有香客問我,道長遵蚜,這世上最難降的妖魔是什么帖池? 我笑而不...
    開封第一講書人閱讀 55,475評論 1 279
  • 正文 為了忘掉前任奈惑,我火速辦了婚禮,結(jié)果婚禮上睡汹,老公的妹妹穿的比我還像新娘肴甸。我一直安慰自己,他們只是感情好囚巴,可當(dāng)我...
    茶點故事閱讀 64,458評論 5 374
  • 文/花漫 我一把揭開白布原在。 她就那樣靜靜地躺著,像睡著了一般彤叉。 火紅的嫁衣襯著肌膚如雪庶柿。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,185評論 1 284
  • 那天秽浇,我揣著相機與錄音浮庐,去河邊找鬼。 笑死兼呵,一個胖子當(dāng)著我的面吹牛兔辅,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播击喂,決...
    沈念sama閱讀 38,451評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼碰辅!你這毒婦竟也來了懂昂?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,112評論 0 261
  • 序言:老撾萬榮一對情侶失蹤没宾,失蹤者是張志新(化名)和其女友劉穎凌彬,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體循衰,經(jīng)...
    沈念sama閱讀 43,609評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡铲敛,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,083評論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了会钝。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片伐蒋。...
    茶點故事閱讀 38,163評論 1 334
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖迁酸,靈堂內(nèi)的尸體忽然破棺而出先鱼,到底是詐尸還是另有隱情,我是刑警寧澤奸鬓,帶...
    沈念sama閱讀 33,803評論 4 323
  • 正文 年R本政府宣布焙畔,位于F島的核電站,受9級特大地震影響串远,放射性物質(zhì)發(fā)生泄漏宏多。R本人自食惡果不足惜儿惫,卻給世界環(huán)境...
    茶點故事閱讀 39,357評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望伸但。 院中可真熱鬧姥闪,春花似錦、人聲如沸砌烁。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,357評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽函喉。三九已至避归,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間管呵,已是汗流浹背梳毙。 一陣腳步聲響...
    開封第一講書人閱讀 31,590評論 1 261
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留捐下,地道東北人账锹。 一個月前我還...
    沈念sama閱讀 45,636評論 2 355
  • 正文 我出身青樓,卻偏偏與公主長得像坷襟,于是被迫代替她去往敵國和親奸柬。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 42,925評論 2 344

推薦閱讀更多精彩內(nèi)容