JavaScript Objects

Question

I want to create several objects that are local to a specific function, but I want another function to act as a helper. The purpose of the helper function is to reduce the amount of duplicate code (there will eventually be many objects created as the script progresses).

I 'boiled down' my script, made sure it works, and then copy/pasted it below. The function named 'foo' works (there is an php file not shown for the jQuery/ajax call). However, I want the ajax call to be in the getNode function (the helper function) and preferably the setting of a temporary object also in getNode. My thinking is that a temporary object could be passed to foo from getNode.

<script type="text/javascript"> 
    function Node() {
        this.nodeId;
        this.type;  //can be used for diferent shapes, color cobinations, etc.
        this.text;
    }

    function getNode(id){
        $.post("updateDB.php", send, function(theResponse){ 
            var responseArray = theResponse.split(',');
            ....?
    }

    function foo(id){
        var centerNode = new Node();
        var send = 'id=' + id + '&action=getNode';
        $.post("updateDB.php", send, function(theResponse){ 
            var responseArray = theResponse.split(',');
            centerNode.nodeId = responseArray[0];
            centerNode.type = responseArray[1];
            centerNode.text = responseArray[2];         
            alert('nodeId' + centerNode.nodeId);
            alert('node type' + centerNode.type);
            alert('node text' + centerNode.text);
        });                 
    }
</script>
</head>
<body>
 <a onclick="foo(5)">test</a>
</body>

Chris · Accepted Answer · 2011-05-28 01:33:19Z

1

One way would be to provide a callback to getNode:

function getNode(id, callback){
    $.post("updateDB.php", send, function(theResponse){ 
        var responseArray = theResponse.split(',');
        var node = new Node();
        node.nodeId = responseArray[0];
        node.type = responseArray[1];
        node.text = responseArray[2];         
        callback(node);
    });
}

EDIT: "How would foo be setup?"

So in the example, foo is to respond to the click event by getting the node object and then alerting it's data. That is my understanding. If getNode were defined as above:

function foo(id) {
  getNode(id, function(node) {
    alert('nodeId' + node.nodeId);
    alert('node type' + node.type);
    alert('node text' + node.text);
  }
});

edited May 28, 2011 at 1:33

answered May 27, 2011 at 23:59

Chris

1,7532 gold badges12 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

John R Over a year ago

Thanks Chris. I'm fairly new to JavaScript and so I was just Googling 'callbacks' to see how I could use this. How would 'foo' need to be set up?

Chris Over a year ago

callbacks are the awesome/terrible feature of javascript. In fact you need them, because the language is asynchronous. In your original example at the time you call foo, there is no theResponse data. That has yet to be populated by the ajax post callback. In my version of the getNode function I'm chaining the ajax callback into the foo callback. It's kind of hard to describe, so I hope that's clear.

Jonathon · Accepted Answer · 2011-05-28 00:59:38Z

Well boiling your question down to the essentials (I want local variables to be available in separate functions):

You can pass the objects to the helper function.
You can create a class and put both functions in it and make the function locals global to the class.

These are the only ways I can think of at the moment.

JS Classes example:

function ClassName(vars){
    //This is used to init the class and is called when you use var myClass = new ClassName();
    //example: this.varName = this.functionName();
    //Instead of using prototype (will see latter in this example) you could just define the function/vars in here like (which would make them private to this class):
    //this.functionName = function(vars){};
}

ClassName.prototype.functionName = function(vars){}  //Out hear makes these var/functions publicly accessible
ClassName.prototype.varName = 5;

And then to use it:

var myClass = new ClassName(vars);
myClass.functionName(vars);

So put your local variables and your helper function inside the constructor to make them private and your other function as a prototype to make it publicly accessible.

Collectives™ on Stack Overflow

JavaScript Objects

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related