浅谈ECMAScript6新特性之let、const


Posted in Javascript onAugust 02, 2017

第一次写博客有点紧张,如果说的不对的地方,欢迎大家留言指正。咱们先来说说“ECMAScript”这到底是啥玩意儿?它和javascript的关系又是如何的?首先,在1996年11月的时候,javascript的创造者(网景公司Netscape)和sun公司联合ECMA(欧洲计算机制造商协会)对javascript进行标准化,次年,ECMA发布262号标准文件文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准(在这里提个问题:为什么要标准化?),并将这种语言称为ECMAScript,这个版本就是1.0版的。这个标准一开始就是针对与javascript来制定的,但是没有称之为“javascript”,这其中有两个原因,一是:商标;二是:想体现这门语言的规格制定者是ECMA,这样有利于保证开发性和中立性。所以,ECMAScript和javascript之间的关系就是,前者来制定规格,后者来实现(另外的ECMAScript的实现还有JScript和ActionScript)。一般的情况下,这两个词是可以互换的。

接下来来介绍一下es6中的新特性之“let”。首先,这个玩意儿其实和var这个命令类似,都是用于声明变量的,但是所声明的变量只在let命令所在的代码块内有效(这里涉及到块级作用域的概念,然而这个概念也是es6中提出来的。在后面我再来讲。PS:在其他编程语言中,早就有块级了)

浅谈ECMAScript6新特性之let、const浅谈ECMAScript6新特性之let、const

上面的两张图就反映出了let所声明的变量只在let命令所在的代码块内有效。下面来举个例子:

浅谈ECMAScript6新特性之let、const浅谈ECMAScript6新特性之let、const浅谈ECMAScript6新特性之let、const

发现区别了吗?var声明的变量它是全局范围内都有效的,每一次的循环,新的i值都会覆盖旧值,导致最后输出的是最后一轮的i值(当然,也可以利用闭包来解决这个问题【第三张图】)。如果使用的是let,声明的变量仅在块级作用域内有效,当前的i只在本轮循环有效,所以每一次循环i其实都是一个新的变量。在期间我发现了一个更神奇的东西,请看下面一张图:

浅谈ECMAScript6新特性之let、const

注意①、let不像var一样会发生“变量提升”的现象,所以,使用之前,必须先声明,不然就会报错。

②、暂时性死区(temporal dead zone,简称TDZ),只要块级作用域内有let命令,它所声明的变量就会绑定这个区域,不收外部的的影响。简单的来说,在代码块中,使用let命令声明变量之前,变量都是不能用的。例子:

浅谈ECMAScript6新特性之let、const

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

好了,现在再来讲一讲上文提及到的一个东东:“块级作用域”。在es5中只有“全局作用域”和“函数作用域”。这使得我在刚开始学的时候一脸蒙蔽,其他语言都有块级作用域(比如C语言),但js就没有。幸好在es6中加入了“块级作用域”的概念,let实际上为javascript新增了块级作用域,有了块级作用域,就可以避免变量泄露成全局变量,代码快之间不会受到影响。另外,es6里还规定了:函数本身的作用域在其块级作用域内。注意!注意!注意!重要的事说三遍:(如果是在严格模式下,函数只能在顶级作用域和函数内部声明,其他情况下【比如:if语句、循环语句下】就会报错) :

浅谈ECMAScript6新特性之let、const

最后再来说说es6中的新特性之“const”,好吧,其他编程语言里早就有了,但是javascript在es6之前还是没有~~。这个是用来声明常量的,其表现为不可修改的,还有就是声明的同时必须进行赋值,否则就会报错。

注意:①、在作用域方面,它其实和let作用域相同:只在声明所在的块级作用域内有效;

 ②、const命令声明的常量同样不存在“变量提升”,同样存在“暂时性死区”,必须在声明后才能使用。

 ③、const也不能重复声明常量。

综合例子:

浅谈ECMAScript6新特性之let、const

 ④、对于复合类型的变量,常量名不指向数据,而是指向的是数据的指针地址,const命令只是保证了地址没有变,但并不保证数据的不变,所以在使用const命令声明常量为对象时要小心!!其实我们可以对其对象进行“冻结”,使用Object.freeze()即可实现。

浅谈ECMAScript6新特性之let、const

浅谈ECMAScript6新特性之let、const

浅谈ECMAScript6新特性之let、const

以上这篇浅谈ECMAScript6新特性之let、const就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
User Scripts: Video Download by User Scripts
May 14 Javascript
JavaScript 模拟用户单击事件
Dec 31 Javascript
Jquery插件 easyUI属性汇总
Jan 19 Javascript
JavaScript数据结构与算法之栈与队列
Jan 29 Javascript
jQuery+Pdo编写login登陆界面
Aug 01 Javascript
使用纯JS代码判断字符串中有多少汉字的实现方法(超简单实用)
Nov 12 Javascript
探究JavaScript中的五种事件处理程序方式
Dec 07 Javascript
用Vue-cli搭建的项目中引入css报错的原因分析
Jul 20 Javascript
vue.js  父向子组件传参的实例代码
Oct 29 Javascript
JS二级菜单不同实现方法分析【4种方法】
Dec 21 Javascript
微信内置开发 iOS修改键盘换行为搜索的解决方案
Nov 06 Javascript
微信小程序select下拉框实现源码
Nov 08 Javascript
js实现前端图片上传即时预览功能
Aug 02 #Javascript
使用JavaScript实现表格编辑器(实例讲解)
Aug 02 #Javascript
使用Node.js搭建静态资源服务详细教程
Aug 02 #Javascript
原生js获取left值和top值的三种方法
Aug 02 #Javascript
认识less和webstrom的less配置方法
Aug 02 #Javascript
基于Jquery Ajax type的4种类型(详解)
Aug 02 #jQuery
详解基于node的前端项目编译时内存溢出问题
Aug 01 #Javascript
You might like
适用于抽奖程序、随机广告的PHP概率算法实例
2014/04/09 PHP
使用ltrace工具跟踪PHP库函数调用的方法
2016/04/25 PHP
php中namespace及use用法分析
2016/12/06 PHP
JS中简单的实现像C#中using功能(有源码下载)
2007/01/09 Javascript
javascript之解决IE下不渲染的bug
2007/06/29 Javascript
Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
2008/09/26 Javascript
Javascript 二维数组
2009/11/26 Javascript
jquery的$(document).ready()和onload的加载顺序
2010/05/26 Javascript
正则表达式搭配js轻松处理json文本方便而老古
2013/02/17 Javascript
使用CSS和jQuery模拟select并附提交后取得数据的代码
2013/10/18 Javascript
js控制淡入淡出示例代码
2013/11/12 Javascript
javascript拖拽上传类库DropzoneJS使用方法
2013/12/05 Javascript
jQuery改变form表单的action,并进行提交的实现代码
2016/05/25 Javascript
HTML5基于Tomcat 7.0实现WebSocket连接并实现简单的实时聊天
2016/10/31 Javascript
javascript实现多张图片左右无缝滚动效果
2017/03/22 Javascript
WebStorm ES6 语法支持设置&babel使用及自动编译(详解)
2017/09/08 Javascript
无限循环轮播图之运动框架(原生JS实现)
2017/10/01 Javascript
微信小程序如何获取用户收货地址
2018/11/27 Javascript
validform表单验证的实现方法
2019/03/08 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
2019/11/01 Javascript
python3中str(字符串)的使用教程
2017/03/23 Python
python使用 HTMLTestRunner.py生成测试报告
2017/10/20 Python
使用django-crontab实现定时任务的示例
2018/02/26 Python
Python对象与引用的介绍
2019/01/24 Python
Django实现简单网页弹出警告代码
2019/11/15 Python
python使用HTMLTestRunner导出饼图分析报告的方法
2019/12/30 Python
keras 使用Lambda 快速新建层 添加多个参数操作
2020/06/10 Python
请说出这段代码执行后a和b的值分别是多少
2015/03/28 面试题
英语老师推荐信
2014/02/26 职场文书
信息技术毕业生自荐信范文
2014/03/13 职场文书
职业规划实施方案
2014/06/10 职场文书
殡葬服务心得体会
2014/09/11 职场文书
授权委托书(法人单位用)
2014/09/29 职场文书
分享提高 Python 代码的可读性的技巧
2022/03/03 Python
Win11运行育碧游戏总是崩溃怎么办 win11玩育碧游戏出现性能崩溃的解决办法
2022/04/06 数码科技
Oracle 11g数据库使用expdp每周进行数据备份并上传到备份服务器
2022/06/28 Oracle