javascript变量作用域之我见 - Javascript教程

最新推荐文章于 2025-04-29 14:37:32 发布

原创最新推荐文章于 2025-04-29 14:37:32 发布 · 393 阅读

CC 4.0 BY-SA版权

本文探讨了JavaScript中的变量作用域，包括全局与局部作用域，并通过示例代码深入讲解了函数内部变量的作用域范围，同时介绍了如何利用调试工具观察作用域链。

相信大家都知道，javascript中变量作用域只有两种，全局作用域与函数中的局部作用域（有人认为不同script节点间也存在一种作用域，称之为段作用域，理由是在后面的script的节点中定义的变量，在这个script节点没有被解析之前，前面的script节点是不能访问这个变量的，这种依赖于代码解析顺序的特殊情况，不在我们这篇文章的讨论之列）。

比如下面的代码：

a就是我们声明的全局变量，c就是我们声明的局部变量，b作为函数f的形参，也是一个局部变量。

我们再看下面的代码：

可以看到o和i都是局部变量，只不过o的作用域范围为函数outer的函数体，而i的作用域范围为inner的函数体。

我们再看一段代码：

  
  
  
       var o = 1;
  
  
       function inner(){
  
  
           var i = 1;
  
  
           debugger;
  
  
       }
  
  
       inner();
  
  
   }
  
  
   outer();

debugger?没错，就是debugger。呵呵，我们单独运行这段代码，打开浏览器的调试环境，比如ff浏览器的firebug

我们选择脚本这一项，然后查看debugger运行时的调用堆栈情况，可以看到，除了有inner，outer以外，还有一个scope1.html()这么一个函数，这个函数从何而来的？

我们再看如下代码：

可以看到，单独运行debugger的时候，firebug的调用堆栈只有一个scope1.html()这个函数被调用。

我们知道，此时是没有任何自定义的函数被调用的，那么这个函数从何而来的？我们不妨做如下大胆猜测，这是浏览器的js引擎自动生成的，我们所有的代码都运行在一个浏览器预先定义的一个函数里，而在这个函数里声明的变量，就是我们所谓的全局变量。

这样，我们就可以以一种一致的方式，去看待javascript代码：所有的代码都是以函数方式运行的，javascript的变量作用域只有一种，那就是函数的局部作用域。

以上言论纯属个人意见，有不同见解，欢迎拍砖。

ps：

1 关于scrope1.html()这个函数，在不同的调试环境下，命名可能不一样，比如ie下就是global script code,chrome下就是anonymous function。

2 推荐大家都运行一下上面的代码，查看一下函数运行时的调用堆栈以及变量的监控情况，对于理解javascript的作用域、作用域链、闭包等概念都有很大的帮助。

具体：http://www.verydemo.com/demo_c98_i79232.html