var let const 区别
时间:2020-05-29
本文章向大家介绍var let const 区别,主要包括var let const 区别使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
// var let const 区别 // ES5 只有全局作用域和函数作用域,没有块级作用域,这带来很多不合理的场景,
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>var</title> <script> window.onload = function(){ var aLi = document.getElementsByTagName('li'); for (var i=0;i<aLi.length;i++){ /*将var改为let*/ aLi[i].onclick = function(){ alert(i); /*单击任何标签都输出4*/ } } } </script> </head> <body> <ul> <li>0</li> <li>1</li> <li>2</li> <li>3</li> </ul> </body> </html>
// 在ES6之前,大部分人会选择使用闭包来解决这个问题,今天我们使用ES6提供的let来解决这个问题。
// 1.0 var声明的变量会挂在window上,而let和const不会 var a=100 console.log(a,window.a) //100 100 let b=100 console.log(b,window.b) // 100 undefined const c = 1; console.log(c,window.c); // 1 undefined // 2.0 var声明的变量存在变量提示,let和const不存在变量提示 console.log(d); // undefined (d已声明还没赋值,默认得到undefined值) var d = 100; console.log(e); // 报错:Uncaught ReferenceError: Cannot access 'e' before initialization let e = 10; console.log(f); // 报错:Uncaught ReferenceError: Cannot access 'e' before initialization const f = 10; // 3.0 let和const声明形成块级作用域 if(true){ var g=100; let h=10; const i=10; } console.log(g) //100 console.log(h) //Uncaught ReferenceError: h is not defined console.log(i) //Uncaught ReferenceError: i is not defined //4.0 同一作用域下let和const不能声明同名变量,而var可以 var a1 = 100; console.log(a); // 100 var a2 = 10; console.log(a); // 10 let a3 = 100; let a3 = 10; // 5.0 暂存死区 var a4=100; if(1){ //在当前块作用域中存在a使用let/const声明的情况下,给a赋值10时,只会在当前作用域找变量a, // 而这时,还未到声明时候,所以控制台Error:a is not defined a4=10; let a4=1; } // 6.0const // 1、一旦声明必须赋值, // 2、声明后不能再修改 // 3、如果声明的是复合类型数据,可以修改其属性 const a5 = 100; const list = []; list[0] = 10; console.log(list); // [10] const obj = {a:100}; obj.name = 'apple'; obj.a = 10000; console.log(obj); // {a:10000,name:'apple'}
原文地址:https://www.cnblogs.com/zhuMother/p/12988705.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 编写代码生成器的一些问题与思考
- 和小曼一起走到MySQL行的尽头
- 明亮解我“工厂模式无用”之惑
- 「源码分析」— 为什么枚举是单例模式的最佳方法
- 如何记忆 Spring Bean 的生命周期
- 系统学习Stream
- Java回调的四种写法(反射、直接调用、接口调用、Lamda表达式)
- 避开NullPointerException的10条建议
- REST服务,使用Dubbo还是SpringMVC?
- Linux系统下Anaconda的安装和使用教程
- Flutter Dojo设计之道——利用Github打造完善的开源项目
- 最强 Redis 客户端 lettuce 已支持 Redis6客户端
- 还在手动整理数据库文档?试试这个工具
- Elasticsearch 常见的 8 种错误及最佳实践
- Spark流式状态管理