自动执行函数与对象的闭包

Question

我们说我有以下内容:

var foo = (function(){
    var bar = 0;
    return {
       getBar: function(){
           return bar;
       },
       addOne: function(){
           bar++;
       },
       addRandom: function(rand){
           bar += rand;
       }
    }
})();

我有以下内容:

var foo2 = function(){
    var bar = 0;
    this.getBar = function(){
           return bar;
       };
    this.addOne = function(){
           bar++;
       };
    this.addRandom = function(rand){
           bar += rand;
       }
};

执行函数a的唯一区别是new什么？

alert(foo.getBar()); //0
foo.addOne();
foo.addRandom(32);
alert(foo.getBar()); //33

var foo2_obj = new foo2;
alert(foo2_obj.getBar());//0
foo2_obj.addOne();
foo2_obj.addRandom(32);
alert(foo2_obj.getBar());//33

他们两个都完全相同.

那么长远来看有什么区别？

一个人可以做什么,另一个不能？

以上小提琴演示:http://jsfiddle.net/maniator/YtBpe/

Answer 1

在第一个中,您只能创建一次对象,而在第二个中,您可以根据需要创建任意数量的对象.IE第一个实际上是一个单身人士.

请注意,第二个闭包不适合.每次实例化它都会重新创建函数并浪费大量内存.原型对象旨在解决这个问题,您可以在函数范围之外创建函数,并且不会创建意外的闭包.

function foo2(){
    this._bar = 0;
}

foo2.prototype = {

    constructor: foo2,

    getBar: function(){
        return this._bar;
    },

    addOne: function(){
        this._bar++;
    },

    addRandom:function(rand){
        this._bar += rand;
    }

};

然后:

var a = new foo2, b = new foo2, c = new foo2;

创建三个具有自己_bar但共享相同功能的实例.

jsperf

您可以将所有这些与"PHP"进行"比较",某些代码甚至不会运行,但原则上它"等效":

var foo = (function(){
    var bar = 0;
    return {
       getBar: function(){
           return bar;
       },
       addOne: function(){
           bar++;
       },
       addRandom: function(rand){
           bar += rand;
       }
    }
})();

与PHP大致"等效":

$foo = new stdClass;

$foo->bar = 0;

$foo->getBar = function(){
    return $this->bar;
};

$foo->addOne = function(){
    $this->bar++;
}

$foo->addRandom = function($rand){
    $this->bar += $rand;
}

var foo2 = function(){
    var bar = 0;
    this.getBar = function(){
        return bar;
    };
    this.addOne = function(){
        bar++;
    };
    this.addRandom = function(rand){
        bar += rand;
    }
};

与PHP大致"等效":

Class foo2 {


    public function __construct(){
    $bar = 0;

        $this->getBar = function(){
            return $bar;
        };
        $this->addOne = function(){
            $bar++;
        };
        $this->addRandom = function($rand){
            $bar += rand;
        };


    }

}

function foo2(){
    this._bar = 0;
}

foo2.prototype = {

    constructor: foo2,

    getBar: function(){
        return this._bar;
    },

    addOne: function(){
        this._bar++;
    },

    addRandom:function(rand){
        this._bar += rand;
    }

};

与PHP大致"等效":

Class foo2 {

    public $_bar;

    public function __construct(){
        $this->_bar = 0;    
    }

    public function getBar(){
        return $this->_bar;    
    }

    public function addOne(){
        $this->_bar++
    }

    public function addRandom($rand){
        $this->_bar += $rand;
    }

}

......并且是上面三个例子中唯一接近OOP的人

Answer 2

唯一的区别是这foo将是一个泛型Object，而在检查其类型时foo2_obj将识别为 a foo2（即，foo2_obj.constructor == foo2将是true，而等效的foo是foo.constructor == Object）。

当然，fooand之间有一个重要的区别foo2-foo是一个对象，而 whilefoo2是一个函数（用作构造函数）。因此，制作尽可能多的实例foo2（其中foo2_obj一个）是微不足道的，而创建“实例”的想法foo并没有真正意义 - 你能做的最好的是复制（这比调用构造函数更困难）。

由于复制/创建实例的区别，第二种方法允许使用原型链进行真正的 OO 编程，而第一种方法使这些事情变得更加困难（并且不明智）。