位置: 编程技术 - 正文

javascript ES6 新增了let命令使用介绍

编辑:rootadmin

推荐整理分享javascript ES6 新增了let命令使用介绍,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

let命令

基本用法

ES6新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。

上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。

for循环的计数器,就很合适使用let命令。

上面代码中,计数器i只在for循环体内有效,在循环体外引用就会报错。

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

上面代码中,变量i是var声明的,在全局范围内都有效。所以每一次循环,新的i值都会覆盖旧值,导致最后输出的是最后一轮的i的值。

如果使用let,声明的变量仅在块级作用域内有效,最后输出的是6。

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

不存在变量提升

let不像var那样会发生“变量提升”现象。所以,变量一定要在声明后使用,否则报错。

上面代码中,变量foo用var命令声明,会发生变量提升,即脚本开始运行时,变量foo已经存在了,但是没有值,所以会输出undefined。变量bar用let命令声明,不会发生变量提升。这表示在声明它之前,变量bar是不存在的,这时如果用到它,就会抛出一个错误。

暂时性死区

只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。

上面代码中,存在全局变量tmp,但是块级作用域内let又声明了一个局部变量tmp,导致后者绑定这个块级作用域,所以在let声明变量前,对tmp赋值会报错。

ES6明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。

总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称TDZ)。

上面代码中,在let命令声明变量tmp之前,都属于变量tmp的“死区”。

“暂时性死区”也意味着typeof不再是一个百分之百安全的操作。

上面代码中,变量x使用let命令声明,所以在声明之前,都属于x的“死区”,只要用到该变量就会报错。因此,typeof运行时就会抛出一个ReferenceError。

作为比较,如果一个变量根本没有被声明,使用typeof反而不会报错。

上面代码中,undeclared_variable是一个不存在的变量名,结果返回“undefined”。所以,在没有let之前,typeof运算符是百分之百安全的,永远不会报错。现在这一点不成立了。这样的设计是为了让大家养成良好的编程习惯,变量一定要在声明之后使用,否则就报错。

有些“死区”比较隐蔽,不太容易发现。

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

ES6规定暂时性死区和let、const语句不出现变量提升,主要是为了减少运行时错误,防止在变量声明前就使用这个变量,从而导致意料之外的行为。这样的错误在ES5是很常见的,现在有了这种规定,避免此类错误就很容易了。

总之,暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量。

不允许重复声明

let不允许在相同作用域内,重复声明同一个变量。

因此,不能在函数内部重新声明参数。

块级作用域

为什么需要块级作用域?

ES5只有全局作用域和函数作用域,没有块级作用域,这带来很多不合理的场景。

第一种场景,内层变量可能会覆盖外层变量。

上面代码中,函数f执行后,输出结果为undefined,原因在于变量提升,导致内层的tmp变量覆盖了外层的tmp变量。

javascript ES6 新增了let命令使用介绍

第二种场景,用来计数的循环变量泄露为全局变量。

上面代码中,变量i只用来控制循环,但是循环结束后,它并没有消失,泄露成了全局变量。

ES6的块级作用域

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

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

ES6允许块级作用域的任意嵌套。

上面代码使用了一个五层的块级作用域。外层作用域无法读取内层作用域的变量。

内层作用域可以定义外层作用域的同名变量。

块级作用域的出现,实际上使得获得广泛应用的立即执行函数表达式(IIFE)不再必要了。

块级作用域与函数声明

函数能不能在块级作用域之中声明,是一个相当令人混淆的问题。

ES5规定,函数只能在顶层作用域和函数作用域之中声明,不能在块级作用域声明。

上面代码的两种函数声明,根据ES5的规定都是非法的。

但是,浏览器没有遵守这个规定,为了兼容以前的旧代码,还是支持在块级作用域之中声明函数,因此上面两种情况实际都能运行,不会报错。不过,“严格模式”下还是会报错。

ES6 引入了块级作用域,明确允许在块级作用域之中声明函数。

ES6 规定,块级作用域之中,函数声明语句的行为类似于let,在块级作用域之外不可引用。

上面代码在 ES5 中运行,会得到“I am inside!”,因为在if内声明的函数f会被提升到函数头部,实际运行的代码如下。

ES6 的运行结果就完全不一样了,会得到“I am outside!”。因为块级作用域内声明的函数类似于let,对作用域之外没有影响,实际运行的代码如下。

很显然,这种行为差异会对老代码产生很大影响。为了减轻因此产生的不兼容问题,ES6在附录B里面规定,浏览器的实现可以不遵守上面的规定,有自己的行为方式。

允许在块级作用域内声明函数。函数声明类似于var,即会提升到全局作用域或函数作用域的头部。同时,函数声明还会提升到所在的块级作用域的头部。注意,上面三条规则只对ES6的浏览器实现有效,其他环境的实现不用遵守,还是将块级作用域的函数声明当作let处理。

前面那段代码,在 Chrome 环境下运行会报错。

上面的代码报错,是因为实际运行的是下面的代码。

考虑到环境导致的行为差异太大,应该避免在块级作用域内声明函数。如果确实需要,也应该写成函数表达式,而不是函数声明语句。

另外,还有一个需要注意的地方。ES6的块级作用域允许声明函数的规则,只在使用大括号的情况下成立,如果没有使用大括号,就会报错。

do 表达式

本质上,块级作用域是一个语句,将多个操作封装在一起,没有返回值。

上面代码中,块级作用域将两个语句封装在一起。但是,在块级作用域以外,没有办法得到t的值,因为块级作用域不返回值,除非t是全局变量。

现在有一个提案,使得块级作用域可以变为表达式,也就是说可以返回值,办法就是在块级作用域之前加上do,使它变为do表达式。

上面代码中,变量x会得到整个块级作用域的返回值。

JavaScript ES6 的 let 和 var 的比较

在javascript 1.7中, let 关键词被添加进来, 我听说它声明之后类似于”本地变量“, 但是我仍然不确定它和 关键词 var 的具体区别。

回答:不同点在于作用域, var关键词的作用域是最近的函数作用域(如果在函数体的外部就是全局作用域), let 关键词的作用域是最接近的块作用域(如果在任何块意外就是全局作用域),这将会比函数作用域更小。同样, 像var 一样, 使用let 声明的变量也会在其被声明的地方之前可见。

下面是Demo 例子。

全局(Global)

当在函数体之外它们是平等的。

函数(Function)当瞎下面这种, 也是平等的。

块(Block)这是不同点, let 只是在 for 循环中, var 却是在整个函数都是可见的。

荐书|您有一份JavaScript书单待签收 前言凡是能够用JavaScript来写的应用,最终都必将用JavaScript来写,JeffAtwood如是说,此定律大概意味着未来将会成为JavaScript的天下?不管JavaScript最终能否

基于JS脚本语言的基础语法详解 JS脚本语言的基础语法:输出语法alert("警告!");confirm("确定吗");prompt("请输入密码");为弱类型语言;开始时要嵌入JS代码:scripttype="text/javascript"/script;关

浅谈ECMAScript6新特性之let、const 第一次写博客有点紧张,如果说的不对的地方,欢迎大家留言指正。咱们先来说说ECMAScript这到底是啥玩意儿?它和javascript的关系又是如何的?首先,在

标签: javascript ES6 新增了let命令使用介绍

本文链接地址:https://www.jiuchutong.com/biancheng/377528.html 转载请保留说明!

上一篇:react系列从零开始_简单谈谈react(react 系列)

下一篇:荐书|您有一份JavaScript书单待签收(你有一份来信)

  • 个税手续费返还会计分录
  • 退税进度显示国库退库失败怎么办 是什么原因
  • 房地产中介门头
  • 工程款转入冻结账户能拿回
  • 个人到税务局开发票要带什么东西
  • 一般公共预算支出是什么意思
  • 融资的方式有哪两种类型
  • 平行式明细账
  • 地产项目开发
  • 劳服企业可以安差额税上税吗?
  • 弥补以前年度亏损税局会查吗
  • 增值税普通发票需要交税吗
  • 物流企业的大宗商品仓储用地是什么意思
  • 给员工的福利要缴税吗
  • 技术服务费属于什么税收分类编码
  • 长期待摊费用无发票怎么处理
  • 货币资金闲置对企业偿债能力的影响
  • 健身房会计一般做什么
  • 年中建账损益类科目怎么录
  • 简易办法计税销售额如何填写
  • 投资收益亏损
  • 一个网页账号在多个电脑登录
  • 一般纳税人购买原材料会计分录
  • 文化事业建设费2023年是否减免了
  • 人力资源服务收入计入什么科目
  • PHP:xml_set_default_handler()的用法_XML解析器函数
  • php数组函数,选班长
  • linux系统中pwd命令的作用
  • 查补以前年度税款账务处理
  • 研发费用的会计和税法的不同
  • 计提本月固定资产折旧会计科目
  • 贷款核销对个人的影响
  • print-js
  • 在杂志上发表文章算出版吗
  • 借款利息还能再算利息吗
  • 非关联企业借款利息扣除
  • js如何随机生成字符串
  • 房产税城镇土地使用税申报期限
  • 编译安装和普通安装
  • 个税系统怎么查询已申报个人明细
  • 重复上次命令
  • 香港企业的所得税怎么算
  • 工伤事故赔偿款分配
  • 开票显示税收分录怎么办
  • mongodb $sum
  • 增值税纳税申报类型怎么填
  • 跨月更正申报会扣信用分么
  • 小规模纳税人运输费计入什么科目
  • 小微企业缴纳增值税的账务处理
  • 电脑访问另一台电脑访问权限
  • 客户送我东西怎么办
  • 扫描仪有危害吗
  • 购买汽车的工本费如何入账
  • 收到股东投入材料怎么做账
  • 工业企业存货发出计价的方法
  • 非营利医疗机构免征哪几种税
  • sqlserver远程连接设置
  • Win10控制面板在c盘哪里
  • winscope是什么意思
  • ubuntu不支持设置属性
  • steam怎么sl
  • rundll32.exe是病毒吗
  • sesvc.exe是什么进程
  • vps 作用
  • XP系统升级WIN7系统
  • windows8怎么装
  • javascript屏蔽元素
  • 安卓图库权限
  • linux 压缩解压缩
  • innertext赋值
  • angular api
  • easyui messager alert 三秒后自动关闭提示的实例
  • js prototype constructor
  • python3模拟登录
  • 深圳国家税务局赵雨婷处长
  • 养老专业在职研究生好吗
  • 上海房产税税收
  • 跪式服务礼仪规范图片
  • 对金融机构与小型企业
  • 广东省电子税务局官网
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设