《02》let 和 const 命令

目录

1.let命令

基本用法

暂时性死区

不允许重复声明 

2.块级作用域

3.const 命令

基本用法

本质


1.let命令

基本用法

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

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>let基础用法</title>
</head>
<body><script>{let a=1;var b=2;}console.log("变量a:"+a)//未定义console.log("变量b:"+b)//2</script>
</body>
</html>

上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果

let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。

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

for(let i=0; i<10; i++){
}
console.log("变量i"+i)//Uncaught ReferenceError: i is not defined

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

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

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

上面代码中,变量i是let声明的,当前的i只在本轮循环有效,所以每一次循环的i其实都是一个新的变量,所以最后输出的是6。你可能会问,如果每一轮循环的变量i都是重新声明的,那它怎么知道上一轮循环的值,从而计算出本轮循环的值?这是因为 JavaScript 引擎内部会记住上一轮循环的值,初始化本轮的变量i时,就在上一轮循环的基础上进行计算。

暂时性死区

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

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

if (true) {// TDZ开始tmp = 'abc'; // ReferenceErrorconsole.log(tmp); // ReferenceErrorlet tmp; // TDZ结束console.log(tmp); // undefinedtmp = 123;console.log(tmp); // 123
}

不允许重复声明 

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

// 报错
function func() {let a = 10;var a = 1;
}// 报错
function func() {let a = 10;let a = 1;
}

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

function func(arg) {let arg;
}
func() // 报错function func(arg) {{let arg;}
}
func() // 不报错

2.块级作用域

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

function f1() {let n = 5;if (true) {let n = 10;}console.log(n); // 5
}

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

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

3.const 命令

基本用法

const声明一个只读的常量。一旦声明,常量的值就不能改变。

const PI = 3.1415;
PI // 3.1415PI = 3;
// TypeError: Assignment to constant variable.

上面代码表明改变常量的值会报错。

const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。

const foo;
// SyntaxError: Missing initializer in const declaration

上面代码表示,对于const来说,只声明不赋值,就会报错。

const的作用域与let命令相同:只在声明所在的块级作用域内有效。

if (true) {const MAX = 5;
}MAX // Uncaught ReferenceError: MAX is not defined

const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用。

本质

const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/357173.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

在线支付模块小结

一、概述 在所有的电子商务网站中都提供了在线支付功能&#xff0c;用户可以将在网上选购的商品生成订单后通过网站提供的在线支付功能进行结算。网站开发者可以直接使用银行提供的接口实现在线支付&#xff0c;也可以使用第三方支付平台来实现。使用银行接口需要自行开发程序&…

《03》JavaScript编码风格

探讨如何将 ES6 的新语法&#xff0c;运用到编码实践之中&#xff0c;与传统的 JavaScript 语法结合在一起&#xff0c;写出合理的、易于阅读和维护的JavaScript 风格规范代码。 目录 1.块级作用域 &#xff08;1&#xff09;let 取代 var &#xff08;2&#xff09;全局常量…

js 闭包作用域和作用域链_Java:伪造工厂的闭包以创建域对象

js 闭包作用域和作用域链最近&#xff0c;我们想创建一个域对象&#xff0c;该对象需要具有外部依赖关系才能进行计算&#xff0c;并且希望能够在测试中解决该依赖关系。 最初&#xff0c;我们只是在领域类中引入依赖关系&#xff0c;但这使得无法在测试中控制其值。 同样&…

读《第一次把事情做对》有感

上班的时候&#xff0c;领导在群里发了一个PDF书籍《第一次把事情做对》&#xff0c;被这个书籍名称吸引住了&#xff0c;因为作为程序员每天有开发新任务&#xff0c;解决旧任务的BUG&#xff0c;第一次就把事情做的完全正确几乎不可能呀&#xff0c;觉得很有看的必要&#xf…

Centos配置国内yum源

网易&#xff08;163&#xff09;yum源是国内最好的yum源之一 &#xff0c;无论是速度还是软件版本&#xff0c;都非常的不错&#xff0c;将yum源设置为163yum&#xff0c;可以提升软件包安装和更新的速度&#xff0c;同时避免一些常见软件版本无法找到。具体设置方法如下&…

做了三年前端,你才知道10分钟就能实现一个PC版魔方游戏

导读&#xff1a;最近手头有点紧&#xff0c;看到很多小朋友都在玩魔方&#xff0c;又没有money买&#xff0c;只能自己用JavaScriptcss实现一个&#xff0c;在电脑端就能开启魔方之旅。 目录 项目启动演示 项目目录 ​源码地址 项目启动演示 前端使用JavaScript和纯CSS实现…

UVA 2474 - Balloons in a Box 爆搜

2474 - Balloons in a Box题目连接&#xff1a; https://icpcarchive.ecs.baylor.edu/index.php?optioncom_onlinejudge&Itemid99999999&pageshow_problem&category36&problem475&mosmsgSubmissionreceivedwithID1967446 Description You must write a pr…

15K的前端应届毕业生,就因为掌握了这些知识点!(前端企业级开发必备)

目录 1.前端开发 下载安装VScode 优化配置 2、插件安装 3、设置字体大小 4、开启完整的Emmet语法支持 5、视图 2.Node.js 入门 2.1、什么是Node.js 2.2、Node.js有什么用 2.3、安装 下载&#xff1a; 2.4、快速入门 2.5、服务器端应用开发 3、ES6入门 3.2、let声…

[Training Video - 1] [Selenium Basics] [Download and Install Selenium]

Download Selenium Jars Configure jars in eclipse Webdriver http://docs.seleniumhq.org/download/ Selenium RC http://code.google.com/p/selenium/downloads/detail?nameselenium-remote-control-1.0.3.zip&can2&q转载于:https://www.cnblogs.com/MasterMonkInT…

【0元试用微软 Azure人工智能认知服务】这个人脸识别功能太强大啦

导读&#xff1a;这个由美丽的客服小姐姐提前申请好了企业试用的账号&#xff0c;个人的话还得需要visa卡。 官网地址&#xff1a;azure.cn 登录地址&#xff1a;portal.azure.cn 目录 1.简介 2.Azure 认知服务是什么&#xff1f; ​ 3.认知服务的四种职能 4.人脸API 5.新建一…

OpenMap教程3 –使用MapHandler构建基本的地图应用程序–第2部分

1.简介 在上一教程中&#xff0c;我们看到了MapHandler如何将各种组件连接在一起&#xff08;更具体地说&#xff0c;是从MapHandlerChild派生的类&#xff09;。 我们看到了如何以编程方式执行此操作&#xff0c;但是还有另一种声明性地使用openmap.properties 。 样本OpenMa…

《javaScript100例|01》超级经典一套鼠标控制左右滚动图片带自动翻滚

目录 HTML示例 图片示例 HTML示例 <html > <head> <meta http-equiv"Content-Type" content"text/html; charsetgb2312" /> <title>超级经典一套鼠标控制左右滚动图片带自动翻滚</title> <style type"text/css&quo…

jsf集成spring_Spring和JSF集成:MVC螺母和螺栓

jsf集成spring过去&#xff0c;我曾尝试将JSF与Spring MVC集成在一起&#xff0c;尽管我的第一次尝试成功了&#xff0c;但这远非理想。 这次&#xff0c;我决定做出一些关键决定来帮助我集中精力&#xff1a; 向后兼容。 支持JSF 1.2涉及的工作太多&#xff0c;而Spring 3.1中…

[BZOJ1007] [HNOI2008] 水平可见直线 (凸包)

Description 在xoy直角坐标平面上有n条直线L1,L2,...Ln,若在y值为正无穷大处往下看,能见到Li的某个子线段,则称Li为可见的,否则Li为被覆盖的. 例如,对于直线:L1:yx; L2:y-x; L3:y0 则L1和L2是可见的,L3是被覆盖的. 给出n条直线,表示成yAxB的形式(|A|,|B|<500000),且n条直线两…

《javaScript100例|02》超级经典一套鼠标控制左右滚动图片带自动翻滚

目录 效果图 JS示例 源码地址&#xff1a; 效果图 JS示例 <title>JavaScript切换图片</title> <script> function showDaTu(src){ document.getElementById("defaultImg").srcsrc; } </script> <img src"wall1.jpg" id"…

抽象工厂设计模式示例

本文是我们名为“ Java设计模式 ”的学院课程的一部分。 在本课程中&#xff0c;您将深入研究大量的设计模式&#xff0c;并了解如何在Java中实现和利用它们。 您将了解模式如此重要的原因&#xff0c;并了解何时以及如何应用模式中的每一个。 在这里查看 &#xff01; 目录 …

《javaScript100例|03》自写javaScript+CSS轮显效果

目录 效果图 代码示例 源码地址&#xff1a;自写JsCSS轮显效果.rar-互联网文档类资源-CSDN下载https://download.csdn.net/download/weixin_41937552/37380520 效果图 代码示例 <html xmlns"http://www.w3.org/1999/xhtml"> <head> <meta http-equ…

linux shell 指令 诸如-d, -f, -e之类的判断表达式

文件比较运算符-e filename 如果 filename存在&#xff0c;则为真 [ -e /var/log/syslog ]-d filename 如果 filename为目录&#xff0c;则为真 [ -d /tmp/mydir ]-f filename 如果 filename为常规文件&#xff0c;则为真 [ -f /usr/bin/grep ]-L filename 如果 filenam…

《javaScript100例|04》自动播放——Js幻灯片缓冲效果

目录 效果图 示例 源码地址&#xff1a; 效果图 示例 <html> <head> <title>自动播放——幻灯片缓冲效果</title> <style> body,div,ul,li{margin:0;padding:0;} ul{list-style-type:none;} body{background:#000;text-align:center;font:12p…

每周必写

这周没有上课&#xff0c;阅读了《代码大全》第六章模块化设计 内聚性和耦合性 模块化设计的目标是使每个子程序都成为一个“黑盒子”&#xff0c;你知道进入盒子和从盒子里出来 的是什么&#xff0c;却不知道里边发生什么。它的接口非常简单&#xff0c;功能明确&#xff0c;对…