unable to understand these examples from the book javascript, The good parts

Question

I am reading javascript: The good parts by Douglas Crockford. I am having difficulty in understanding a particular example and the explanation that author provides.

example 1: (pg 38)

var quo=function (status) {
    return {
        get_status:function() {
           return status;
       }
    };
};

var myQuo=quo("amazed");
document.writeln(myQuo.get_status());

The explanation from book (I do not understand this. please explain this part):

This quo function is designed to be used without the new prefix, so the name is not capitalized.when we call quo, it returns a new object containing a get_status method. A reference to that object is stored in myQuo. The get_status method still has privileged access to quo's status property even though quo has already returned. get_status does not have access to a copy of the parameter. it has access to the paramter itself. This is possible because the function has access to the context in which it was created. This is called closure.

example 2(pg 39):

//make a function that assigns event handler function to array of nodes
//when you click on a node, an alert box will display the ordinal of the node

var add_the_handlers=function (nodes) {
    var helper=function(i) {
        return function(e) {
            alert(i);
        }
    };
    var i;
    for (i=0;i<nodes.length;i++) {
        nodes[i].onclick=helper(i);
    }
};

I am having difficultly to understand how this code works and moreover what function(e) does? why helper function return function that in turn return nothing. Its very confusing to me. if somebody can explain in simple language, it will be very helpful. Thanks a lot

EDIT:
According to the book is the bad example for the above(example 2):
  var add_the_handlers=function(nodes) {
    var i;
    for (i=0;i<nodes.length;i++) {
     nodes[i].onclick=function(e) {
     alert(i);
     };
   }
};

The author cites this as bad example because it always displays the number of nodes.

Answer 1

What he was implying in the example, I believe, was the fact that you don't have to make a copy of the status parameter and pass it to the get_status function because get_status implicitly gets access to everything enclosed within the context in which it was defined (in this case, quo)

Similarly, in example 2

Answer 2

why helper function return function that in turn return nothing.

In javascript, functions do not have to explicitly return a value. If a return value is ommitted, an implicit return undefined; is.

Furthermore, functions are objects. So, helper() is a javascript function, which returns a function:

function(e) {
   alert(i);
}

Later in the for loop, nodes[i].onclick=helper(i); this line executes the helper() function, which returns a function object, which is then assigned to the onclick handler for the node.

In the Bad Example, the author is illustrating a common problem that trips up novice javascript developers.

//According to the book is the bad example for the above(example 2):
 var add_the_handlers=function(nodes) {
  var i;
  for (i=0;i<nodes.length;i++) {
   nodes[i].onclick=function(e) {
   alert(i);
   };
 }

In this case, the novice programmer expects each node to display its index. However, because the onclick handler created a closure around i, the value of i is set to the value of the outer scope, which ends up being the value of i when the function is executed, instead of when the function is assigned as the novice programmer expects. So for each node that is clicked, it ends up printing the same number, which is nodes.length or the number of nodes in the array.

Per the comment:

further, can you explain what the e in funciton(e) does?

In the DOM Api, event handlers all pass in an event object that contains information about the event. So in this case, e is the click event object. And e is unused by this function, so it could have been omitted.