开发者

Why does this array not return properly from a JavaScript "class"

I say "class" because classes don't technically exist in JS. But here is my simplified class

function clsDragStack(divWithin,divConstrain,arrOptions){
    var _divWithin,_divCont,_divOption,_arrOptions;
    var _sourceStack=[];    // array to hold jQuery items referencing remaining source items. initally ALL items will be in this array.
    var _selectStack=[];    // array to hold jQuery items referencing items the user has selected.

    //start constructor

    _divWithin=divWithin;
    _arrOptions=arrOptions;
    _divCont = $('div[ID^="divContainer"]',divWithin);
    _divOption = $('div[ID^="divOption"]',divWithin);;

    initDraggables(divConstrain);

    //end constructor

    function initDraggables(divConstrain){
        var divDraggables = $(".draggableBasic",_divCont);                              //get all the draggable divs
        divDraggables.each(function(i){_sourceStack.push($(this));});          //add all the children to sourcestack
    };

    clsDragStack.prototype.selected = function (){
        return _selectStack;
    };
};

This probably won't do anything useful in isolation but it shows the bits of interest. Basically I have a column on the left (represented in the class by _sourceStack) The user can drag items from here to another column (represented by _selectStack). This all works fine, the _sourceStack and _selectStack arrays get shuffled around quite happily. However, when I try to access the contents of _selectStack from outside 开发者_StackOverflowthe class using ...

        var arrFields=selectStack.selected();

... for example - I seem to always get the original stack ie empty. If I try to access _sourceStack in the same way I get the original full list, as though no items have been moved. I can see _sourceStack and _selectStack being modified as I move items around.

Do I need to make a duplicate of the array in selected() before passing that back? Why can't I seem to pass the reference to this object? I've done an experiment with simple string arrays and it works fine. Is it because these are arrays of jQuery objects?


All the code I have seen, defines prototype members outside of the function, e.g.:

function clsDragStack(divWithin,divConstrain,arrOptions){
     this._selectStack=[];
     //...
};

clsDragStack.prototype = {
    selected: function() {
        return this._selectStack;
    }

};

It should not matter what is contained in the array.

With your code, every time you create a new clsDragStack object, the prototype function selected is changed to return the _selectStack of the newest generated object. So every existing object will return the new (empty) array.


Ok. Here's how I did it. I replaced...

clsDragStack.prototype.selected = function (){
    return _selectStack;
};

with...

return {
    selected : function(){
        return _selectStack;
    }
};

..still within the main body of the class.

If anyone can explain to me what the hell is going on here I'd be very grateful! Especially what this return {name: function(){}}; structure is - and why in my original implementation it was returning the original array even though it had been modified??

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜