ES6學(xué)習(xí)筆記(三):變量的解構(gòu)賦值

ES6允許按照一定的模式投放,從數(shù)組和對(duì)象中提取值蒋荚,對(duì)變量進(jìn)行賦值,這被稱為解構(gòu)戈钢。解構(gòu)賦值在實(shí)際開發(fā)中可以大量減少我們的代碼量痹仙,并且讓我們的程序結(jié)構(gòu)更清晰。
<b>數(shù)組的解構(gòu)賦值</b>
以前我們?yōu)樽兞抠x值殉了,只能直接指定值开仰。比如以下的代碼:

let a=1;
let b=2;
let c=3;

現(xiàn)在我們可以用數(shù)組解構(gòu)的方式來(lái)進(jìn)行賦值。

let [a,b,c] = [1,2,3];

上面的代碼薪铜,是安裝位置的對(duì)象關(guān)系對(duì)應(yīng)變量賦值众弓。注意在賦值的時(shí)候,等號(hào)左邊和右邊的形式要統(tǒng)一隔箍,不統(tǒng)一解構(gòu)將失敗谓娃。

let [a,b,[c,d,e],f] = [0,1,[2,3,4],5];

如果等號(hào)兩邊形式不一樣,很可能獲得Undefined或者直接報(bào)錯(cuò)蜒滩。
解構(gòu)賦值是允許使用默認(rèn)值的滨达。

let [ t =true] = [ ];
console.log(t); //true
let [ a,b,c=" zqq"] = ['i','am' ];
console.log(a+b+c); // i am zqq

另外需注意,undefined相當(dāng)于什么都沒有帮掉,null相當(dāng)于有值弦悉,但值為null。
<b>對(duì)象的解構(gòu)賦值</b>
解構(gòu)不僅可以用于數(shù)組還可以用于對(duì)象蟆炊。

let {cat,dog} = {cat:'Mike','dog':'John'};
console.log(cat+dog);  //MikeJohn

<b>注意:</b>對(duì)象的解構(gòu)與數(shù)組有一個(gè)重要的不同稽莉,數(shù)組的元素是按次序排列的,變量的取值由它的位置決定涩搓;而對(duì)象的屬性沒有次序污秆,變量必須與屬性同名劈猪,才能取到正確的值。
另外良拼,如果在解構(gòu)之前就定義了變量战得,這時(shí)候你再解構(gòu)會(huì)出現(xiàn)問題,編譯會(huì)出錯(cuò)。

let cat;
{cat} = {cat : 'Mike'};
console.log(cat);

要解決報(bào)錯(cuò)庸推,使程序正常常侦,只要在解構(gòu)的語(yǔ)句外包加一個(gè)圓括號(hào)就可以了。

let cat;
({cat} = {cat : 'Mike'});
console.log(cat);

<b>字符串解構(gòu)</b>
字符串解構(gòu)相當(dāng)于字符串被轉(zhuǎn)換成了一個(gè)類似數(shù)組的對(duì)象贬媒。

const [a,b,c,d] = "Mike";
console.log(a);  //M
console.log(b);  //i
console.log(c);  //k
console.log(d);  //e
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末聋亡,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子际乘,更是在濱河造成了極大的恐慌坡倔,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,386評(píng)論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件脖含,死亡現(xiàn)場(chǎng)離奇詭異罪塔,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)养葵,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,142評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門征堪,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人港柜,你說我怎么就攤上這事请契】劝瘢” “怎么了夏醉?”我有些...
    開封第一講書人閱讀 164,704評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)涌韩。 經(jīng)常有香客問我畔柔,道長(zhǎng),這世上最難降的妖魔是什么臣樱? 我笑而不...
    開封第一講書人閱讀 58,702評(píng)論 1 294
  • 正文 為了忘掉前任靶擦,我火速辦了婚禮,結(jié)果婚禮上雇毫,老公的妹妹穿的比我還像新娘玄捕。我一直安慰自己,他們只是感情好棚放,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,716評(píng)論 6 392
  • 文/花漫 我一把揭開白布枚粘。 她就那樣靜靜地躺著,像睡著了一般飘蚯。 火紅的嫁衣襯著肌膚如雪馍迄。 梳的紋絲不亂的頭發(fā)上福也,一...
    開封第一講書人閱讀 51,573評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音攀圈,去河邊找鬼暴凑。 笑死,一個(gè)胖子當(dāng)著我的面吹牛赘来,可吹牛的內(nèi)容都是我干的现喳。 我是一名探鬼主播,決...
    沈念sama閱讀 40,314評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼犬辰,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼拿穴!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起忧风,我...
    開封第一講書人閱讀 39,230評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤默色,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后狮腿,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體腿宰,經(jīng)...
    沈念sama閱讀 45,680評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,873評(píng)論 3 336
  • 正文 我和宋清朗相戀三年缘厢,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了吃度。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,991評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡贴硫,死狀恐怖椿每,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情英遭,我是刑警寧澤间护,帶...
    沈念sama閱讀 35,706評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站挖诸,受9級(jí)特大地震影響汁尺,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜多律,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,329評(píng)論 3 330
  • 文/蒙蒙 一痴突、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧狼荞,春花似錦辽装、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,910評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至,卻和暖如春殷勘,著一層夾襖步出監(jiān)牢的瞬間此再,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,038評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工玲销, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留输拇,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,158評(píng)論 3 370
  • 正文 我出身青樓贤斜,卻偏偏與公主長(zhǎng)得像策吠,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子瘩绒,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,941評(píng)論 2 355

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