let和const与var的区别
目录
一、定义
二、let
三、const
四、代码演示
四、循环中let和var声明的循环变量的区别
4.1 事件的绑定
4.2 循环变量存储的数据数值
4.2.1 var声明的循环变量
4.2.2 let声明的循环变量
一、定义
let和const是ES6新增的声明变量的关键词,之前声明变量的关键词是var。
二、let
- var定义的变量,可以预解析提前调用的结果是undefined,let定义的变量不能预解析,提前调用的结果是 报错。
- var定义的变量,变量名称可以重复,效果是重复赋值,let定义的变量不能重复,否则执行报错。
- var定义的变量作用域是全局/局部作用域。let定义的变量如果在{}中只能在{}中调用。
- 在循环语句中var定义的循环变量和使用let定义的循环变量。执行原理和执行效果不同。
三、const
- var定义的变量,可以预解析提前调用的结果是undefined,const定义的变量不能预解析,提前调用的结果是 报错。
- var定义的变量,变量名称可以重复,效果是重复赋值,const定义的变量不能重复,否则执行报错。
- var定义的变量作用域是全局/局部作用域。let定义的变量如果在{}中只能在{}中调用。
- const 定义的变量存储的数据数值不能改变,也就是const定义的变量,不能重复赋值。
四、代码演示
(1)提前调用报错
// 提前调用 预解析console.log( int1 );// // 提前调用 结果是报错console.log( int2 );// var 定义的变量 var int1 = 100 ;let int2 = 200 ;
(2)const与 let 定义的变量不能重复
// var 定义的变量 var int1 = 100 ;let int2 = 200 ;// 变量名称重复 重复赋值效果var int1 = '北京' ;console.log( int1 );// 变量名称重复 结果是报错let int2 = '上海' ;
(3)const与 let定义的变量如果在{}中只能在{}中调用
// 在 {} 中 使用 let 定义变量 只能在 { } 中 使用// 如果需要在 { } 中 对 let 定义的变量 进行操作 // 提前定义 变量 在 {} 中 进行赋值操作if( true ){var a = 300 ;let b = 400 ;// let 声明的变量 在 { } 中可以调用// 对 {} 外定义的变量 进行赋值操作console.log( b );}console.log( a ) ; // let 声明的变量 在 { } 外 不能调用 console.log( b );
(4)const定义的变量不能重复赋值。
// const 定义的变量 不能重复赋值// const c = 100 ;// c = 200 ;// 结果是报错const arr = [1,2,3,4,5] ;// 只是修改引用数据类型中,数据单元存储的数据// 没有修改 arr变量中 存储的引用数据类型的内存地址arr[0] = '北京' ;console.log( arr );
运行结果:
(1)提前调用报错
(2)const与 let 定义的变量不能重复
(3)const与 let定义的变量如果在{}中只能在{}中调用
(4)const定义的变量不能重复赋值。
四、循环中let和var声明的循环变量的区别
4.1 事件的绑定
通过for循环给标签绑定事件,也就是一打开执行界面,事件绑定就结束了,也就是 循环已经结束了,也就是触发事件时循环已经结束了。
4.2 循环变量存储的数据数值
4.2.1 var声明的循环变量
在整个循环变量过程中只定义了一个循环变量i,每次循环都对这一个循环变量i进行重复赋值,也就是之后的循环变量数值会覆盖之前的循环变量数值,当循环结束后只有一个循环变量i,存储的是最终的循环变量数值。
4.2.2 let声明的循环变量
在整个循环过程中每次循环都相当于触发执行了一个{ },每一个{ }对于let定义的变量就是一个独立的作用域,也就是每次循环let声明的循环变量都是一个人独立作用域中的循环变量,每一次循环中循环变量都会存储不同的数据数值,互相之间不会影响,不会覆盖,也就是每次循环let声明的循环变量都相当于是一个独立的变量,不会覆盖之前的数据数值。
代码演示:
<ul><li>我是第一个li</li><li>我是第二个li</li><li>我是第三个li</li><li>我是第四个li</li><li>我是第五个li</li></ul><script>// 给 li 绑定事件 点击 li标签 弹出 索引下标// 获取标签对象const oLis = document.querySelectorAll('ul>li');// 通过 for循环 给 li标签 绑定事件for( var i = 0 ; i <= oLis.length -1 ; i++ ){// i 是 索引下标 oLis[i] 是 li标签对象oLis[i].addEventListener( 'click' , function(){// 点击时输出索引下标console.log( `我是var循环的i ${i}` );})}for( let j = 0 ; j <= oLis.length -1 ; j++ ){// i 是 索引下标 oLis[i] 是 li标签对象oLis[j].addEventListener( 'click' , function(){// 点击时输出索引下标console.log( `我是let循环的i ${j}` );})}</script>
运行结果:
let和const与var的区别相关推荐
- uniapp 获取到js文件var一个变量怎么获取到这个变量值_浅析Js中const,let,var的区别及作用域...
理解:let变量的作用域只能在当前函数中 js中const,let,var的区别及作用域_lianzhang861的博客-CSDN博客blog.csdn.net 全局作用域中,用 const 和 l ...
- let、const和var的区别(涉及块级作用域)
let .const和var的区别 let.const.var在js中都是用于声明变量的,在没有进行ES6的学习前,我基本只会使用到var关键字进行变量的声明,但在了解了ES6之后就涉及到了块级作用域 ...
- js const 和 var 的区别
const 其作用域和let一样,都是块作用域的,并且呢,如果const变量是基本类型值,则值不可变,如果值为引用类型数据结构,那么其引用的变量不可变,当然啦,const初始化的时候必须要赋值.不允许 ...
- JavaScript let、const与var的区别
ES5中的var是没有块级作用域的(if/for) ES5中的let是有块级作用域的(if/for) ES5之前因为if和for都没有块级作用域的概念,所以在很多时候,我们都必须借助于function ...
- let、const、var的区别
var是ES5提出的,let和const是ES6提出的. const声明的是常量,必须赋值 1)一旦声明必须赋值,不能使用null占位. 2)声明后不能再修改 3)如果声明的是复合类型数据,可以修改其 ...
- var let const声明变量的区别
在js中定义变量的方式有三种,其中let和const关键字是来自ES6中的,下面将逐一介绍各个关键字声明变量的特点. var声明变量 var 是一个 JS关键字,用来声明变量( variable 变量 ...
- 前端进阶之 let、const、var
作者:陈大鱼头 github: KRISACHAN 链接:github.com/YvetteLau/S- 背景:最近高级前端工程师 刘小夕 在 github 上开了个每个工作日布一个前端相关题的 re ...
- 对比let、const、var的异同
let.const和var的区别 var : 作用域是函数体的全部,声明变量提升 console.log(num);//undefinedvar num = 2 //循环内变量过度共享for (var ...
- js中const,var,let区别与用法
原文链接:https://blog.csdn.net/qq_36784628/article/details/80966826 js中三种定义变量的方式const, var, let的区别. 1. c ...
最新文章
- dropout层_深度学习两大基础Tricks:Dropout和BN详解
- css—盒子模型理解
- PHP快速入门教程:WHILE循环示例
- 您属于哪个版本的程序员[转]
- 第三次学JAVA再学不好就吃翔(part59)--冒泡排序选择排序以及二分查找
- navicat for mysql 13_Navicat for MySQL下载
- java开放地址法和链地址法解决hash冲突
- pythonexecquery_python 进程信息
- 分享一个debian系统优秀的镜像源
- Docker容器的数据卷备份与恢复
- 2.8 循环语句介绍
- 开篇第一章,开宗明义。
- Oracle truncate table 与 delete tabel的区别
- 螺母_常用硬件的种类以及选用_day15
- 2020年下半年软件设计师上午真题及答案解析
- 华为性格测评注意事项
- KK集团5年估值200亿,新零售还好做吗?
- 计算机图片怎么截图快捷键,电脑怎么截图,常见的截图快捷键
- 节点精灵免root脚本之直播间秒抢红包雨
- 从零写VIO|第二节——作业:使用Allen方差工具标定IMU