ECMAScript6新特性之let、const(图文教程)

下面小编就为大家带来一篇浅谈ecmascript6新特性之let、const。现在就分享给大家,也给大家做个参考。

接下来来介绍一下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(图文教程)

上面是我整理给大家的,希望今后会对大家有帮助。

相关文章:

php construct() 函数介绍与使用方法详解

constant函数介绍与使用方法详解

JS变量声明var,let.const使用详解

以上就是ECMAScript6新特性之let、const(图文教程)的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2760964.html

(0)
上一篇 2025年3月8日 09:26:45
下一篇 2025年3月3日 21:56:23

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • javascript 中事件委托(图文教程)

    这篇文章主要介绍了javascript 中的事件委托详解的相关资料,需要的朋友可以参考下 这几天看到一个面试题,大概就是,让你给1000个li都添加一个click事件,应该怎么添加?大多数人第一开始的感觉可能就是,每个li上边都添加一个呗,…

    2025年3月8日
    200
  • Javascript闭包与函数柯里化浅析(图文教程)

    这篇文章主要介绍javascript闭包与柯里化,通俗易懂,需要的朋友可以参考下。 闭包和柯里化都是JavaScript经常用到而且比较高级的技巧,所有的函数式编程语言都支持这两个概念,因此,我们想要充分发挥出JavaScript中的函数式…

    编程技术 2025年3月8日
    200
  • dwz 如何去掉ajaxloading(图文教程)

    下面为大家详细介绍下具体的去掉方法,有兴趣的朋友可以来看看。 最近使用dwz来做项目,有时候在ajax的时候并不想使用dwz的loading。 所以就像去掉,很简单,只需要一行代码:  $.ajaxSettings.global=false…

    编程技术 2025年3月8日
    200
  • Ajax跨域请求的原理(图文教程)

    这篇文章主要为大家详细介绍了ajax跨域请求的原理,ajax怎么样做跨域请求?具有一定的参考价值,感兴趣的小伙伴们可以参考一下 本文实例为大家分享了Ajax跨域请求的具体实现过程,供大家参考,具体内容如下 下面我们在本地建两个站点演示一下 …

    2025年3月8日 编程技术
    200
  • Django Ajax的使用教程

    这篇文章主要介绍了django ajax的使用教程,需要的朋友可以参考下 简介: AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。 AJAX 不是新的编程语言,而是一…

    2025年3月8日 编程技术
    200
  • AngularJS tab栏实现和mvc小案例(图文教程)

    这篇文章主要介绍了angularjs tab栏实现和mvc小案例,本文通过实例代码给大家介绍的非常详细,需要的朋友可以参考下 tab栏: 代码: nbsp;html>        Tab 标签    body { margin: 0…

    2025年3月8日
    200
  • Ajax基础与登入教程

    ajax 是 asynchronous javascript and xml的缩写。其优点可以减轻服务器的负担,按需取数据,最大程度的减少冗余请求。接下来通过本文给大家介绍ajax基础与登入教程,需要的的朋友参考下 Ajax 是 Async…

    2025年3月8日 编程技术
    200
  • jquery的 filter()方法使用教程

    filter() 方法返回符合一定条件的元素。该方法让您规定一个条件。不符合条件的元素将从选择中移除,符合条件的元素将被返回。这篇文章主要介绍了 jquery的 filter()方法使用,需要的朋友可以参考下 定义和用法 filter() …

    编程技术 2025年3月8日
    200
  • 微信小程序block的使用教程

    这篇文章主要介绍了微信小程序block的使用 ,微信小程序最近非常火热,实现起来也很简单,只要block就可以实现,需要的朋友可以参考下 经过一年的发展,微信小程序发展火热,本期就介绍下小程序的一些使用。 在安卓中我们经常会使用ListVi…

    2025年3月8日
    200
  • 使用vue及element组件的安装教程(详细教程)

    下面我就为大家分享一篇vue的安装及element组件的安装,具有很好的参考价值,希望对大家有所帮助。 一、新建vue项目 1、首先需要下载nodejs,安装后打开命令窗口可以使用npm包管理工具 npm集成在node中的,所以直接输入np…

    2025年3月8日 编程技术
    200

发表回复

登录后才能评论