ES6进修（一）之var、let、const

2024年1月16日 154次阅读 来源: Alan

更多前端文章

1、变量提拔

概述：变量可在声明之前运用。

console.log(a);//平常运转，掌握台输出 undefined
var a = 1;
console.log(b);//报错，Uncaught ReferenceError: b is not defined
let b = 1;
console.log(c);//报错，Uncaught ReferenceError: c is not defined
const c = 1;

var 敕令常常会发生变量提拔征象，根据平常逻辑，变量应当在声明以后运用才对。为了改正这个征象，ES6 划定 let 和 const 敕令不发生变量提拔，运用 let 和 const 敕令声明变量之前，该变量是不可用的。重如果为了削减运转时毛病，防备变量声明前就运用这个变量，从而致使意料之外的行动。

2、暂时性死区

概述：假如在代码块中存在 let 或 const 敕令，这个区块对这些敕令声明的变量，从一最先就形成了关闭作用域。通常在声明之前就运用这些变量，就会报错。

var tmp = 123;
if (true) {
    tmp = 'abc';//报错，Uncaught ReferenceError: tmp is not defined
    let tmp;
}

理会暂时性死区的道理，实在let/const一样也有提拔的作用，然则和var的区分在于

  • var在建立时就被初始化，而且赋值为undefined
  • let/const在进入块级作用域后，会由于提拔的缘由先建立，但不会被初始化，直到声明语句实行的时刻才被初始化，初始化的时刻假如运用let声明的变量没有赋值，则会默许赋值为undefined，而const必需在初始化的时刻赋值。而建立到初始化之间的代码片断就形成了暂时性死区

3、不允许反复声明

let不允许在雷同作用域内，反复声明同一个变量。

// 报错
function func() {
  let a = 10;
  var a = 1;
}

// 报错
function func() {
  let a = 10;
  let a = 1;
}
function func(arg) {
  let arg;
}
func() // 报错

function func(arg) {
  {
    let arg;
  }
}
func() // 不报错

4、块级作用域

在es5中我们会碰到下面这写状况
第一种场景，内层变量可能会掩盖外层变量。

var tmp = new Date();
function f() {
  console.log(tmp);
  if (false) {
    var tmp = 'hello world';//没有块级作用域tmp变量提拔到函数作用域里致使tmp为undefined
  }
}
f(); // undefined

第二种场景，用来计数的轮回变量泄漏为全局变量。

var s = 'hello';
for (var i = 0; i < s.length; i++) {
  console.log(s[i]);
}
console.log(i); // 5

上面代码中，变量i只用来掌握轮回，然则轮回完毕后，它并没有消逝，泄漏成了全局变量。

  let n = 5;
  if (true) {
    let n = 10;
  }
  console.log(n); // 5
}

let现实上为 JavaScript 新增了块级作用域。

5、const注重点

1、const声明变量的时刻必需赋值，不然会报错，一样运用const声明的变量被修正了也会报错
2、const声明变量不能转变，假如声明的是一个援用范例，则不能转变它的内存地点

const c ; //Uncaught SyntaxError: Missing initializer in const declaration
const a= {a:1};
a.a=2;
a={d:2};// Uncaught TypeError: Assignment to constant variable.

实质：const现实上保证的，并非变量的值不得修正，而是变量指向的谁人内存地点所保留的数据不得修正。关于简朴范例的数据（数值、字符串、布尔值），值就保留在变量指向的谁人内存地点，因而等同于常量。但关于复合范例的数据（重如果对象和数组），变量指向的内存地点，保留的只是一个指向现实数据的指针，const只能保证这个指针是牢固的（即老是指向另一个牢固的地点），至于它指向的数据结构是否是可变的，就完整不能掌握了

那末我们想得到不可修正的const要怎么做呢？应当运用Object.freeze要领。

const foo = Object.freeze({});

// 通例形式时，下面一行不起作用；
// 严厉形式时，该行会报错
foo.prop = 123;
// 除了将对象自身凝结，对象的属性也应当凝结。
var constantize = (obj) => {
  Object.freeze(obj);
  Object.keys(obj).forEach( (key, i) => {
    if ( typeof obj[key] === 'object' ) {
      constantize( obj[key] );
    }
  });
};

参考文章
ECMAScript 6 入门

    原文作者：Alan
    原文地址: https://segmentfault.com/a/1190000018607632
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞