解决javascript 全局变量失效的问题

问题：

我在js文件中定义了一个全局变量：var a，在函数B()中给a赋值，然后在函数C（）中访问a结果发现a居然是undefined

找原因：

查了不少资料感觉和我的情况都不同，仔细分析了一下，发现了一些端倪：我的操作是这样的，我在A页面中加了iframe，iframe的地址是B，我在A页面中调用了B（）函数，然后又在B页面中调用了C（）函数。问题就出在这了，javascript的全局变量的作用范围实际上是只在当前页面起作用（仔细想一下也应是这样，要不然岂不是要乱套了），从这个意义上讲javascript的全局变量也谈不上是全局变量，它只在当前页面中起作用，我们要是把当前页面看做一个类的话，那我们就完全可以把这中全局变量看做为private的。

至此，问题原因就很简单了，我在A页面中访问的a变量和我在B页面中访问的a变量中访问的a变来那个并不是同一个变量，就好像是一个类里面的private变量，我在A实例中访问的和我在B实例中访问的并不是同一个变量是同样的道理。

解决：

原因找的了，问题也就好解决了，首先我是在A页面中调用的B（）函数，我只要在A页面中调用C（）函数，那么A、B函数访问的变量就是同一变量了，那我怎么才能在A页面中调用B（）函数呢，我要把B页面当中返回值作为参数传入B函数啊，呵呵，其实方法很简单了啊，只要这样就可以了：我在B页面中写了这么一句：window.parent.C(str)。

str为我要返回的值，好了我的问题就这么解决了，就好像是我在B实例中调用A实例的方法，然后传递参数一样，呵呵其实在C#真的很好理解，但在js中就难了点，其实我们可以这么理解，一个js文件就相当于一个类，我们在页面中引用这个文件时就相当于实例化了这个类，那么一切都好理解了。

我们写在js文件函数中的变量当然作用域就是这个函数，那我们写在js文件中的变量就相当于我们写在类中的变量，那么它的作用域就是这个类的实例。

补充：JavaScript中的坑--全局变量惹得祸

概述

身为一名程序员，因为bug周末加班是必不可少的事情，当解决bug的时候，总有些bug是因为规范导致的，但是这些bug往往不好找，也就是“前人挖坑，后人好踩”。前段时间，出现了一个很莫名其妙的bug

就是有个模块页面数据不对。当时找了半天（以为是页面传值的问题），到最后才发现 主页面引用的几个js文件中存在一个相同的全局变量。

对js中的变量作用域的误解

很多写js的都是需要前后台一起写的，我就是后台java,前台js分模块一起写的。在这里，我有一个误区，就是以为js和java中的语法是一样的。但实际上还是存在着一些不同的地方。比如js中作用域只是函数级别的

1：在{}体内定义的局部变量，和在{}体外定义的局部变量 实际上是一个，并不会新建

2：在函数体内定义的局部变量 ，和函数体外定义的没什么关系。

方便记忆的代码如下：

 <script>
  var test_id = "my love";
  if(true){
   console.log(test_id);
   var test_id = "where my love?";
   console.log(test_id);
  }
  console.log(test_id);
  </script>

显示结果：

这就是js中没有块级作用域的证明： 很显然发现test_id实际上只有一个

证明js中变量是函数级别的

 <script>
  var test_id = "my love";
  function findLove(){
   var test_id ;
   console.log(test_id);
   test_id = "is you?";
   console.log(test_id);
  }
  findLove();
  console.log(test_id);
  </script>

输出结果：

然后我试了一下： 在{}体内不用var声明：

<script>
  
 var a = "heh"
  if(true){
   console.log(a);
  }
  </script>

其实也是可以的 输出 heh

试一下 函数体内部用var ，注意一下：代码不同之处

<script>
  var a = "heh"
  function findLove(){
   console.log(a);
  }
  findLove();
  </script>

<script>
  var a = "heh"
  function findLove(){
   console.log(a);
   var a
  }
  findLove();
  </script>

第一个输出的是 heh ;第二个输出的是 undifined,一目了然。这个地方 还有一个细节：就是在函数体内，先定义后打印和先打印和定义，实际上是一样。

自我测试一下吧：（猜一下输出结果，在验证一下吧）

 <script>
  var a = "heh"
  function findLove(){
   console.log(a);
   function findforyou(){
   var a ="you";
   console.log(a);
   }
   function findother(){
   console.log(a)
   }
   findforyou();
   findother();
  }
  findLove();
  </script>

二：函数闭包

因为js中变量的作用域是函数级的，所以用闭包来解决一些传值问题（比如递归）。篇幅太长了，这次不介绍了。

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。如有错误或未考虑完全的地方，望不吝赐教。

最新评论