ES5中的var是没有块级作用域的(if/for)

ES5中的let是有块级作用域的(if/for)

ES5之前因为if和for都没有块级作用域的概念,所以在很多时候,我们都必须借助于function的作用域来解决外面变量的问题(闭包)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Vuejs</title><script src="js/vue.js"></script>
</head>
<body><button>按钮1</button><button>按钮2</button><button>按钮3</button><hr><input type="button" value="按钮1"><input type="button" value="按钮2"><input type="button" value="按钮3">
<script>// ES5之前因为if和for都没有块级作用域的概念,所以在很多时候,// 我们都必须借助于function的作用域来解决外面变量的问题(闭包)// ES6中,加入了let,let它是有if和for的块级作用域// var没有块级作用域,在变量作用域外一样可以调用{var name = "breezy";console.log(name);}console.log(name);// 没有块级作用域引起的问题:if的块级var func;if(true){var name2 = "kuse";func = function(){console.log(name2);}}// name2 = "KU";func();// 没有块级作用域引起的问题:for的块级// 闭包可以解决这个问题,因为函数是一个作用域var btns = document.getElementsByTagName("button");for(var i = 0; i < btns.length; i++){//错误方式// btns[i].addEventListener('click', function(){//   console.log("第" + i + "个按钮被点击");// })// 闭包写法(function(num){btns[num].addEventListener('click', function(){console.log("第" + num + "个按钮被点击");})})(i)}// ES6写法const btnss = document.getElementsByTagName("input");for(let i = 0; i < btnss.length; i++){btnss[i].addEventListener("click", function(){console.log("第" + i + "个按钮被点击");})}
</script></body>
</html>

const定义某个变量为常量,不可以再次赋值

当我们修饰的标识符不会被再次赋值时,就可以使用const来保证数据的安全性

<script>const a = 20;// a = 30; //错误:不可以再次修改// const name; //错误:const修饰的标识符必须赋值// 常量的含义是指向的对象不能修改,但是可以改变对象内部的属性const obj = {name:'breezy',age: 18}console.log(obj);obj.name = "kuse";obj.age = 20;console.log(obj);
</script>

对象字面量增强写法

<script>// 1、属性的增强写法const name = "breezy";const age = 18;const height = 1.88;// ES5的写法const obj = {name: name,age: age,height: height}console.log(obj);// ES6的写法const obj2 = {name,age,height}console.log(obj2);
</script>
<script>// 2、函数的增强写法// ES5的写法const obj = {run: function(){}, eat: function(){}}// ES6的写法const obj2 = {run(){},eat(){}}
</script>

JavaScript let、const与var的区别相关推荐

  1. uniapp 获取到js文件var一个变量怎么获取到这个变量值_浅析Js中const,let,var的区别及作用域...

    理解:let变量的作用域只能在当前函数中 js中const,let,var的区别及作用域_lianzhang861的博客-CSDN博客​blog.csdn.net 全局作用域中,用 const 和 l ...

  2. let、const和var的区别(涉及块级作用域)

    let .const和var的区别 let.const.var在js中都是用于声明变量的,在没有进行ES6的学习前,我基本只会使用到var关键字进行变量的声明,但在了解了ES6之后就涉及到了块级作用域 ...

  3. javascript中let和var的区别

    let是es6中新增命令,也是用来声明变量的,可能很多小伙伴都像我一样,定义变量的时候都会用var而很少用到let,那么,let和var到底有什么区别呢? let和var的区别体现在作用域上.var的 ...

  4. let和const与var的区别

    目录 一.定义 二.let 三.const 四.代码演示 四.循环中let和var声明的循环变量的区别 4.1  事件的绑定 4.2  循环变量存储的数据数值 4.2.1  var声明的循环变量 4. ...

  5. js const 和 var 的区别

    const 其作用域和let一样,都是块作用域的,并且呢,如果const变量是基本类型值,则值不可变,如果值为引用类型数据结构,那么其引用的变量不可变,当然啦,const初始化的时候必须要赋值.不允许 ...

  6. let、const、var的区别

    var是ES5提出的,let和const是ES6提出的. const声明的是常量,必须赋值 1)一旦声明必须赋值,不能使用null占位. 2)声明后不能再修改 3)如果声明的是复合类型数据,可以修改其 ...

  7. var let const声明变量的区别

    在js中定义变量的方式有三种,其中let和const关键字是来自ES6中的,下面将逐一介绍各个关键字声明变量的特点. var声明变量 var 是一个 JS关键字,用来声明变量( variable 变量 ...

  8. 前端进阶之 let、const、var

    作者:陈大鱼头 github: KRISACHAN 链接:github.com/YvetteLau/S- 背景:最近高级前端工程师 刘小夕 在 github 上开了个每个工作日布一个前端相关题的 re ...

  9. 对比let、const、var的异同

    let.const和var的区别 var : 作用域是函数体的全部,声明变量提升 console.log(num);//undefinedvar num = 2 //循环内变量过度共享for (var ...

最新文章

  1. 清华本科生开发强化学习平台「天授」:千行代码实现,性能吊打国外成熟平台,刚刚开源...
  2. UA MATH564 概率论 计算至少有一个发生的概率:Boole不等式
  3. php json无法解析中文,json 无法解析解决方法
  4. checking size of char… configure: error: cannot compute sizeof (char) 解决方法
  5. Java并发编程包中atomic的实现原理
  6. standalone应用_具有Spring Boot的Spring Integration Standalone应用程序
  7. Windows 系统补丁管理策略
  8. python语言逆序符号_python的逆序
  9. 关于 c++ opencv [ INFO:0] global c:\build\master_winpack-build-win64-vc15\***
  10. 威纶和s7200通讯线_威纶触摸屏如何与西门子PLC进行通信,教你两种方法吧!
  11. python复数运算程序_python复数及计算法则
  12. RNN的数学符号(Notation)
  13. LRC (Lyric) 字幕
  14. 360安全卫士和火绒之间的事
  15. Unity打包生成APK文件提交应用宝踩坑记录
  16. ng-model、ng-bind、ng-value使用区别
  17. 多人在线编辑文档 开发_腾讯文档,支持多人实时在线协同编辑
  18. 【量化选基】每年初买入近5年 收益率最高的10支基金会暴富吗?
  19. Linux一键脚本自动化安装项目环境
  20. 遇到mysqladmin flush-hosts报错解决思路

热门文章

  1. python traceback_Python 列表操作,节后大放送
  2. vue 新建的页面如何访问_Vue.js—实现前后端分离架构中前端页面搭建(四)(完)...
  3. 散点图 横纵坐标_厉害了我的Python!散点图还能这么画
  4. maven3.6.3 配置环境变量_JDK1.8简单配置环境变量---两步曲
  5. System.gc()与Object.finalize()的区别
  6. springmvc+json 前后台数据交互
  7. POJ 1417 True Liars 并查集+背包
  8. 【MongoDB for Java】Java操作MongoDB
  9. Centos系统查看CPU有关信息
  10. PHP--去除字符串首尾空格