当前位置:网站首页>ES6 let 和 const 命令
ES6 let 和 const 命令
2022-07-06 09:14:00 【imxlw00】
let 基本用法
let命令,用来声明变量。它的用法类似于var
let a = 10;
var b = 1;
不存在变量提升
var命令会发生“变量提升”现象,即变量可以在声明之前使用,值为undefined
// var 的情况
console.log(foo); // 输出undefined
var foo = 2;
// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;
暂时性死区
ES6 明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。
var tmp = 123;
if (true) {
tmp = 'abc'; // ReferenceError
let tmp;
}
上面代码中,存在全局变量tmp,但是块级作用域内let又声明了一个局部变量tmp,导致后者绑定这个块级作用域,所以在let声明变量前,对tmp赋值会报错。
不允许重复声明
// 报错
function func() {
let a = 10;
var a = 1;
}
// 报错
function func() {
let a = 10;
let a = 1;
}
块级作用域
{
let a = 10;
var b = 1;
}
a // ReferenceError: a is not defined.
b // 1
function f1() {
let n = 5;
if (true) {
let n = 10;
}
console.log(n); // 5
}
上面的函数有两个代码块,都声明了变量n,运行后输出 5。这表示外层代码块不受内层代码块的影响。如果两次都使用var定义变量n,最后输出的值才是 10。
const命令基本用法
const声明一个只读的常量。一旦声明,常量的值就不能改变。
<script type="text/javascript">
const PI = 3.1415;
console.log(PI); // 3.1415
PI = 3;
// TypeError: Assignment to constant variable.
</script>
const的作用域与let命令相同:只在声明所在的块级作用域内有效。
const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用。
const命令本质
const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。
const foo = {
};
// 为 foo 添加一个属性,可以成功
foo.prop = 123;
foo.prop // 123
// 将 foo 指向另一个对象,就会报错
foo = {
}; // TypeError: "foo" is read-only
const a = [];
a.push('Hello'); // 可执行
a.length = 0; // 可执行
a = ['Dave']; // 报错
顶层对象的属性
在浏览器环境指的是window对象
window.a = 1;
a // 1
a = 2;
window.a // 2
ES6 为了改变这一点,一方面规定,为了保持兼容性,var命令和function命令声明的全局变量,依旧是顶层对象的属性;另一方面规定,let命令、const命令、class命令声明的全局变量,不属于顶层对象的属性。也就是说,从 ES6 开始,全局变量将逐步与顶层对象的属性脱钩。
var a = 1;
// 如果在 Node 的 REPL 环境,可以写成 global.a
// 或者采用通用方法,写成 this.a
window.a // 1
let b = 1;
window.b // undefined
上面代码中,全局变量a由var命令声明,所以它是顶层对象的属性;全局变量b由let命令声明,所以它不是顶层对象的属性,返回undefined。
边栏推荐
- Pytorch基础
- MySQL主從複制、讀寫分離
- Learn winpwn (3) -- sEH from scratch
- Remember the interview algorithm of a company: find the number of times a number appears in an ordered array
- csdn-Markdown编辑器
- 安装numpy问题总结
- Generate PDM file from Navicat export table
- Machine learning -- census data analysis
- 图片上色项目 —— Deoldify
- Basic use of redis
猜你喜欢
[recommended by bloggers] C WinForm regularly sends email (with source code)
How to configure flymcu (STM32 serial port download software) is shown in super detail
AcWing 1298. Solution to Cao Chong's pig raising problem
【博主推荐】C#MVC列表实现增删改查导入导出曲线功能(附源码)
Django运行报错:Error loading MySQLdb module解决方法
CSDN markdown editor
UDS learning notes on fault codes (0x19 and 0x14 services)
02-项目实战之后台员工信息管理
Swagger、Yapi接口管理服务_SE
【博主推荐】SSM框架的后台管理系统(附源码)
随机推荐
AcWing 179. Factorial decomposition problem solution
Codeforces Round #771 (Div. 2)
FRP intranet penetration
[蓝桥杯2020初赛] 平面切分
PyCharm中无法调用numpy,报错ModuleNotFoundError: No module named ‘numpy‘
Data dictionary in C #
What does BSP mean
Number game
Learn winpwn (2) -- GS protection from scratch
[ahoi2009]chess Chinese chess - combination number optimization shape pressure DP
一键提取pdf中的表格
Why can't I use the @test annotation after introducing JUnit
Leetcode 461 Hamming distance
虚拟机Ping通主机,主机Ping不通虚拟机
Deoldify项目问题——OMP:Error#15:Initializing libiomp5md.dll,but found libiomp5md.dll already initialized.
Summary of numpy installation problems
Swagger, Yapi interface management service_ SE
打开浏览器的同时会在主页外同时打开芒果TV,抖音等网站
【博主推荐】SSM框架的后台管理系统(附源码)
Learn winpwn (3) -- sEH from scratch