ES6之命令妙用
let命令属于ES6中的一个基本语法,与原有Javascript中的var的功能一样,都是用来声明一个变量。但是,他拥有了一些新的特性和使用规范:
- 块级作用域有效
- 不允许重复声明
- 不存在变量作用域提升
1、块级作用域有效
使用let声明的变量作用域范围只在花括号{}内有效,而使用var声明的变量则在花括号之外也可以使用。

在花括号中用var声明了一个a变量,用let声明了一个b变量。在花括号之外访问时,a可以正常访问到1,但是b却不能。原因是let声明的变量超出{}之后,就访问不到了。
2、不允许重复声明
使用let声明的变量不允许出现同名,同名就报错。使用var的话就没有这个限制。

3、不存在变量作用域提升
使用let时,必须先声明再使用,如果在声明之前使用就会报错,用var时则会显示undefined。

4、实例
下面是一道非常经典的面试题,问点击按钮打印出来的结果是什么:

在这个例子中,点击这3个按钮打印的都是:3,原因就是此时的i是一个全局变量i,按钮只是拿到了i的引用。也就是说按钮的i指向的同一个对象i,那么i的变化会同时影响到这三个按钮。i进过训话后变成了3,所以点击按钮打印出来的就都是3了。
但是我们想要的结果是:依次打印0、1、2怎么办?此时就是可以使用let命令,修改一下代码看一下:

在代码中只用把 var i 改成 let i 即可,现在在for循环外打印i已经获取不到了,i已经不再是全局变量。此时点击按钮看到打印的结果为:0 1 2 ,达到了我们的预期。
这就是ES6中的let命令大家学会了吗?当然let只是ES6语法规范中的冰山一角,上海尚学堂web前端培训将为您奉献更多的精彩实用的前端相关知识!
ES6之命令妙用的更多相关文章
- shell中eval命令妙用——变量嵌套替换
eval命令妙用--变量嵌套替换 eval命令在Linux下的应用非常广泛,在写脚本的时候遇到一个变量嵌套的问题,用eval迎刃而解,略试不爽啊. var1="hello" i=1 ...
- mysql中pager命令妙用
pager命令的妙用在mysql,可以大大提高工作效率. 一 当处理大量数据时,不想显示查询的结果,而只需知道查询话费的时间. mysql> select * from t3; +----- ...
- JS ES6 -- let命令
1.ES6新增了块级作用域的let和const 这新特性let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. for循环的计数器,就很合适使用let命令 ...
- ES6 新增命令
let 用来声明变量.它的用法类似于var,但是所声明的变量, 只在let命令所在的代码块内有效. 例: {var a=10; let b=20;}; console.lo ...
- 【ES6】let 命令
let命令 为es6新增命令,用来声明变量,类似于var,但是let所声明的变量,只在let命令所在的块级作用域内有效 块级作用域写法(ES6块级作用域允许任意嵌套): // 块级作用域写法 { le ...
- ES6 快速开始
Refs 现代框架 Vue React 都使用到了 ES6 (包括D3js) [常量] // ES5 中常量的写法 Object.defineProperty(window, "PI2&qu ...
- React相关:npm,ES6,
1.NPM: 参考:npm使用入门 npm 学习笔记整理 2.ES6参考:ES6 let命令:ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块 ...
- ES6学习笔记(一)——扩展运算符和解构赋值
前言 随着前端工程化的快速推进,在项目中使用ES6甚至更高的ES7等最近特性早已不是什么新鲜事.之前还觉得既然浏览器支持有限,那了解一下能看懂就好,然而仅仅了解还是不够的,现在放眼望去,那些成熟框架的 ...
- es6的let与const
es6新增命令let,用于声明变量,他与var的不同主要有三点: let有块级作用域 let没有变量提升 同级作用域内,let不可以重复定义 let有块级作用域: es5 for(var i=0;i& ...
随机推荐
- 51单片机学习笔记(清翔版)(13)——LED点阵、74HC595
如图3,点阵屏分单色和彩色,点阵屏是由许多点组成的,在一个点上,只有一颗一种颜色的灯珠,这就是单色点阵屏,彩色的在一个点上有三颗灯珠,分别是RGB三原色. 图4你可能没看出来,那么大块黄色的就是点阵屏 ...
- Python数据库连接池DBUtils
Python数据库连接池DBUtils DBUtils是Python的一个用于实现数据库连接池的模块. 此连接池有两种连接模式: 模式一:为每个线程创建一个连接,线程即使调用了close方法,也不 ...
- unity 动态更新模型透明度
RaycastHit[] hits; Vector3 normal = transform.position - target.position; hits = Physics.RaycastAll( ...
- Layer 创建 和 lamdba function 创建 和 API GateWay 配置 和 添加依赖
进入控制台 选择 Lamdba 服务 进入控制面板, 单击右边: 创建函数 然后进入此图界面 添加lamdba 函数 名称 选择运行环境:python 选择角色 选择现有角色, 角色创建 可以参考 无 ...
- dos命令 创建数据库,建表,两表联查,三表联查(mysql---第一篇)
首先打开mysql的控制台,输入密码进行登录 (ps:本文的mysql控制台,是运用的php的集成环境(phpstudy),点击运行,找到mysql命令行,直接打开就可以了) 登陆成功后,就可以进行 ...
- python-directory
#!/usr/bin/python # --*-- coding: utf-8 --*-- directory={ "张三":16, "李四":46, &quo ...
- 我的第一个flink_java程序
之前看了视频学习第一个flink word count使用,但是对于socket发送数据作为数据源我这里有点忘记了,加上最近有个项目要发布,一直在忙,所以迟迟无法完成: 1.首先我们要有数据源,因为 ...
- pd16.5增加字段备注
EXEC sp_addextendedproperty 'MS_Description', %.q:COLNNAME%, 'user', dbo, 'table', %TABLE%, 'column' ...
- python3 第三十二章 - 标准库概览
1. 操作系统接口 os 模块提供很多函数与操作系统进行交互︰ >>> import os >>> os.getcwd() # 返回当前的工作目录 'C:\\Pyt ...
- lock(this)
public void test(int i) { lock(this) { if (i > 10) { i--; test(i); } } } 网上答案说和参数有关.可是我把int 改成ob ...