Шаблон модуля с конструктором - PullRequest
Новая
       22

Шаблон модуля с конструктором

2 голосов
/ 26 марта 2012

Я пытался объединить шаблон модуля с функцией конструктора, но мне кажется, что я что-то просматривал. После создания двух объектов и показа их свойств оба экземпляра var, похоже, ссылаются на один и тот же объект.

Это небольшой пример, который я собрал. 

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">     
        <title>test</title>

        <script type="text/javascript">
            var guidUtils = {
                /* Generates a simple UUID/GUID based on some randomisation.
                 *
                 */
                guidGenerator:function () {
                    var S4 = function () {
                        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
                    };
                    return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
                }
            };


            var Car = (function () {

                // private variables and functions
                var thiz;
                var ID = 'bar';
                var model;

                var setID = function(id){
                    ID = id;
                };

                var getID = function(){
                    return ID;
                };

                var  setModel = function(pModel){
                    model = pModel;
                };

                var  getModel = function(){
                    return model;
                };

                // constructor
                var Car = function (pModel) {
                    thiz=this;
                    ID = guidUtils.guidGenerator();
                    model = pModel;
                    init();
                };

                //intialisation
                function init(){

                }

                // prototype
                Car.prototype = {
                    constructor: Car,
                    getID: getID,
                    getModel: getModel

                };

                // return Car
                return Car;
            })();

            function show() {
                var car1 = new Car("audi");
                var car2 = new Car("BMW");
                var car1div = document.getElementById("car1");
                var car2div = document.getElementById("car2");
                car1div.innerHTML=car1.getID()+" is a "+car1.getModel();
                car2div.innerHTML=car2.getID()+" is a "+car2.getModel();
            }

        </script>       
    </head
    <body>
        <a onclick="show()" href="javascript:void(0);">show</a>
        <div id="car1"></div>
        <div id="car2"></div>
    </body>
</html>

Результат:

screenshot of result

Могут ли некоторые объяснить, где именно я делаю неправильные предположения?

1 Ответ

3 голосов
/ 26 марта 2012 
 var thiz;
 etc... 
    // constructor
    var Car = function (pModel) {
        thiz=this;
        etc...

это проблема.Это создает своего рода статическую переменную, общую для всех экземпляров класса.Все методы и свойства экземпляра должны быть связаны с прототипом и this.Например: 

    var Car = function (pModel) {
        this.ID = guidUtils.guidGenerator();
        this.model = pModel;
        this.init();
    };

    // Removed: "var setID = " Instead, bind it to the prototype:
    Car.prototype.setId = function(id){
        this.ID = id;
    };

См. Также:

...