返回顶部
首页 > 资讯 > 精选 >javascript的let和const命令怎么使用
  • 712
分享到

javascript的let和const命令怎么使用

2023-07-02 12:07:52 712人浏览 八月长安
摘要

本篇内容介绍了“javascript的let和const命令怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!let命令基本用法我们都知

本篇内容介绍了“javascript的let和const命令怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

    let命令

    基本用法

    我们都知道let命令是用来声明变量的,类似于var,但是通过let命令声明的变量只在所在代码块内有效。

    let a = [];for (let i = 0;i < 10; i++ ) {    a[i] = function () {        console.log(i);    }}a[5](); // 5

    如上代码所示,使用的是let声明的i,那么这个变量仅在块级作用域内有效,即只在每轮循环内有效,所以每次循环的i其实都是一个新变量,所以最后输出了5。

    如果使用了var去申明i,那么这个i是在全局范围内都有效的,函数数组里的i都会指向同一个i,导出最后输出的是最后一轮循环的i的值。

    那就有了一个疑问,使用let声明的i如果每一轮都是一个新变量,那怎么知道上一轮循环的值然后计算出本轮的值?

    这是因为JavaScript引擎内部会记住上一轮循环的值,初始化当次循环的i时,会在上一轮循环的基础上计算。

    for循环还有一个特别的地方,就是设置循环变量的括号内是一个父作用域,而循环体内是一个单独的子作用域。

    特性

    不存在变量提升:

    不存在变量提升我们应该都知道,在var命令中会发生“变量提升”,就是变量可以在声明之前使用,而值是undefined。这种是比较奇怪的现象,因为他都还没声明怎么就可以使用呢?

    所以。let命令改变了这种语法,通过let声明的变量一定要在变量声明后才能用,不然就会报错。

    console.log(b) // undefinedconsole.log(a) // 报错ReferenceErrorlet a = 2;var b = 1;

    暂时性死区

    只要块级作用域内存在Let命令,那么这个let声明的变量就绑定了这个区域,不会受到外部的影响。

    var num = 1;if(true) {    num = 2; // 报错,ReferenceError    let num;}

    如上面代码所示,if代码块内想要修改的是if外部的num,但是if内部通过let声明了一个num但为赋值,所以导致了通过let声明的num绑定了这个块级作用域(即if内部这个块级作用域),所以不会受到外部的num影响,所以对num赋值会报错。

    es6明确规定了,如果在区块内存在let和const命令,那么这个区块对这些命令声明的变量从一开始就形成封闭的作用域,只要在声明之前就使用这些变量,就会报做。也称暂时性死区(temporal dead zone,简称TDZ)

    当然,这也造成了typeof变得不安全了,因为如果一个变量没有声明就使用typeof不会报错,会返回一个undefined,但是现在不成立了,因为会报错ReferenceError。

    function bar(x = y, y = 2) {    return[x,y] }bar() // 报错

    如上代码所示,调用bar函数会报错,因为参数x的默认值等于另一个参数y,但是x在声明的时候y还没有声明,属于死区

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

    其实let和const是存在变量提升的,但是由于暂时性死区的关系,变量已经存在了,但是不可获取,要等到声明变量的时候才可以获取和使用。

    不允许重复声明

    let不允许在校内共同作用域内重复声明同一个变量,这个就不用说了大家都知道。

    let a = 1;let a = 2; // 报错

    const

    我们都知道const声明一个只读的常量。修改这个值就会报错。但是实际上保证的不是变量的值不能改动,而是变量指向的那个内存地址不能改动。

    对于简单数据类型来说,值就是保存在变量指向的内存地址中,因此等同于常量。

    而对于复合类型的数据,变量指向的内存地址保存的是一个指针,const只保证指针是固定,不保证内部的结构是不是可变的。

        // 给对象添加一个属性    const foo = {}    foo.name = 123    console.log(foo.name) // 123    // 将foo指向另一个对象,就会报错    foo = {} // 报错。

    如果想要将对象冻结,可以使用Object.freeze

    const foo = Object.freeze({});

    特性

    • 只在声明所在的块级作用域内有效。

    • const声明的常量不会提升,同样存在暂时性死区,只能在声明后使用。

    • 不可重复声明。

    补充&mdash;&mdash;块级作用域

    函数能不能在块级作用域中声明呢?

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

    ES6中引入了块级作用域,明确允许在块级作用域之中声明函数。而且。函数声明的语句的行为类似于let,在块级作用域之外不可引用。

    function f() {    console.log('I am outside!')}(function() {    if(false) {        function f() {            console.log('I am inside')        }    }}f();}())

    上面的代码,在es5中运行时会得到I am inside!,因为if内部的f函数会被提升到函数头部。

    但是在ES6环境则会报错,为什么呢?

    因为游览器的实现有自己的方式:

    • 允许在块级作用域内声明函数

    • 函数声明类似于var,会提升到全局作用域或函数作用域的头部

    • 函数声明还会提升到所在的块级作用域的头部

    所以上述代码实际在ES6的游览器中会生成这样的代码:

      function f() {    console.log("I am outside!");  }  (function () {    var f = undefined;    if (false) {      function f() {        console.log("I am inside");      }    }  })();

    因此,应该避免在块级作用域内声明函数,如果确定需要写成函数表达式的形式,而不是函数声明语句。

    “javascript的let和const命令怎么使用”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站,小编将为大家输出更多高质量的实用文章!

    --结束END--

    本文标题: javascript的let和const命令怎么使用

    本文链接: https://lsjlt.com/news/341915.html(转载时请注明来源链接)

    有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

    猜你喜欢
    • javascript的let和const命令怎么使用
      本篇内容介绍了“javascript的let和const命令怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!let命令基本用法我们都知...
      99+
      2023-07-02
    • JavaScript中let与const命令使用
      目录let命令基本使用适用场景块级作用域概念存在意义const命令基本使用不可被const的情况let命令 基本使用 let是ES6中新增的声明变量的命令,但是和var不同,let不...
      99+
      2024-04-02
    • ES6的let和const命令怎么用
      今天小编给大家分享一下ES6的let和const命令怎么用的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。1. let 命令①...
      99+
      2023-06-17
    • ES6中let和const命令有什么用
      这篇文章将为大家详细讲解有关ES6中let和const命令有什么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。前言在javascript中,我们都知道使用var来声明变...
      99+
      2024-04-02
    • 详细解析let和const命令
      目录let命令基本用法特性暂时性死区不允许重复声明const特性补充——块级作用域let命令 基本用法 我们都知道let命令是用来声明变量的,类似于var,但...
      99+
      2024-04-02
    • JavaScript的let和const关键词怎么用
      本篇内容主要讲解“JavaScript的let和const关键词怎么用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JavaScript的let和const关键...
      99+
      2024-04-02
    • JavaScript ES的let与const关键字怎么使用
      这篇文章主要讲解了“JavaScript ES的let与const关键字怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript ES的let与cons...
      99+
      2023-06-21
    • Javascript 中 var 和 let 、const 的区别及使用方法
      目录1.var、let、const简介var 声明let 声明const 声明 总结1.var、let、const简介     &n...
      99+
      2023-01-13
      js中var和 let  const 区别 js中var和 let  const 使用
    • ES6新特性之let和const命令的示例分析
      这篇文章主要介绍了ES6新特性之let和const命令的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。具体如下:1. let 命令①...
      99+
      2024-04-02
    • JavaScript中var,let和const的区别是什么
      这篇文章主要为大家展示了“JavaScript中var,let和const的区别是什么”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JavaScript中var...
      99+
      2024-04-02
    • JavaScript变量中var,let和const的区别
      目录前言ES5与ES6的区别1. 作用域2. 全局属性3. 变量提升与暂时性死区4. 重复声明let与const的区别1. 常量最佳实践前言 JavaScript中一共有3种用来声明...
      99+
      2024-04-02
    • ES6新增关键字let和const怎么用
      这篇文章主要介绍了ES6新增关键字let和const怎么用,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。ES6新增加了两个重要的JavaScript关键字:let和const...
      99+
      2023-06-29
    • Linux常用命令let怎么用
      这篇文章主要为大家展示了“Linux常用命令let怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Linux常用命令let怎么用”这篇文章吧。Linux常用命令let 命令是 BASH 中用...
      99+
      2023-06-28
    • javascript的var与let,const的区别是什么
      本篇内容主要讲解“javascript的var与let,const的区别是什么”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“javascript的var与let,const的区别是什么”吧!说到...
      99+
      2023-06-22
    • JavaScript中var let const的用法有哪些区别
      目录1.重复声明1.1 var1.2 let1.3 const2.变量提升2.1 var2.2 let2.3 const3.暂时性死区3.1 var3.2 let3.3 conset...
      99+
      2024-04-02
    • es6中let和const的区别是什么
      这篇“es6中let和const的区别是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“...
      99+
      2024-04-02
    • ES6中let和const的特性是什么
      这篇文章主要介绍了ES6中let和const的特性是什么,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。let的特性:1.不存在变量提升现象:...
      99+
      2024-04-02
    • Linux的let命令有什么用
      本篇内容主要讲解“Linux的let命令有什么用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Linux的let命令有什么用”吧!let简单的计算器,执行算术表达式。概要 let&nb...
      99+
      2023-06-28
    • 前端 let、const和var你真的了解么?
      1.var 关键字要定义变量,可以使用 var 操作符(注意 var 是一个关键字),后跟变量名(即标识符,如前所述):var message;这行代码定义了一个名为 message 的变量,可以用它保存任何类型的值。(不初始化的...
      99+
      2022-06-01
    • JavaScript ES6语法中let,const ,var的区别是什么
      JavaScript ES6语法中let,const ,var的区别是什么,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。一、变量声明的方式let / con...
      99+
      2023-06-26
    软考高级职称资格查询
    编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
    • 官方手机版

    • 微信公众号

    • 商务合作