Javascript Function Parameters

Question

I am working on a project that includes the ExtJS library, and I came across this piece of code that makes no sense (but it works). Please, help: (.

TreePanel.on('click', showDocumentFromTree); function showDocumentFromTree(node) { if (TreePanel.getSelectionModel().isSelected(node)) { dataStore.baseParams = { node : node.id, limit : 10 } dataStore.load({ params : { start : 0 } }); } }; 

Thus, the function definition for the "showDocumentFromTree" parameter has a "node" parameter, but when the code calls it, it skips nothing. In addition, the "node" object is not global (as far as I know).

So, am I confused about how this works? Is this some kind of magic that javascript has?

Also, when I do console.debug to print "node", there are things in it. (console.debug for FireBug)

Thanks for your time, J

Answer 1

In this case, the showDocumentFromTree parameter is a magic parameter that is provided by the browser when the user clicks on the item to which the action is attached. In this case, the node will refer to the TreePanel . Javascript - This keyword explains in more detail about this mechanism. Most likely, the parameter name is used more often than node , as in your example.

Answer 2

When the code executes `TreePanel.on ('click', showDocumentFromTree) ', it does not call showDocumentFromTree, it passes the showDocumentFromTree function as an argument. Then it will be called later by the onclick event handler for which it is configured, and then its node argument will be passed.

Answer 3

The first line binds the showDocumentFromTree function to a click event. What is passed to TreePanel.on is a reference to the showDocumentFromTree function, not the call itself.

When the event fires, the associated function (s) will be called, with the initiating object being the first parameter. In this case, the DOM node button will be pressed.

To illustrate, the first line can be rewritten to:

 TreePanel.on('click', function(node) { showDocumentFromTree(node); }); 

OK, this may not be much clearer, but you can see that it actually passes the function as an argument to the on method, rather than calling the method itself.

Answer 4

TreePanel is a class / component in Extjs. In your first line:

TreePanel.on ('click', showDocumentFromTree);

You assign a click handler to the TreePanel class. Value, when TreePanel clicks, it will call your showDocumentFromTree function. Part of the Click event for the TreePanel must pass the triggered TreeNode or the element that "raised" the click event.

To find out how this functionality works, see the Ext.tree.TreeEventModel class, in particular, the initEvents , delegateClick and onNodeClick .

Answer 5

Repeating what other posters said about a browser providing function arguments, I would like to make a general remark about javaScript as a language. JavaScript, unlike languages ​​such as C ++ and Java, does NOT apply to parameters defined in a function signature. This means that you can have a function such as:

 function doSomething(myParam){ ... Does Some Stuff } 

Then call it in any way below:

 doSomething(); doSomething(foo); doSomething(foo, bar); doSomething(foo, bar, baz); 

etc..

If it is called without parameters defined in the signature, the missing parameters will be undefined. Additional parameters can only be accessed by the args array, which has all the functions.

I know this was not specific to your question, but I thought it might be useful for context and general interest.