var、let、const在使用中的区别

最新推荐文章于 2022-03-18 00:12:16 发布

猫儿念你

最新推荐文章于 2022-03-18 00:12:16 发布

阅读量131

点赞数

分类专栏：前端学习-原创文章标签： javascript es6

本文链接：https://blog.csdn.net/qq_35779070/article/details/107252807

版权

前端学习-原创专栏收录该内容

35 篇文章 0 订阅

订阅专栏

var、let、const在使用中的区别

此文章非原创文章，是借鉴文章，转载请注意！！！

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			//1.var 声明变量挂载在window上，let和const声明的变量不会
			// var a = 10;
			// console.log(a,window.a);//输出 10 10
			
			// let a = 10;
			// console.log(a,window.a);//10 undefined
			
			// const a = 10;
			// console.log(a,window.a);//10 undefined
			
			
			//2.var声明变量时存在变量声明提升，所以在b赋值之前输出b，b的值是undefined
			// console.log(b);
			// var b = 20;
			// console.log(b); //输出：undefined 20
			
			// console.log(b);
			// let b = 20;
			// console.log(b); //控制台报错：Uncaught ReferenceError: Cannot access 'b' before initialization【未捕获的引用错误：无法在初始化之前访问“b”】
			
			// console.log(b);
			// const b = 20;
			// console.log(b); //控制台报错：Uncaught ReferenceError: Cannot access 'b' before initialization【未捕获的引用错误：无法在初始化之前访问“b”】
			
			//3.let和const声明形成作用域块	
			// if(1){
			// 	var a1 = 1000;
			// 	let b1 = 2000;
			// 	const c1 = 3000;
			// 	console.log(a1,b1,c1);//1000 2000 3000
			// }
			// console.log(a1);//1000
			// // console.log(b1);//控制台报错：Uncaught ReferenceError: c1 is not defined【未定义】
			// console.log(c1);//控制台报错：Uncaught ReferenceError: c1 is not defined【未定义】
			
			
			
			//4.同一作用域下let和const不能声明同名变量，而var可以
			// console.log(a);
			// var a = 100;
			// console.log(a);
			// var a = 200;
			// console.log(a);//输出 undefined 100 200
			
			
			// let a = 100;
			// console.log(a);
			// let a = 200;
			// console.log(a);//控制台报错：Uncaught SyntaxError: Identifier 'a' has already been declared【a已经被声明】
			
			// const a = 100;
			// console.log(a);
			// const a = 200;
			// console.log(a);控制台报错：Uncaught SyntaxError: Identifier 'a' has already been declared【a已经被声明】
			
			
			
			//5.let同一作用域赋值可以修改，不同作用域可以多次声明并修改值
			// let a = 30;
			// console.log(a);
			// a = 40;
			// console.log(a);//输出：30 40
			
			// let a =30;
			// console.log(a);
			// if(1){
			// 	//console.log(a);//控制台报错：2.html:75 Uncaught ReferenceError: Cannot access 'a' before initialization【无法在初始化之前访问a】
			// 	let a = 40;
			// 	console.log(a);//输出：40
			// }
			
			// let a ="";
			// console.log(a);//输出：""
			// let a = null;
			// console.log(a);//输出：null
			
			// let a = undefined;
			// console.log(a);//输出：undefined
	
	
	        //6.const 同一作用域赋值以后不能更改值,不同作用域可以多次声明并修改值
			// const b = null;
			// console.log(a);//输出：null
			
			// const b = ""
			// console.log(b);//输出：""
			
			// const b = undefined;
			// console.log(b);//输出：undefined
			
			// const b = "123";
			// b = "234";
			// console.log(b);//控制台报错：Assignment to constant variable.【对常量变量赋值。】
			
			// const b = "123";
			// if(1){
			//     b = "234";
			// 	console.log(b);
			// }
			// console.log(b);//控制台报错：Assignment to constant variable.【对常量变量赋值。】
			
			// const b = "123";
			// if(1){
			// 	const b = "234";
			// 	console.log(b);
			// }
			// console.log(b);//输出：234 123
			
			//7.let、var可以只声明不赋值，const不可以
			
			// let b;
			// console.log(b);//输出：undefined
             
			// var b;
			// console.log(b);//输出：undefined
			
			// const b;
			// console.log(b);//控制台报错：Uncaught SyntaxError: Missing initializer in const declaration【声明中缺少初始值设定项】
			
			
			//8.暂存死区
			// var a = 100;
			// console.log(a);//输出：100
			// if(1){
			// 	a = 200;
			// 	 //在当前块作用域中存在a使用let/const声明的情况下，给a赋值10时，只会在当前作用域找变量a，也就是说只会找的a是const/let声明的a
			// 	console.log(a);//输出: Uncaught ReferenceError: Cannot access 'a' before initialization【无法在初始化之前访问a】
			// 	let a = 1000;				
			// }
			
			var a = 100;
			console.log(a);//输出：100
			if(1){
                let a = 1000;
				console.log(a);//输出：1000
			}
		</script>
	</body>
</html>

参考：
var与let、const的区别
 [javascript] var let const声明变量的区别
 理解es6中的暂时性死区
 MDN-关于let介绍

猫儿念你

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
var、let、const在使用中的区别

var、let、const在使用中的区别此文章非原创文章，是借鉴文章，转载请注意！！！<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script type="text/javascript"> //1.var 声明变量挂载在window上，let和
复制链接

扫一扫