JS 变量提升和var以及let

xvzhengyang

于 2018-11-29 20:13:59 发布

阅读量250

点赞数

CC 4.0 BY-SA版权

分类专栏：前端 javascript 文章标签： js 变量提升

本文链接：https://blog.youkuaiyun.com/xvzhengyang/article/details/84639179

前端同时被 2 个专栏收录

80 篇文章

订阅专栏

javascript

22 篇文章

订阅专栏

本文深入探讨了JavaScript中的变量提升现象，对比了使用var与let声明变量的行为差异，揭示了let如何避免变量提升带来的陷阱。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>变量提升</title>
	</head>
	<body>
		<script type="text/javascript">
			// 使用var声明,会出现变量提升
			function foo() {
				var x = 'Hello, ' + y;
				console.log(x);
				var y = 'Bob';
			}
			foo();
			// 这里并不会报错,打印出来的数据是 hello,undefined;	// 因为js中会自动提升变量y的声明,但是不会提升变量y的赋值
			
			
			// 使用let
			function foo2() {
				let x = 'Hello, ' + y;
				console.log(x);
				let y = 'Bob';
			}
			//  使用let,会报错,y is not defined;
			
			
			// 另外,使用var声明变量,可以多次声明而不报错
			function foo3() {
				var x = 1;
				var x = 2;
				console.log(x);
			}
			foo3();
			// 使用let声明-这么做会报错,出现x has been declared	
			function foo5() {
				let x = 1;
				let x = 2;
				console.log(x);
			}
			foo5();
		</script>
	</body>
</html>