xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

js var & let & const All In One

js var & let & const 区别对比

var let const 区别

1. 是否存在 hoisting / 变量提升

var 存在 hoisting;
let, const 不存在 hoisting;

2. 作用域范围

var 是全局 scope 或函数 scope;
let, const 是 block scope / 块级作用域;

3. 能否重复声明

var 可以重复声明;
let, const 不可以重复声明，会抛出错误;

4. 能否重新赋值

var 可以重新赋值,
let 可以重新赋值;
const 不可以重新赋值, 但是如果是引用类型 (Object / Array) 则可以修改其属性值

5. 声明时否要初始化

var 可选初始化;
let 可选初始化, 但是存在 TDZ(暂时死区);
const 声明时必须初始化;

图解

const log = console.log;

var x = 1;

function func() {
  var x = 2;
  log(`function var`, x)
}

log(`global val`, x);
// val 1

func();
// function var 2


x = 11;

log(`x`, x);
// x 11

var x = 1;
x;
//1

var x = 11;
x;
// 11

let y = 2;
y;
// 2

let y = 22;
// Uncaught SyntaxError: Identifier 'y' has already been declared

const z = 3;
z;
// 3

const z = 33;
// Uncaught SyntaxError: Identifier 'z' has already been declared

demos

refs

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const

https://img2020.cnblogs.com/blog/740516/202009/740516-20200916112245619-985579667.png

---

---

©xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

---