• <dd id="by9vk"><pre id="by9vk"></pre></dd>
  • <dd id="by9vk"></dd>
    <progress id="by9vk"><pre id="by9vk"></pre></progress><tbody id="by9vk"></tbody>
    <tbody id="by9vk"></tbody>

    <rp id="by9vk"><ruby id="by9vk"></ruby></rp>

    好程序員-千鋒教育旗下高端IT職業教育品牌

    400-811-9990
    我的賬戶
    好程序員

    專注高端IT職業培訓

    親愛的猿猿,歡迎!

    已有賬號,請

    如尚未注冊?

    [JavaEE] 好程序員JavaScript分享ES6相關知識

    [復制鏈接]
    136 0
    葉子老師 發表于 2019-9-29 14:38:33 | 只看該作者 |閱讀模式 打印 上一主題 下一主題
    好程序員JavaScript分享ES6相關知識,ES6增加的語法
      let&&const
      [size=0.9em]let[size=0.9em]var的區別
      let 變量名=變量值
      使用let創建變量和使用var創建變量的區別
      1、用var聲明的變量會變量提升,用let聲明的變量不會進行變量提升。
      用let創建變量
      let xxx=xxx;
      用let創建函數
      let xxx=function(){}
      創建自執行函數
      ;(function(){
      })();
      2、用let定義變量不允許在[size=0.9em]同一個作用域中重復聲明一個變量(只要當前作用域中有這個變量,不管是用var還是用let聲明的,再用let聲明的話會報錯:不能重復聲明一個變量),但是可以重復定義(賦值)
      let i=10;
      let i=20;/會報錯,
      i=20;重復賦值不會報錯
      3、暫時性死區:在代碼塊內,使用let命令聲明變量之前,該變量都是不可以使用的。
      if (true) {
      // TDZ開始
      tmp = 'abc'; // ReferenceError,報錯之后下面都不會輸出
      console.log(tmp); // ReferenceError,報錯之后下面都不會輸出
      let tmp; // TDZ結束
      console.log(tmp); // undefined
      tmp = 123;
      console.log(tmp); // 123
      }
      //下面也會報錯出現TDZ
      console.log(typeof x); // ReferenceError
      let x;
      //作為比較如果一個變量根本沒有被聲明,使用typeof反而不會報錯。
      console.log(typeof x);// "undefined"
      4ES6語法創建的變量(let)存在塊級作用域
      [ES5]
      window全局作用域
      函數執行形成的私有作用域
      [ES6]
      除了有ES5中的兩個作用域,ES6中新增加塊級作用域(我們可以把塊級作用域理解為之前學習的私有作用域,存在私有作用域和作用域鏈的一些機制)[size=0.9em]ES6中把大部分用{}包起來的都稱之為塊級作用域;
      [size=0.9em]const
      const細節知識點和let類似
      const聲明的常量只要聲明就必須賦值,而且變量的值是一定的,不能被修改;
      [size=0.9em]注意:并不是變量的值不得改動,而是變量指向的那個內存地址不得改動。對于簡單類型的數據(數值、字符串、布爾值),值就保存在變量指向的那個內存地址,因此等同于常量。但對于復合類型的數據(主要是對象和數組),變量指向的內存地址,保存的只是一個指針,const只能保證這個指針是固定的,至于它指向的數據結構是不是可變的,就完全不能控制了。因此,將一個對象聲明為常量必須非常小心。
      [size=1em][size=1em]const聲明的變量也存在暫時性死區,即只能在聲明的位置之后使用;
      JS中創建變量的方式匯總
      [size=1em][size=1em][ES5]
      · var :創建變量
      function:創建函數
      ES5中創建變量或者函數:存在變量提升,重復聲明等特征;
      [size=1em][size=1em][ES6]
      · let創建變量
      constES6中創建常量
      ES6中創建的變量或者常量:都不存在變量提升,也不可以重復聲明,而且還存在塊級作用域;
      class:創建一個類
      import:導入
      ES6中的解構賦值
      [size=1em][size=1em]按照原有值的結構,把原有值中的某一部分內容快速獲取到(快速賦值給一個變量)
      數組的解構賦值
      [size=1em][size=1em]解構賦值本身是ES6的語法規范,使用什么關鍵字來聲明這些變量是無所謂的,如果不用關鍵字來聲明,那么就相當于給window添加的自定義屬性;(嚴格模式下必須使用關鍵字來聲明,因為嚴格模式下不允許出現不用關鍵字聲明的變量;),如果解構不到值,那么變量的值就是undefined;
      let [a,b,c]=[12,23,34];
      var [d,e,f]=[35,41,63];
      console.log(a,b,c)//12,23,34;
      console.log(d,e,f)//35,41,63;
      [q,w,e]=[1,2,3];//相當于給window添加了三個屬性:q,w,e值分別為123;(嚴格模式下會報錯)
      [size=1em][size=1em]多維數組的解構賦值,可以讓我們快速的獲取到需要的結果
      let [a,b,c]=[[45,36],12,[23,43,[1,2[4,[8]]]]23,34];
      console.log(a)//[45,36]
      console.log(b)//12
      console.log(c)//[23,43,[1,2,[4,[8]]]]
      //數組中不需要解構的值可用逗號()空開,一個逗號代表空開一項
      let [,,,A]=[12,23,45];
      console.log(A)//undefined
      let [,,B]=[12,23,45]
      console.log(B)//45
      [size=1em][size=1em]在解構賦值中,支持擴展運算符即[size=1em][size=1em],只要用了擴展運算符,就相當于新生成了一個數組或者對象,如果解構不到值的話,新生成的數組或者對象為空,而不是undefined,但是擴展運算符必須放在末尾
      let [a,...c]=[12,1,4,83,34];
      console.log(a)//12
      console.log(c)//[1,4,83,34];
      let [a,...b,c]=[12,1,4,83,34];//會報錯,擴展運算符只能放在末尾;
      對象的解構賦值
      [size=1em][size=1em]對象的簡潔表示法:
      const foo = 'bar';
      const baz = {foo};
      baz // {foo: "bar"}
      // 等同于
      const baz = {foo: foo};
      [size=1em][size=1em]對象的解構與數組有一個重要的不同。數組的元素是按次序排列的,變量的取值由它的位置決定;而對象的屬性沒有次序,變量必須與屬性同名,才能取到正確的值。
      let { foo, bar } = { foo: "aaa", bar: "bbb" };
      foo // "aaa"
      bar // "bbb"
      如果變量名與屬性名不一致,必須寫成下面這樣。
      let { foo: baz } = { foo: 'aaa', bar: 'bbb' };
      baz // "aaa"
      真正被賦值的是后者,而不是前者。
      let obj = { first: 'hello', last: 'world' };
      let { first: f, last: l } = obj;
      f // 'hello'
      l // 'world'
      first//error: first is not defined
      如果要將一個已經聲明的變量用于解構賦值,必須非常小心。
      // 錯誤的寫法
      let x;
      {x} = {x: 1};//會報錯
      因為 JavaScript 引擎會將{x}理解成一個代碼塊,從而發生語法錯誤。只有不將大括號寫在行首,避免 JavaScript 將其解釋為代碼塊,才能解決這個問題。
      // 正確的寫法
      let x;
      ({x} = {x: 1});
    放在圓括號當中就可以避免 JavaScript 將其解釋為代碼塊。

    精彩內容,一鍵分享給更多人!
    收藏
    收藏0
    轉播
    轉播
    分享
    淘帖0
    支持
    支持0
    反對
    反對0
    回復

    使用道具 舉報

    您需要登錄后才可以回帖

    本版積分規則

    關注我們
    好程序員
    千鋒好程序員

    北京校區(總部):北京市海淀區寶盛北里西區28號中關村智誠科創大廈

    深圳西部硅谷校區:深圳市寶安區寶安大道5010號深圳西部硅谷B座A區605-619

    杭州龍馳智慧谷校區:浙江省杭州市下沙經濟技術開發區元成路199號龍馳智慧谷B座7層

    鄭州校區:鄭州市二七區航海中路60號海為科技園C區10層、12層

    Copyright 2007-2019 北京千鋒互聯科技有限公司 .All Right

    京ICP備12003911號-5 京公安網11010802011455號

    請您保持通訊暢通1對1咨詢馬上開啟

    Pictoa