JavaScript中的声明提前与作用域理解-优快云博客

本文链接：https://blog.youkuaiyun.com/doubleguy/article/details/113063778

1.定义

声明提前：无论是变量还是函数的声明提前都是指他们会所有代码块执行之前就进行变量或者函数的声明

2.使用规则

预备知识 window：这里首先了解一下 window 这个东西，在js中window是一个全局对象。

生命周期：从你打开该网页的那一刻到你关闭该网页的最后一刻。

作用范围：整个script即整个js代码

window对我们理解生命提前有什么用：颠覆传统认知，比如可以不用var定义变量吗？如果不用var定义他会报错吗？

事实上，我们可以不用var定义变量，此时变量==wiindow.变量（但要赋初值，否则报错），函数也是同理。这里解释window是因为下面的声明提前会见到这种不用var就定义变量的写法。

比如如下写法是完全没问题的，输出5 6：

a=5;
console.log(a);
window.a=6;
console.log(a);

变量的声明提前

使用var关键字定义变量时，会在所有代码执行之前声明变量(但不会赋值)

但是如果没有使用var关键字定义变量，则没有该特性(不使用var也可以，默认为window.变量)

// 使用var时进行了声明提前，所以不会报错，但使用a时a还未赋值，所以结果为: a=undefined
console.log("a="+a);
var a = 5;
			
//因为没有声明提前，则会报没有定义就使用变量的错---Uncaught ReferenceError: a is not defined
//console.log("a="+a);
//a = 5;

函数的声明提前

使用函数声明形式创建的函数---function 函数名(){}，它会在所有代码执行之前创建，所以我们可以在函数声明前使用它

使用函数表达式--- var 变量 = function (){}; 创建的函数，不会被声明提前

//这种方法进行声明提前，所以不会报错，正常运行
fun1();
function fun1(){
}
			
//这种方法不会声明提前，所以报错---Uncaught TypeError: fun2 is not a function
// fun2();
// var fun2 = function (){
// }

完整代码为：（使用时去掉对应代码块的注释即可）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			/**
			 * 变量的声明提前
			 * - 使用var关键字定义变量时，会在所有代码执行之前声明变量(但不会赋值)
			 * 		但是如果没有使用var关键字定义变量，则没有该特性(不使用var也可以，默认为window.变量)
			 */
			
			// 使用var时进行了声明提前，所以不会报错，但使用a时a还未赋值，所以结果为: a=undefined
			// console.log("a="+a);
			// var a = 5;
			
			//因为没有声明提前，则会报没有定义就使用变量的错---Uncaught ReferenceError: a is not defined
			// console.log("a="+a);
			// a = 5;
			
			
			
			/**
			 * 函数的声明提前
			 * - 使用函数声明形式创建的函数function 函数名(){}
			 * 		它会在所有代码执行之前创建，所以我们可以在函数声明前使用它
			 * 	使用函数表达式 var 变量 = function (){}; 创建的函数，不会被声明提前
			 */
			
			//这种方法进行声明提前，所以不会报错，正常运行
			// fun1();
			// function fun1(){
			// }
			
			//这种方法不会声明提前，所以报错---Uncaught TypeError: fun2 is not a function
			// fun2();
			// var fun2 = function (){
			// }
		</script>
	</head>
	<body>
	</body>
</html>

这就是本文全部内容啦，很高兴你能看到这，你的访问是对我不断更新自己技术最大的支持~