从零开始学前端 - 18. JS作用域、作用域链和声明提前

最新推荐文章于 2023-01-17 11:28:03 发布

她不美却常驻我心

最新推荐文章于 2023-01-17 11:28:03 发布

阅读量461

点赞数 2

分类专栏：从零开始学前端 JS 文章标签： javascript css html typescript html5

本文链接：https://blog.csdn.net/qq_39506551/article/details/106819194

版权

本文详细介绍了JavaScript中的作用域，包括全局作用域、局部作用域和块级作用域，以及ES6中的let声明。此外，还讲解了作用域链的概念，帮助理解变量解析的过程。最后，探讨了JS中的声明提前和变量提升，解释了函数和变量声明的提升规则以及它们之间的区别。

摘要由CSDN通过智能技术生成

作者: 她不美却常驻我心
博客地址: https://blog.csdn.net/qq_39506551
微信公众号：老王的前端分享
每篇文章纯属个人经验观点，如有错误疏漏欢迎指正。转载请附带作者信息及出处。

从零开始学前端 - 18. JS作用域、作用域链和声明提前

一、JS作用域

ES5 中只有全局作用域和局部作用域，其中的局部作用域指的是函数作用域，在起初设计时，并没有加入块级作用域的概念。
ES6 中新增了一种声明方式 let ，它的用法类似于 var，但是它所声明的变量，只在 let 所在的代码块内有效，这就意味着通过使用 let 声明的时候，会形成了一个块级作用域。

1. 全局作用域

最外层函数定义的变量拥有全局作用域，即对任何内部函数来说，都是可以访问的：

var num = 1;
function fn(){
   
	console.log(num);
}
fn()	// 1

2. 局部作用域

与全局作用域相反，局部作用域只能在当前的代码块内使用，在代码块外部无法访问：

function fn(){
   
	var num = 1;
}
console.log(num);// ReferenceError: num is not defined

但如果我们在函数内部声明变量的时候不使用关键词 var ，实际上是相当于给全局对象 window 添加了一个属性，所有这个时候声明的变量是全局变量：

function fn(){
   
	num = 1;		// 相当于 window.num = 1;
}
fn();
console.log(num);		// 1

当一个作用域嵌套在另一个块或函数中，就产生了作用域嵌套，在当前作用域无法找到某变量时，向外层查找。

var a = 1;
function fn1() {
   
	var b = 2;
	function fn2() {
   
		var c = 3;
		console.log(a);		// 1
		console.log(b);		// 2
		console.log(c);		// 3
	}
	console.log