JavaScript的作用域说明

最新推荐文章于 2022-05-17 21:22:45 发布

vincent先生

最新推荐文章于 2022-05-17 21:22:45 发布

阅读量290

点赞数

本文链接：https://blog.youkuaiyun.com/xiaopingzhan/article/details/76684632

版权

在javascript中，对象和函数都属于变量，那么，既然是变量，它就会有自己作用的区域，也就是我么所说的作用域。

变量定义在不同的地方，其作用的区域是不一样的。我们将其分为两大类，局部javascript变量和全局javascript变量。

局部javascript变量：在javascript函数内部声明变量的我们将其称之为局部变量，我们只能够在函数的内部访问它，也就是说该变量的作用范围只在函数中，在函数的外部是无法直接对它进行访问的。我们能够在不同的方法中使用相同的名称去命名一个局部变量而不会导致bug，因为它们各自的作用范围是不同的函数内部，不会相互影响。一旦函数执行完成后，这个局部变量就会被删除，不会影响函数的的其他函数。

全局javascript变量：在函数的外部声明的变量我们就将其称之为全局变量，定义了全局变量后，我们能够在所有的脚本和函数中对其进行访问。其作用的范围是网页的全部。

javascript变量的生命周期：

正如我们之前所说的，局部变量的作用域是在函数的内部，全局变量的作用域是在整个网页中。

局部变量的生命周期：在函数运行之后被删除

全局变量的生命周期：在网页关闭后被删除

下面举两个例子比较一下，说明局部变量的作用域只在函数内部。

<!DOCTYPE html>
<html>
<body>

<p>局部变量在声明的函数外不可以访问。</p>
<p id="demo1"></p>
<p id="demo2"></p>
<script>
myFunction();
document.getElementById("demo1").innerHTML = "carName1 的类型是：" +  typeof carName1;
function myFunction() 
{
	//声明两个局部变量，carName1和carName2.
	//访问这两个变量，carName1在函数外部访问，carName2在函数内部访问
    var carName1 = "本田";
	var carName2="丰田";
	document.getElementById("demo2").innerHTML = "carName2 的类型是：" +  typeof carName2;
}
</script>

</body>
</html>

结果：

全局变量案例：

<!DOCTYPE html>
<html>
<body>

<p>全局变量在任何脚本和函数内均可访问。</p>
<p id="demo"></p>
<script>
var carName = "Volvo";
myFunction();
function myFunction() 
{
    document.getElementById("demo").innerHTML =
		"我可以显示 " + carName;
}
</script>

</body>
</html>

结果：