如何理解JavaScript中的变量作用域（）

在JavaScript中, 作用域有两种类型

全局作用域–作用域附加到窗口的最外层函数。
本地作用域–正在执行的函数内。

让我们看看下面的代码。我们在全局作用域的第一行定义了一个全局变量。然后, 我们在fun()函数内部定义了一个局部变量。

let globalLet = "This is a global variable" ; function fun() { let localLet = "This is a local variable" ; console.log(globalLet); // This is a global variable console.log(localLet); // This is a local variable } fun();

输出如下：

文章图片
当我们执行fun()函数时, 输出显示全局和局部变量都可以在函数内部访问, 因为我们可以进行console.log。这表明在函数内部, 我们可以访问全局变量(在函数外部声明)和局部变量(在函数内部声明)。让我们将console.log语句移到函数外, 然后在调用函数后将其放入。

let globalLet = "This is a global variable" ; function fun() { let localLet = "This is a local variable" ; } fun(); console.log(globalLet); // This is a global variable console.log(localLet); // localLet is not defined

输出如下：

文章图片
我们仍然能够看到全局变量的值, 但是对于局部变量console.log会引发错误。这是因为现在console.log语句存在于全局作用域中, 在这里它们可以访问全局变量但不能访问局部变量。
温馨提示：每当声明变量时, 请始终使用前缀let。如果你不使用let关键字, 则默认情况下会在全局作用域内创建变量。例如, 在上面的示例中, 我们只需要在声明localLet之前删除关键字let。

let globalLet = "This is a global variable" ; function fun() { localLet = "This is a local variable" ; }fun(); console.log(globalLet); // This is a global variable console.log(localLet); // This is a local variable

输出如下：

文章图片
现在, 我们还可以console.log本地变量, 因为localLet是在全局作用域内创建的, 因为我们在声明它时错过了关键字let。真正发生的是, 由于我们没有使用let关键字, 因此JavaScript首先在本地作用域内搜索了localLet, 然后在全局作用域内进行了搜索。由于没有该名称的现有全局变量, 因此它创建了一个新的全局变量。
访谈中最常见的问题之一是全局变量和局部变量具有相同名称的情况。让我们看看接下来会发生什么。

let globalLet = "This is a global variable" ; function fun() { let globalLet = "This is a local variable" ; } fun(); console.log(globalLet); // This is a global variable

输出如下：

文章图片
在此示例中, 我们声明了局部变量和全局变量" globalLet"。在这里重要的是我们访问它的作用域。在上面的示例中, 我们正在全局作用域内访问它, 因此它将输出全局变量, 因为其作用域中不存在局部变量。让我们将console.log语句移至fun()函数内部。

let globalLet = "This is a global variable" ; function fun() { let globalLet = "This is a local variable" ; console.log(globalLet); // This is a local variable } fun();

输出如下：

文章图片
在fun()函数内部, 可以访问局部变量和全局变量。但是, 当我们console.log变量globalLet时, JavaScript首先尝试在当前作用域中查找局部变量。它找到局部变量并将其输出。否则, 它将在外部作用域(在本例中为全局作用域)中搜索变量" globalLet"。
如果我们要访问全局变量而不是本地变量, 该怎么办。好吧, 窗户物体可以救救我们。所有全局变量都附加到窗口对象, 因此我们可以访问全局变量名称, 如下例所示。

let globalLet = "This is a global variable" ; function fun() { let globalLet = "This is a local variable" ; console.log(window.globalLet); // This is a global variable } fun();

输出如下：

文章图片
在讨论了JavaScript的作用域之后, 猜测以下代码片段的输出应该是轻而易举的事。

function fun(){ function fun2(){ i = 100; } fun2(); console.log(i); // 100 } fun();

输出如下：

文章图片

function fun(){ function fun2(){ let i = 100; } fun2(); console.log(i); // i is not defined } fun();

输出如下：

文章图片
在第一个示例中, 因为我们没有使用关键字let, 所以假设变量" i"在全局作用域内声明, 因此输出为100。在第二个示例中, " i"成为局部变量, 因此没有在该函数作用域之外可以访问。
让我们看另一个例子-

function fun(){ if ( true ){ let i = 100; } console.log(i); // i is not defined } fun();

输出如下：

文章图片
在ES2015之后, 我们开始使用let代替var来声明变量, 现在if块也被视为块作用域, 因此在上面的示例中, 我们得到一个错误而不是值100。如果将let更改为var, 将获得100的输出, 就好像先前不将块视为块作用域一样, 只有函数才被认为是块作用域。
关于作者：
" Harshit是一名技术爱好者, 并且对编程非常感兴趣。他拿着一个

B.技术Noida JIIT拥有计算机科学学位, 目前在SAP担任前端开发人员。他还是州级乒乓球运动员。除此之外, 他还喜欢看电影和英语情景喜剧来放松身心。他来自德里, 你可以在以下位置与他联系
https://in.linkedin.com/pub/harshit-jain/2a/129/bb5
【如何理解JavaScript中的变量作用域（）】如果你还希望在此处展示你的博客, 请参阅日志用于在lsbin上撰写访客博客。