资讯专栏INFORMATION COLUMN

ES6精华:Let & Const

UnixAgain / 308人阅读

摘要:所以,最终极的办法是一层一层冻结所有对象。块级作用域使呈现出块级作用域的特征。声明的变量仅存在于当前块级作用域中。在中,严格模式下等价于使用声明,非严格下等价于使用。在中使用声明的变量,为了保持程序的严谨性,不允许被访问。

letconst都是声明变量的新方式。
一般的,由于这两种声明方式的特性,现在项目组的开发规范中都会要求:不使用var而是letconst

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" 。
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/95307.html

相关文章

  • Set &amp; Map:新生的数据集合及其弱引用衍生

    摘要:前言新增了两种基本的原生数据集合和加上和现在共有四种,以及由两者衍生出的弱引用集合和。其本身是生成实例数据集合的构造函数,可以接受一个数组或具有接口的数据结构作为参数用来初始化。返回键值对的遍历器对象,键值对为键名键值。 前言 ES6新增了两种基本的原生数据集合:Set和Map(加上Array和Object现在共有四种),以及由两者衍生出的弱引用集合:WeakSet和WeakMap。从...

    AprilJ 评论0 收藏0
  • ES6笔记之 let &amp;&amp; const

    摘要:声明的变量只在其所在的代码块内有效。只要在声明之前使用这些变量,就会报错。在语法上称为暂时性死区有时候,会不经间遇到比较隐蔽的死区,不太容易被发现。不允许重复声明不允许在相同的作用域内声明同一个变量。一旦声明,其值就不能再改变。 let && const let let声明的变量只在其所在的代码块内有效。 { let a = 10; } console.log(a) //R...

    aristark 评论0 收藏0
  • ES6精华:函数扩展

    摘要:在函数方面的扩展比较丰富也很实用,本篇概括了这中的精华知识。所以无法成为构造函数,不能使用操作符。参数将扩展运算符作用于参数,即为参数。声明式,直接为函数名。通过构造函数生成的,为。函数的属性,在其描述对象的属性上,为函数名。 ES6在函数方面的扩展比较丰富也很实用,本篇概括了这中的精华知识。 1 箭头函数 箭头函数是ES6中定义函数的新形式。 新形式不仅简化了定义方式,更为函数本身...

    lansheng228 评论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 评论0 收藏0
  • let&amp;const

    摘要:资料参考是阮一峰老师写的教程命令新增的命令,使用来声明变量的,就像一样,但是声明的变量只在所在的代码块中有效。凡是在声明之前使用这个变量都会报错块级作用域中拥有全局作用域和函数作用域,添加了块级作用域。 资料参考是阮一峰老师写的ES6教程 let&const命令 let ES6新增的let命令,使用来声明变量的,就像var一样,但是声明的变量只在let所在的代码块中有效。 e.g { ...

    Karrdy 评论0 收藏0

发表评论

0条评论

UnixAgain

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<