开发者

Prototypes and nested return functions, help!

Intro:


I know that "How does this code work?" type questions are frowned upon and I'll look about as clever as a brick reading "The Sun" for asking such a question but... here goes.

I am trying to understand prototyping in JavaScript, now this isn't the problem, I understand the basics of the prototyping structure in that you write a function and then extend that function's parameters through the use of the prototype.

(Yes before I get flames I HAVE read through the community wiki and posts on SO about this particular subject so don't just fob me off to them, as well as that I have gone through John Reisg's notes on the subject too which helped a great deal. (the most confusing aspect was understanding this and its DOM referencing methods.))

But here's the thing:


I wrote a simple API parser for the SO API that would pull a variety of data, chuffed with myself and my first venture into JS I posted a link up in the SO JS Chatroom to see if they thought this could be done more efficiently and @IvoWetzel suggested I change to a prototyped wrapper to create the API URL queries, so I looked into it and he posted this example code up base开发者_运维百科d on mine:

//API Handling for asynchronicity
function API(site, key, ...) {
    this.site = site;
    this.key = key;
    this.schedule = new Scheduler(this);
}

API.prototype = {
    lookup: function(resource, callback) {
        // build the url etc here
        this.request(url, callback);
    },

    request: function(url, callback) {
        // build a request here and send it
        request.on('finished', function() {
            callback();
        });
    }
};

function Scheduler(api) {
    return function(method, options, interval) {
        var id = null;
        function request() {
            api[method](options...);

            id = setTimeout(function() {
                request();

            }, interval);
        }

        return {
            stop: function(attribute) {
                clearTimeout(id);
            }
        }
    }
}

Obviously this is not finished and only a shell, but to be honest with you aside from the API function at the top I have NO clue how the code works, in particular the lookup:, request: and how a return function can be inside another with variables that aren't defined anywhere or even passed to it!

And the Scheduler function just has me plain old baffled...

Conclusion:


So, could someone explain in simple terms (think explaining why not to put a harmonica in a toilet to a 3 year old child) how the code above do the same as the code in my GitHub repo (lines 176-210, 243-245 and 277-365).

N.B: I am doing this as a JS learning exercise if you say use JQuery.parseJSON / libraryX.whatever I will scalp you :)

Thanks all!


Lets break it down into it's parts

//create function API which is meant to be instantiated into an object using 
///var foo = new API();
function API(site, key, ...) {
    this.site = site;
    this.key = key;
    this.schedule = new Scheduler(this);
}

//create two prototype functions on the API function called lookup & request
//these two functions will be available as public functions on all 
//instantiated API objects and can be called like this
//foo.lookup(resource, callback); / foo.request(url, callback);
API.prototype = {
    lookup: function(resource, callback) {
        // build the url etc here
        this.request(url, callback);
    },

    request: function(url, callback) {
        // build a request here and send it
        request.on('finished', function() {
            callback();
        });
    }
};
//define function Scheduler
function Scheduler(api) { 
    //when called, imidiately return a reference to an 
    //anonymous function that can be called later with 
    //the three arguments method, options & interval
    return function(method, options, interval) {
        // define a local variable id for this anonymous function
        var id = null;
        //create a private function inside the anonymous function call request
        function request() {
            //private function requests internals
            api[method](options...);

            id = setTimeout(function() {
                request();

            }, interval);
        }
        //when anonymous function is called return 
        //an object with a function called stop as property
        return {
            stop: function(attribute) {
                clearTimeout(id);
            }
        }
    }
}

In the end you'd do something like this:

var foo = new API();
var scheduler = foo.schedule('lookup', {some options object I presume}, some_interval);
scheduler.stop();


how a return function can be inside another with variables that aren't defined anywhere or even passed to it!

And the Scheduler function just has me plain old baffled...

  1. http://eloquentjavascript.net/chapter3.html
  2. How do JavaScript closures work?
0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜