ES6精華：Let & Const

UnixAgain 發布于2019-08-22 17:35 / 334人閱讀

摘要：所以，最終極的辦法是一層一層凍結所有對象。塊級作用域使呈現出塊級作用域的特征。聲明的變量僅存在于當前塊級作用域中。在中，嚴格模式下等價于使用聲明，非嚴格下等價于使用。在中使用聲明的變量，為了保持程序的嚴謹性，不允許被訪問。

let和const都是聲明變量的新方式。
一般的，由于這兩種聲明方式的特性，現在項目組的開發規范中都會要求：不使用var而是let或const。

Const

const用于定義不可更改的常量。
不可更改，意思是標識符存儲的值不可更改。
這意味著，如果存儲的是對象的地址，改動地址指向的內存是可以的。

"use strict";

const OBJ = {};
OBJ.name = "OBJ"; // 成功
OBJ = {}; // 失敗，改變了存儲的地址。

由此可聯想到ES5的凍結對象。
如果對象的屬性是個指針，依然是可以修改的。
所以，最終極的辦法是一層一層凍結所有對象。

塊級作用域

let使{}呈現出塊級作用域的特征。
聲明的變量僅存在于當前塊級作用域中。
不可在同一塊級作用域中重復聲明變量。
一旦在塊級作用域中聲明了變量，此變量便綁定在這個區域，不再受外部的影響。

"use strict";

if (true) {
  var a = 1;
  let b = 2;
}
console.log(a); // 1
console.log(b); // error, b is not defined.

定義函數

在塊級作用域中，優先使用表達式聲明函數（let, const, var）。
不要使用聲明式聲明函數，因為不同瀏覽器在這方面的實現有所差異。
在Chrome中，嚴格模式下等價于使用let聲明，非嚴格下等價于使用var。

// 在 Chrome 66 瀏覽器。

// --- 嚴格模式
"use strict";

console.log(fn); // error, fn is not defined.
if (true) {
  function fn() {
    console.log("hi");
  }
}
console.log(fn); // error, fn is not defined.

// --- 非嚴格模式。
console.log(fn); // undefined
if (true) {
  function fn() {
    console.log("hi");
  }
}
console.log(fn); // function

暫時性死區

塊級作用域的頂部到聲明此變量之前的區域，稱為此變量的暫時性死區。
在暫時性死區內，不能使用該變量。

"use strict";

let a = 1;
{
  // 在這里使用 a 會報錯。
  let a = 2;
}

// 對比 var
var b = 2;
fn();
console.log(b); // 2

function fn() {
  b = 1;
  var b;
  console.log(b); // 1
}

let也存在變量提升，只不過對待方式和之前不同。
變量提升，簡單的說就是在執行代碼前先會看到底聲明了哪些變量和方法。
在ES5中使用var聲明的變量，在聲明之前可以訪問，其值為undefined。
在ES6中使用let聲明的變量，為了保持程序的嚴謹性，不允許被訪問。

解綁全局變量

在之前的版本中，全局變量等價于頂層對象的相應屬性。
而ES6中新的變量聲明方式（let, const, class）定義的全局變量與頂層對象的屬性脫鉤。

const MY = {};
console.log(window.MY); // undefined

替代自執行函數 定義臨時變量

// ---ES5
(function() {
  var a = 1;
})();

// ---ES6
{
  let a = 1;
}

簡化for循化

// ---ES5
// 使用自執行函數獲取并切斷變量，再用閉包存儲變量
var fns = [];
for (var i = 0; i < 7; i++) {
  fns[i] = (function(n) {
    return function() {
      console.log(n);
    };
  })(i);
}
fns[3](); // 3

// ---ES6
var fns = [];
for (let i = 0; i < 7; i++) {
  fns[i] = function() {
    console.log(i);
  };
}
fns[3](); // 3

for+let組合的理解

for后面的()是一個獨立的作用域。
for后面的{}是一個獨立的作用域。
for后面的{}中的作用域鏈為：本身 > () > 外部。
每次循環，都會重新在()里定義i，并將其值設置為其上次循環結束的值。

// 證明 () 是一個獨立的作用域。
let i = 3;
for (let i = 0; i< 7; i++) {}
console.log(i); // 3

// 證明 {} 的作用域鏈為：本身 -> ()作用域 -> 外部作用域。
for (let i = 0; i< 7; i++) {
  i = 7;
  console.log(i); // 紙打印一次，值為 7 。
}
for (let i = 0; i< 7; i++) {
  let i = "hi";
  console.log(i); // 打印 7 次 "hi" 。
}

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/95307.html

Set &amp; Map：新生的數據集合及其弱引用衍生

摘要：前言新增了兩種基本的原生數據集合和加上和現在共有四種，以及由兩者衍生出的弱引用集合和。其本身是生成實例數據集合的構造函數，可以接受一個數組或具有接口的數據結構作為參數用來初始化。返回鍵值對的遍歷器對象，鍵值對為鍵名鍵值。前言 ES6新增了兩種基本的原生數據集合：Set和Map（加上Array和Object現在共有四種），以及由兩者衍生出的弱引用集合：WeakSet和WeakMap。從...

AprilJ 2019-08-23 10:54 評論0 收藏0
ES6筆記之 let &amp;&amp; const

摘要：聲明的變量只在其所在的代碼塊內有效。只要在聲明之前使用這些變量，就會報錯。在語法上稱為暫時性死區有時候，會不經間遇到比較隱蔽的死區，不太容易被發現。不允許重復聲明不允許在相同的作用域內聲明同一個變量。一旦聲明，其值就不能再改變。 let && const let let聲明的變量只在其所在的代碼塊內有效。 { let a = 10; } console.log(a) //R...

aristark 2019-08-19 17:33 評論0 收藏0
ES6精華：函數擴展

摘要：在函數方面的擴展比較豐富也很實用，本篇概括了這中的精華知識。所以無法成為構造函數，不能使用操作符。參數將擴展運算符作用于參數，即為參數。聲明式，直接為函數名。通過構造函數生成的，為。函數的屬性，在其描述對象的屬性上，為函數名。 ES6在函數方面的擴展比較豐富也很實用，本篇概括了這中的精華知識。 1 箭頭函數箭頭函數是ES6中定義函數的新形式。新形式不僅簡化了定義方式，更為函數本身...

lansheng228 2019-08-22 18:11 評論0 收藏0
es6必會之let &amp;&amp; const

摘要：副作用，無副作用可執行和關鍵詞。和不能像一樣同一個下聲明多次和不會像一樣變量聲明提升原因是，存在因此不能，賦值前使用變量。 showImg(https://segmentfault.com/img/bVbhPlD?w=1271&h=715); 關鍵詞： let ，const， blocking scope ，temporal dead zone，redeclaration，reassi...

ygyooo 2019-08-23 12:14 評論0 收藏0
let&amp;const

摘要：資料參考是阮一峰老師寫的教程命令新增的命令，使用來聲明變量的，就像一樣，但是聲明的變量只在所在的代碼塊中有效。凡是在聲明之前使用這個變量都會報錯塊級作用域中擁有全局作用域和函數作用域，添加了塊級作用域。資料參考是阮一峰老師寫的ES6教程 let&const命令 let ES6新增的let命令，使用來聲明變量的，就像var一樣，但是聲明的變量只在let所在的代碼塊中有效。 e.g { ...

Karrdy 2019-08-20 12:28 評論0 收藏0