zoukankan      html  css  js  c++  java
  • JavaScript中对象与函数的某些事[JavaScript语言精粹-N1]

    今天在读《JavaScript语言精粹》的时候,关于函数的一个部分,始终觉得有点难以理解,代码如下:

       1: var obj = (function(){
       2:     var value = 0;
       3:     
       4:     return {
       5:         increment:function(inc){
       6:             value += typeof inc == "number"?inc:1;
       7:         },
       8:         getValue:function(){
       9:             return value;
      10:         }
      11:     };
      12: }());

    注意代码最后的标黄色的一对括号,书中是这样描述的“我们并没有把一个函数赋值给obj,我们是把调用该函数后返回的结果赋值给它,该函数返回一个包含两个方面的对象,并且这些方法继续享有访问value变量的特权”。其实像这样代码,用的也比较多,只是从来没有仔细琢磨过,如果去掉了最后的一对括号,那么,返回的就是一个函数(对象)了。

    如果我们在代码中这样调用上面的obj,则可以直接使用,执行typeof obj 返回结果为”object”,如:

       1: obj.increment(1);
       2: alert(obj.getValue());//1
       3: obj.increment(2);
       4: alert(obj.getValue());//3

    如果去掉最后的一对括号,执行typeof obj 返回结果为“function”,需要使用先声明初始化的方式,才能使用这个对象,如:

       1: var o = obj();
       2: o.increment(1);
       3: alert(o.getValue());//1
       4: o.increment(2);
       5: alert(o.getValue());//3

    这样似乎理解了有没有那对括号的区别。但是作者后面举的Fibonacci例子,才让我恍然大悟,原来它还有这么个好的用处。即,函数可以将先前的操作结果记录在某个对象里,从而避免无谓的重复运算。

    我们通过普通的递归方式,计算Fibonacci数值,代码如下:

       1: var totalTimes = 0;
       2:  
       3: var fibonacci = function (n){
       4:     totalTimes +=1;
       5:     return n<2?n:fibonacci(n-1) + fibonacci(n-2);
       6: }
       7:  
       8: function calculateFibonacci(){
       9:     totalTimes = 0;
      10:     for(var i =0;i<11;i++){
      11:         document.getElementById("rlt").innerHTML +="//"+i+":"+fibonacci(i)+"<br/>";
      12:     }
      13:     document.getElementById("rlt").innerHTML+="//totalTimes:"+totalTimes+"<br/>";
      14: }

    连续执行两次,我们会看到如下的结果:

       1: //0:0
       2: //1:1
       3: //2:1
       4: //3:2
       5: //4:3
       6: //5:5
       7: //6:8
       8: //7:13
       9: //8:21
      10: //9:34
      11: //10:55
      12: //totalTimes:453
      13: //0:0
      14: //1:1
      15: //2:1
      16: //3:2
      17: //4:3
      18: //5:5
      19: //6:8
      20: //7:13
      21: //8:21
      22: //9:34
      23: //10:55
      24: //totalTimes:453

    是的,两次都是执行了453次。因为每次都要重新从0,1开始计算。

    但是,如果我们使用了如下代码(注意它最后的一对括号):

       1: var totalTimes = 0;
       2: var fibonacciMemo = function(){
       3:     var meno = [0,1];
       4:     var fib = function(n){
       5:         totalTimes +=1;
       6:         var result = meno[n];
       7:         if(typeof result != "number"){
       8:             result = fib(n-1) + fib(n-2);
       9:             meno[n] = result;
      10:         }
      11:         return result;
      12:         
      13:     };
      14:     return fib;
      15: }();
      16:  
      17: function calculateFibonacciEx()
      18: {
      19:     totalTimes = 0;
      20:     for(var i =0;i<11;i++){
      21:         document.getElementById("rlt").innerHTML +="//"+i+":"+fibonacciMemo(i)+"<br/>";
      22:     }
      23:     document.getElementById("rlt").innerHTML+="//totalTimes:"+totalTimes+"<br/>";
      24: }

    连续执行两次,我们看到的结果却是这样:

       1: //0:0
       2: //1:1
       3: //2:1
       4: //3:2
       5: //4:3
       6: //5:5
       7: //6:8
       8: //7:13
       9: //8:21
      10: //9:34
      11: //10:55
      12: //totalTimes:29
      13: //0:0
      14: //1:1
      15: //2:1
      16: //3:2
      17: //4:3
      18: //5:5
      19: //6:8
      20: //7:13
      21: //8:21
      22: //9:34
      23: //10:55
      24: //totalTimes:11

    是的,第一次执行了29次计算,第二次只执行了11次计算。原因在于我们把结果保存在了meno这个数组中。

    当然,我们也可以通过其它方式,如全局变量的形式,将结果保存下来,但是全局变量正是作者极力反对的应用和存储模式之一,而且这个计算结果的保存,本来就是对外透明的,调用它的人需要的只是计算结果,并不需要知道其中如何保存,或者说我们并不需要这个计算函数以外的其它任何(全局)变量,或者任何后来维护这段代码的人,不需要被告知在其它不知道的地方,有计算的中间结果需要他来做多余的维护工作!

    当然,我们也可以不用去省掉那400多次计算,不用关心程序的效率,或者不用担心用户的浏览器有多慢!

    其实到现在也没有相通,它们之间用处的区别或是优缺点在哪儿,因为始终没想明白说这件事的Point在哪儿,所以,博文的标题总觉得没说清楚哈!希望大家给予指点!

  • 相关阅读:
    《极客时间--算法面试》--二叉树
    《极客时间--算法面试》-哈希表
    《极客时间-算法面试》-堆栈和队列
    《极客时间-算法面试》-数组和链表
    《极客时间-算法面试》
    《极客时间-算法面试》如何计算复杂度
    查找算法
    排序算法
    AI 期刊会议
    《剑指offer》数组中只出现一次的数字
  • 原文地址:https://www.cnblogs.com/RitchieChen/p/3610701.html
Copyright © 2011-2022 走看看