JavaScript权威设计--命名空间，函数，闭包(简要学习笔记十二)

1.作为命名空间的函数

有时候我们需要声明很多变量。这样的变量会污染全局变量并且可能与别人声明的变量产生冲突。

这时。解决办法是将代码放入一个函数中，然后调用这个函数。这样全局变量就变成了

局部变量。

如：

function my(){
    
}
my();    //别忘记调用

这段代码定义了一个单独的全局变量：名叫"my"的函数。

我们还可以这么写，定义一个匿名函数：

(function(){       //这里第一个左括号是必须的，如果不写，JavaScript解析器会将
                           //function解析成函数声明语句，使用的话解析成函数定义表达式
 
}())    //这里的()的作用是，函数定义完毕后立即调用它。

2.闭包

理解一（某书）：

函数的执行依赖于变量作用域。为了实现这种词法作用域，必须引用当前的作用域链。

函数对象可以通过作用域链相互关联起来，函数体内部的变量都可以保存在函数作用域内，

这种特性在计算机科学中称为“闭包”。

从技术角度上讲，所有的JavaScript函数都是闭包：他们都是对象，他们都关联到作用域链。

调用函数时闭包所指向的作用域链和定义函数时的作用域链不是同一个作用域链时，事情就变得非常微妙。

理解二（某书）：

闭包是指有权访问另一个函数作用域中的变量的函数。

创建闭包的常见方式：就是在一个函数内部创建另一个函数。

这里照搬书上的解释：

函数被调用的时候会发生什么？

当函数被调用的时候，会创建一个执行环境和作用域链然后使用参数来初始化函数的活动对象。在作用域链中，外部函数的活动对象始终处于第二位。

一般来讲，当函数执行完毕后，局部活动对象(我理解为局部变量)就会被销毁，内存中仅保存全局作用域(全局执行环境的变量对象)。

作用域链的作用是保证对执行环境的所有变量和函数的访问。

但是在闭包中情况则不同！

内部函数会将外部函数的活动对象添加到它的作用域链中。在匿名函数从外部函数被返回后，它的作用域链被初始化为包含外部函数的活动对象和全局变量的对象。

这样匿名函数就可访问外部函数中定义的所有变量。当外部函数执行完毕后，其活动对象也不会被销毁。因为匿名函数的作用域链仍然在引用这个活动对象。也就是外部函数的作用域链会被销毁，但是他的活动对象仍然会留在内存中。直到匿名函数被销毁后，外部函数的活动对象才会被销毁。

(闭包这玩意儿有点麻烦- -，这里不敢举例子来混乱大家的思维，即使是这书上的例子我觉得也不怎么能很好的解释闭包，大家可以查查资料，有自己的理解)

2015-10-21 20:01:52 start (对闭包的进一步的个人理解)

闭包指的是一个函数可以访问另外一个函数作用域中的变量。

下面是猜想：

function a(){
　　var a1=2;
}
function b(){
　　var b1=3;
}

按照上面的定义理解就是：怎么才能让a()函数去访问b()函数中的变量b1?

继续猜想：

我们想到：只要把a()函数放在b()函数中不就可以了么？

实现的原理：a()函数会将b()函数的活动对象添加到它的作用域中。所以a()函数的作用域链包括b()函数的作用域链。

do it!

function b(){
　　var b1=3;
　　function a(){
　　　　var a1=2;
　　　　alert(b1);
　　}
　　a();
}
b();　　//结果=>3

这样就实现了？然并卵啊！闭包的现实意义在哪？当然“真正”有意义的闭包并不是这样。

闭包的作用：外部函数可以读取函数内部的变量。

　　　　　　另一个就是让这些变量的值始终保持在内存中。

现在我们来说明第一个：外部函数可以读取函数内部的变量。

<1>如果我们都像上面那样写a()函数，那a()函数的作用是不是太狭窄了点，当访问一个内部变量结束后就没用了。是不是有点浪费，如果能在全局对象中去访问一个函数中的内部变量岂不是更酷？！

于是我们可以这样写：

function b(){
    var b1=3;
    return function (z){
        var a1=2;
        return alert(b1+z);
    }
}
var a=b();
a(2);    //=>5

这样我们就在全局作用域中调用了b1这个内部变量。(个人理解，如果有误还请指教。)

匿名函数被返回后，它的作用域链被初始化为包含b()函数的活动对象和全局变量对象。这样匿名函数就可以访问b()中的所有变量。

现在我们来说明第二个：变量的值始终保持在内存中。

<2>在上面例子中。在b()函数执行完毕后，其活动对象不会被销毁！因为匿名函数的作用域链仍然在引用这个活动对象。换句话说，当b()函数返回后，其执行环境中的作用域链会被销毁，但它的活动对象仍然留在内存中。直到匿名函数被销毁，b()函数的活动对象才会被销毁。

必须这样显示的指定：

a=null;

以便释放内存。

2015-10-21 20:55:52 end

3.闭包与变量:

作用域链的这种配置机制引出一个值得注意的副作用，即闭包只能取得包含函数中任何变量的最后一个值。闭包保存的是整个变量对象，而不是某个特殊的变量。

function ca(){
var arry=[];

for(var i=0;i<10;i++){
arry[i]=function(){
return i;
        }
    }
return arry;
}

上面这个例子，与我们想要的结果不一样。每个都是返回10。因为每个函数的作用域链中都保存着擦ca()函数的活动对象，所以他们引用的都是同一个函数变量i。

当ca()返回后，变量i的值都是10。这时我们可以通过创建另一个匿名函数强制让闭包的行为符合预期。

尝试解决一下：

function ca(){
    var arry=[];
    for(var i=0;i<10;i++){
     arry[i]=function(num){
          return function(){
                return num;
           }
      }
   }
   return console.log(arry);
}
ca();

上面强制闭包错误！返回的都是function(num){}。

下面提供正确的方式：

//第一种方式
function ca(){
    var arry=[];
    for(var i=0;i<10;i++){
         arry[i]=(function(i){
            return i;
          })(i);
    }
    return console.log(arry[5]);;
   }
ca();
//->5

//第二种方式
function ca(){
     var arry=[];
     for(var i=0;i<10;i++){
          arry[i]=function(){
          var n=i;
          return n;
          }();
      }
      return console.log(arry[8]);
}
ca();
//->5

我们没有直接把闭包函数赋值给数组，而是定义了一个匿名函数，并将立即执行该匿名函数的结果赋值给数组。

这两种方式都能得到自己想要的结果。

这里在举个实际中的例子：

<!doctype html>
<title></title>
<meta charset="utf-8"/>
<script type="text/javascript">
  window.onload = function(){

    //方法一
    var lists = document.getElementsByTagName("li");
    for(var i=0,l=lists.length; i < l; i++){
        lists[i].onclick=(function(i){// 强制闭包   
            return function(){
                alert(i)
            }
        })(i)
    }

　　//方法二
    var lists = document.getElementsByTagName("li");
    for(var i=0,l=lists.length; i < l; i++){
        lists[i].onclick=function(){
            var n=i;
            return function(){
                alert(n)
            }
        }()
    }
　　
  }
</script>
<ul>
  <li id="a1">aa</li>
  <li id="a2">aa</li>
  <li id="a3">aa</li>
</ul>

4.Fuction()构造函数

函数可以通过function()构造函数来定义：

var f=new Fuction("x","y","return x*y;");
//->等价于
var f=function(x,y){
    return x*y
}

5.constructor属性

每个JavaScript函数都自动拥有一个prototype属性。这个属性的值是一个对象，这个对象包含唯一一个不可枚举属性constructor。constructor属性的值是一个函数对象。

先看代码：

var F=function(){}    //这是一个函数对象
var p=F.prototype;    //这是F相关联的原型对象
var c=p.constructor;    //true
c===F    //对于任意函数F.prototype.constructor==F

可以看到构造函数的原型中预先定义好的constructor属性，这意味着对象通常继承的constructor均指代他们的构造函数。由于构造函数是类的"公共标识"因此这个constructor属性为对象提供了类。

var o=new F();    //创建类F的一个对象
o.constructor===F    //true，constructor属性指代这个类

6.多catch从句

在JavaScript 1.5中，try/catch可以使用多catch从句

如：

try{
    //这里肯呢个会抛出多种类型异常
    throw    1;
}
catch(e if e instanceof ReferenceError){
    //这里处理引用错误
}
catch(e if e==="quit"){
    //这里处理抛出的字符串是"quit"的情况
}
catch(e if typeof e==="string"){
    //处理其他字符串的情况
}
catch(e){
    //处理剩下的异常
}
finally{
    //finally从句正常执行
}

--Log----------------------------------------------------------------------------------------------

2015-10-21 添加操作闭包

posted on 2015-09-20 20:42 qize 阅读(1611) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

JavaScript权威设计--命名空间，函数，闭包(简要学习笔记十二)

导航

公告