ECMA6學(xué)習(xí)-變量聲明 和 數(shù)組對(duì)象解構(gòu)賦值

變量聲明 和 數(shù)組對(duì)象解構(gòu)賦值,本編主要學(xué)習(xí) let const 使用語法景图,注意事項(xiàng)。以及數(shù)組和對(duì)象的解構(gòu)賦值缩膝。

let 聲明

作用:let作用主要是定義一個(gè)局部變量.

使用語法:
let hello = "hello word";

使用注意事項(xiàng):

  1. let 聲明的變量只在聲名的塊級(jí)內(nèi)有作用
  2. let 變量必須先聲明后使用,否則會(huì)報(bào)錯(cuò)
  3. let 變量不能在一個(gè)作用域里多次聲明
  4. let 在函數(shù)內(nèi)聲明時(shí)耍属,盡量不與參數(shù)同名萄唇。

錯(cuò)誤示例:

    //1.let是塊級(jí)作用域
    function f(input) {
        let a = 100;
        if (input) {
            let b = a + 1;  //運(yùn)行正確
            return b;
        }
        return b;  //錯(cuò)誤 , b沒有被定義
    }

    //2.let 變量必須先聲明后使用
    a++;
    let a;

    //3.不能在同一作用域重復(fù)定義
    let y = 2;
    let y = 3;  

    var x = 1;
    let x = 2; 

    //4.與參數(shù)重復(fù)的情況

    //錯(cuò)誤:
    function funA(x) {
        let x = 100;  //報(bào)錯(cuò)寸宵,x已經(jīng)在函數(shù)參數(shù)聲明了
    }

    //正確:
    function funB(codition,x) {
        if (codition) {
            let x = 100; //運(yùn)行正確超全,x在一新的作用域中
            return x;
        }
        return x;
    }

const 聲明

作用:const作用主要是定義一個(gè)常量

使用語法:
const PI = 3.1415;

使用語法:
1.對(duì)常量直接賦值將會(huì)出錯(cuò)
2.常量如果是對(duì)象,對(duì)象屬性是可以重新賦值的;
3.常量的作用域與let 相同; 只在聲明的塊級(jí)有用
4.常量不可重復(fù)定義

錯(cuò)誤示例:

    //1.常量不可修改
    const PI = 3.1415;
    PI = 3;  //報(bào)錯(cuò)邓馒,常量不可修改
    
    //2.對(duì)象常量不可直接修改,對(duì)象屬性可以更改
    const kitty = {
        name: "Aurora",
        numLives:9
    };

    //錯(cuò)誤
    kitty = {
        name: "Danielle",
        numLives:9
    };

    //正確
    kitty.name = "Kitty";
    kitty.numLives--; 

    //3.常量作用域
    if (codition) {
        const  MAX = 5;
    }
    console.log(MAX) // MAX 在此處不可見

    //4.不能重復(fù)聲明
    var message = "Hello";
    let age = 25;

    //以下兩行都是錯(cuò)誤
    const message = "Goodbye";
    const age = 26;

解構(gòu)賦值

作用:解構(gòu)賦值可將一個(gè)復(fù)雜類型的數(shù)據(jù)蛾坯,如數(shù)組和對(duì)象光酣,分解匹配賦值給多個(gè)獨(dú)立的變量。

使用語法:

  • 數(shù)組解構(gòu)
    let [a,b,c] = [1,2,3];
  • 對(duì)象解構(gòu)
    let {foo, bar} = {foo: "aaa",bar:"bbb"};

使用注意事項(xiàng):
1.數(shù)組解構(gòu)按順序脉课,對(duì)象解構(gòu)則無關(guān)順序據(jù)屬性名取值救军。
2.對(duì)于不成功的的解構(gòu),最值會(huì)賦值undefined
3.對(duì)undefined 和 null 進(jìn)行解構(gòu)會(huì)報(bào)錯(cuò)
4.解構(gòu)賦值允許指定默認(rèn)值
5.解構(gòu)賦值對(duì)于var let const 都是適用的

數(shù)組解構(gòu)使用示例:

    //解構(gòu)數(shù)組
    var [first,second] = [1,2];
    first; //1
    second; //2

    //解構(gòu)多維數(shù)組
    var [foo,[[bar],baz]] = [1,[[2],3]];
    foo;  //1
    bar;  //2
    baz;  //3

    var [,,third] = ["foo","bar","baz"];
    third; //baz

    //解構(gòu)...數(shù)組
    var [head,...tail] = [1,2,3,4];
    head; //1;
    tail  //[2,3,4];

    //解構(gòu)失敗賦值undefined
    var [foo] = [];
    var [foo] = 1;
    var [foo] = 'Hello';
    var [foo] = false;
    var [foo] = NaN;

    //以下兩行解構(gòu)會(huì)報(bào)錯(cuò)
    const [foo] = undefined;
    const [foo] = null;

    //指定解構(gòu)的默認(rèn)值
    var [foo = true] = [];
    foo; //true

對(duì)象解構(gòu)示例:

    //解構(gòu)對(duì)象
    let test = { x: 0, y: 10, width: 15, height: 20 };
    let { x, y, width, height } = test;
    console.log(x, y, width, height);  //輸出0,10,15,20

    //解構(gòu)對(duì)象按屬性名取值,無關(guān)順序
    let { foo, bar } = { foo: 'aaa', bar: 'bbb'};
    foo //'aaa';
    bar //'bbb';

    let {bar,foo} = { foo: 'aaa', bar: 'bbb'};
    foo //'aaa';
    bar //'bar';

    //屬性名不對(duì),賦值為undefined
    let { baz , foo} = { foo: 'aaa', bar: 'bbb'};
    baz; //undefined  //解構(gòu)不成功
    foo; //'aaa'

    //重命名解構(gòu)屬性,重命名后原名稱不可取值倘零。
    let { foo: baz } = { foo: 'aaa', bar: 'bbb'};
    baz; //'aaa';
    foo; // 出錯(cuò)

    //解構(gòu)多維對(duì)象
    var o = {
        p: [
            "Hello",
            { y: "word" }
        ]
    };

    var { p: [x, { y }] } = o;
    x  //"Hello";
    y  //"word";

    //指定默認(rèn)值
    var { x = 3 } = {};
    x //3

解構(gòu)賦值的具體使用點(diǎn):

  1. 交換變量值
  2. 從函數(shù)返回多個(gè)值
  3. 更方便的接收json類型參數(shù)對(duì)象
  4. 更方便設(shè)置默認(rèn)參數(shù)
  5. 更方例的遍歷對(duì)象
  6. 模塊加載更清晰

本文為我個(gè)人學(xué)習(xí)ECMA6的筆記唱遭,內(nèi)容及案例多為書本抄寫,未做代碼正確性測(cè)試呈驶,內(nèi)容僅供參考拷泽,不保證文中觀點(diǎn)的及代碼的正確性。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市司致,隨后出現(xiàn)的幾起案子拆吆,更是在濱河造成了極大的恐慌,老刑警劉巖脂矫,帶你破解...
    沈念sama閱讀 217,907評(píng)論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件枣耀,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡庭再,警方通過查閱死者的電腦和手機(jī)捞奕,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,987評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來拄轻,“玉大人颅围,你說我怎么就攤上這事〔该校” “怎么了谷浅?”我有些...
    開封第一講書人閱讀 164,298評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)奶卓。 經(jīng)常有香客問我一疯,道長(zhǎng),這世上最難降的妖魔是什么夺姑? 我笑而不...
    開封第一講書人閱讀 58,586評(píng)論 1 293
  • 正文 為了忘掉前任墩邀,我火速辦了婚禮,結(jié)果婚禮上盏浙,老公的妹妹穿的比我還像新娘眉睹。我一直安慰自己,他們只是感情好废膘,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,633評(píng)論 6 392
  • 文/花漫 我一把揭開白布竹海。 她就那樣靜靜地躺著,像睡著了一般丐黄。 火紅的嫁衣襯著肌膚如雪斋配。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,488評(píng)論 1 302
  • 那天灌闺,我揣著相機(jī)與錄音艰争,去河邊找鬼。 笑死桂对,一個(gè)胖子當(dāng)著我的面吹牛甩卓,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播蕉斜,決...
    沈念sama閱讀 40,275評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼逾柿,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼缀棍!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起鹿寻,我...
    開封第一講書人閱讀 39,176評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤睦柴,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后毡熏,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體坦敌,經(jīng)...
    沈念sama閱讀 45,619評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,819評(píng)論 3 336
  • 正文 我和宋清朗相戀三年痢法,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了狱窘。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,932評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡财搁,死狀恐怖蘸炸,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情尖奔,我是刑警寧澤搭儒,帶...
    沈念sama閱讀 35,655評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站提茁,受9級(jí)特大地震影響淹禾,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜茴扁,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,265評(píng)論 3 329
  • 文/蒙蒙 一铃岔、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧峭火,春花似錦毁习、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,871評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至稍浆,卻和暖如春隆檀,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背粹湃。 一陣腳步聲響...
    開封第一講書人閱讀 32,994評(píng)論 1 269
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留泉坐,地道東北人为鳄。 一個(gè)月前我還...
    沈念sama閱讀 48,095評(píng)論 3 370
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像腕让,于是被迫代替她去往敵國(guó)和親孤钦。 傳聞我的和親對(duì)象是個(gè)殘疾皇子歧斟,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,884評(píng)論 2 354

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