let vs const

最新推荐文章于 2024-10-18 11:12:30 发布

weixin_34090643

最新推荐文章于 2024-10-18 11:12:30 发布

阅读量82

点赞数

文章标签： javascript ViewUI

原文链接：https://segmentfault.com/a/1190000004564613

版权

title: let和const命令
date: 2015-12-19 20:18:38
categories: tech
tags: ES2015
toc: true

let

{
  let a = 10;
  var b = 1;
}

a // ReferenceError: a is not defined.
b // 1

适合在for循环中使用，只在循环内部有效。

for(let i = 0; i < arr.length; i++){}

console.log(i)
//ReferenceError: i is not defined

下面的代码如果使用var，最后输出的是10。

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

上面代码中，变量i是var声明的，在全局范围内都有效。所以每一次循环，新的i值都会覆盖旧值，导致最后输出的是最后一轮的i的值。
如果使用let，声明的变量仅在块级作用域内有效，最后输出的是6。

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6

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

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

上面的函数有两个代码块，都声明了变量n，运行后输出5。这表示外层代码块不受内层代码块的影响。如果使用var定义变量n，最后输出的值就是10。

块级作用域很犀利，界限划得很清楚。感觉没有没闭包什么事的样子。如果确实需要调用，就要像下面这样处理。

let f;
{
  let a = 'secret';
  f = function () {
    return a;
  }
}
f() // "secret"

上面代码中，变量i是let声明的，当前的i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量，所以最后输出的是6。

function bar(x = y, y = 2) {
  return [x, y];
}

bar(); // [ undefined, 2 ]

上面代码中，调用bar函数之所以报错，是因为参数x默认值等于另一个参数y，而此时y还没有声明，属于”死区“。如果y的默认值是x，就不会报错，因为此时x已经声明了。

function bar(x = 2, y = x) {
  return [x, y];
}
bar(); // [2, 2]

暂时性死区最简单理解可能就是是否之前声明过，否则为死区。

const也用来声明变量，但是声明的是常量。一旦声明，常量的值就不能改变。

const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: "PI" is read-only

上面代码表明改变常量的值会报错。

const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。

const foo;
// SyntaxError: missing = in const declaration

上面代码表示，对于const来说，只声明不赋值，就会报错

const与let命令相同点

一般来讲，const定义基本类型不在改变的值，比如字符串，数字等。
但是如果定义引用类型，比如普通对象{}或数组[]。比如

const foo = {}；

foo这个地址在栈区已经被const定死，不容改变，否则即为报错。
但是引用类型是可以改变的，因为它们地址在堆区。

const foo = {};
foo.prop = 123;
console.log(foo.prop) // 123
console.log(foo) // { prop: 123 }

因为使用const就是想把它规定死，常量。下面方法可以实现

const bar = Object.freeze({});
bar.name = 'joe';
console.log(bar.name);
//TypeError: Can't add property name, object is not extensible

ES5声明变量的方法

ES6新增声明变量的方法

关注