1

I'd like to be able to store the addresses of a bunch of different variables in an array. This allows me to access the variables by name or iterate through them if I need to. Is this possible in JS?

(function(ns){

    ns.obj = new function(){

        var foo = "foo";
        var bar = "bar";

        //i really want this:
        //var ary = [&foo, &bar];
        var ary = [foo, bar];


        this.print = function() {
            console.log( foo );
            console.log( bar );
        }

        this.setFoo = function( newFoo ) {
            //i really want this:
            //*(ary[0]) = newFoo;
            ary[0] = newFoo;
        }

        this.printAry = function() {
            for( var i=0; i < ary.length; ++i ) {
                console.log( ary[i] );
            }
        }
    };

}(window.ns = window.ns || {}) );

ns.obj.print();
ns.obj.setFoo("newfoo!");
ns.obj.printAry();
ns.obj.print();

I looked at this:

JavaScript array of pointers like in C++

But I'd like to be able to use an element of ary on the LHS of an assignment and I don't think that example works in this situation.

WHY ON EARTH DO I WANT TO DO THIS?

A lot of comments so far have (rightfully) asked why I'd want to do this. I'm dealing with a proprietary API that involves an asynchronous object initialization mechanism. Basically I create an instance of an object and then pass it to this initializer to be able to actually use it. The initializer includes a field for an onSuccess handler to notify of successful initialization. My fully initialized object is passed as an argument into this success handler so that I can grab a reference to it.

I'm then free to initialize my next object. It looks kinda like this:

     var a = new api.ApiObject();
     var b = new api.ApiObject();
     var c = new api.ApiObject();
     var d = new api.ApiObject();

     //omg this is ugly
     api.initializeObject( {
         objToInit: a,
         onSuccess: function(args) {
             a = args.obj;
             api.initializeObject( {
                 objToInit: b,
                 onSuccess: function(args) {
                     b = args.obj;
                     api.initializeObject( {
                         objToInit: c,
                         onSuccess: function(args) {
                             c = args.obj;
                             api.initializeObject( {
                                 objToInit: d,
                                 onSuccess: function(args) {
                                     d = args.obj;
                                 }
                             } );
                         }
                     } );
                 }
             } );
        }
    } );

    a.doCoolStuff();
    //and so on

This deeply nested mess just gets worse as I add more api.ApiObjects(). So what do I do to fix this? I can't change the API, but maybe a recursive function could help:

    //maybe a recursive function could make this more concise?
    function doInitialize( ary ) {
        api.initializeObject( {
            objToInit: ary[0];
            onSuccess: function(args) {
                //i'd like to assign this passed in reference to my local
                //reference outside this function (var a, b, etc).  
                //An array of pointers would be useful here.
                //how else can I get this assigned out, cuz this doesn't work...
                ary[0] = args.obj;
                if( ary.length > 1 ) {
                    ary.splice( 0, 1 );
                    doInitialize( ary );
                }
            }
        }
    }

    doInitialize( [a,b,c,d] );

    //this won't work because I don't have a reference to the fully initialized object
    a.doCoolStuff();

So maybe the better question is: is there an established pattern to deal with asynchronous success chaining like this? I think I've seen other public JS frameworks (like dojo) use this sort of onSuccess chaining... how do I make this not ugly?

Improve this question
6
  • 1
    Why? What's the bigger problem you're trying to solve? Sure, there are possible workarounds, like storing an array of objects that you can mutate, but that's kind of kludgy and there are probably better ways to get to your end goal. Many high-level languages don't let you work directly with pointers but you really don't need to in the vast majority of cases. I'd put my money on this being one of those cases. Commented Mar 13, 2013 at 5:00
  • You certainly won't be able to access any real machine addresses or get performance improvements. Commented Mar 13, 2013 at 5:02
  • By default all variables are references in JavaScript, making what you want to do a non-issue out of the gate. If it's already a reference, putting it into yet another container won't speed things up. Commented Mar 13, 2013 at 5:21
  • My primary goal is convenience. Increased performance is not the intent at all. As @MattBall correctly surmised, there is a back story here. I'll try to clairfy in an edit. Commented Mar 13, 2013 at 5:28
  • so yes why not use just recursion ? Commented Mar 13, 2013 at 6:20

2 Answers 2

Reset to default
2

I might suggest that if your primary purpose for this is convenience as regards nesting of asynchronous callbacks, that you should consider a deferred/promise system.

I've written a couple of different promise libraries by hand.
jQuery comes with one built in (as do most "ajax libraries").

Here's what this might look like, in a better world:

doThingOne()
    .then(doThingTwo)
    .then(doThingThree)
    .then(launch);

Assuming that doThingOne returns a promise.

A more familiar looking interface for people who use jQuery (or most other promise-using large libraries), might look like this:

var imageLoader = $.Deferred(),
    loading     = imageLoader.promise();

loading
    .done(gallery.render.bind(gallery))
    .done(gallery.show.bind(gallery));

var img = new Image(),
    url = "...";

img.onload  = function () { imageLoader.resolve(img); };
img.onerror = function () { imageLoader.reject("error message"); };
img.src = url;

Very basically, the Deferred above will hold two private arrays (one for "success", one for "failure"), and will extend an interface which allows the async part of the application to "succeed" or "fail", and will pass in whatever is chosen to be data/a callback/etc.

It also extends a promise method, which returns a promise object, containing subscription functions for the two private arrays. So you pass the promise object around to interested parties, and they subscribe callbacks to be iterated through, on success/failure of the async operation (and passed anything which is passed to the .resolve/.reject method of the operation).

This might seem like an inversion or extension of just adding a custom-event/listener/etc... And it is.

The benefit of the abstraction is that the interface is cleaner.

Hiding this stuff inside of object interfaces, and just passing async promise-objects around can make your code look 100% synchronous:

var images  = ImageLoader(),
    gallery = ImageGallery(),
    photo;


photo = images.load("//url.com/image.png"); // assuming `.load` returns a promise object
gallery.show(photo); // just a promise object, but internally,
                     //`.show` would subscribe a private method to the promise object

And doing things like having three separate async operations, which can arrive in any order, but must all be successful before advancing, then you can have something like this (again jQuery, but doing it by hand is possible, too).

$.when(promise_obj_1, promise_obj_2, promise_obj_3)
.done(nextPhase);

nextPhase, of course, being a callback which you anticipate to be fired if all three promises are successfully completed.

I'd be happy to provide implementation details for a barebones promise system, if you're like me, and don't like using different libraries without first understanding how each piece works on its own, and being able to replicate its functionality, without copying code.

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

1 Comment

i really like the elegance of this solution. And though its a bit late in the game to use for my current application, I'd be interested in seeing a barebones implementation for the future. And yes, like you, I despise using giant libraries until I understand how each piece works on its own.
1

The answer to the first part of your question is to use an object. You're thinking in C which doesn't have iteratable structs so C programmers reach for arrays. In JS objects are iteratable. So you should write it as:

ary = { foo : 'foo', bar : 'bar' }

Or if we look at your second example:

var apis = {
    a : new api.ApiObject(),
    b : new api.ApiObject(),
    c : new api.ApiObject(),
    d : new api.ApiObject()
}

Now, as for the second part of your question. Your pseudo recursive code (pseudo because it's not really recursive in the stack sense since it's async) will now work with the apis object above. But you pass the keys instead of the object:

doInitialize( ['a','b','c','d'] );

Obviously, the bit above can be done dynamically by iterating through the apis object. Anyway, in the onSuccess part of the code you assign the result like this:

apis[ary[0]] = args.obj;

Oh, and obviously the objToInit should now be apis[ary[0]].

Now doing this should work as you expect:

apis.a.doCoolStuff();
Improve this answer

2 Comments

yep, this is basically what I'm looking for. I can use the string field names as "pointers" into this object. I had looked at using object iteration to solve this before but I find object iteration in JS kinda ugly and wasteful. for-in iterates over all fields of the object including the stuff in prototype. Sure, I can use hasOwnProperty() to avoid that stuff but the point is the for-in should only loop (in this case) 4 times. The extra cycles are wasted time. Anyway, thanks for looking at this!
You only need to do the hasOwnProperty thing if you do one of two things: you use inheritance or you (or third party code) modify the prototype of the Object object. Otherwise, plain vanilla javascript does not export anything via an empty object's prototype so hasOwnProperty is not necessary.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.