Learning notes _javascript Tips for callback functions in JS

What is the callback function before learning really do not know how to use the JS callback function, the following article in my Learning callback function examples for you to introduce it, have to understand the students do not enter into the reference.

callback function Principle:

I'm leaving now, I'll let you know.
This is an asynchronous process, "I go" in the process (function execution), "You" can do anything, "to" (function completed) "Notify You" (callback) after the process

Example

1. Basic methods

<script language= "javascript" type= "Text/javascript" >
function dosomething (callback) {
//... 
Call the callback
callback (' Stuff ', ' goes ', ' here ');
} 
function foo (A, B, c) {
//I ' m The callback
alert (A + "" + B + "" + C);
} 
DoSomething (foo); 
</script>

Or in the form of an anonymous function

<script language= "javascript" type= "Text/javascript" >
 function dosomething (damsg, callback) {
  alert (damsg);
  if (typeof callback = = "function") 
  callback ();
 } 
DoSomething ("callback function", function () {
  alert ("As the callbacks form of JQuery!"); 
</script>

2. Advanced methods

The call method using JavaScript

<script language= "javascript" type= "Text/javascript" >
function Thing (name) {
this.name = name;
}
Thing.prototype.doSomething = function (callback) {
//Call we callback, but using our own instance as the context
   
    callback.call (this);
}
 
function foo () {
alert (this.name);
}
 
var t = new Thing (' Joe ');
T.dosomething (foo); Alerts "Joe" Via ' foo '
</script>

   

Pass parameters

<script language= "javascript" type= "Text/javascript" > 
function Thing (name) {
this.name = name;
}
Thing.prototype.doSomething = function (callback, salutation) {
//Call we callback, but using our own instance as the Context
Callback.call (this, salutation); 
function foo (salutation) {
alert (salutation + "" + THIS.name);
} 
var t = new Thing (' Joe ');
T.dosomething (foo, ' Hi '); Alerts "Hi Joe" via ' foo '
</script>

Apply pass parameters using JavaScript

<script language= "javascript" type= "Text/javascript" >
function Thing (name) {
this.name = name;
}
Thing.prototype.doSomething = function (callback) {
//Call we callback, but using our own instance as the context
   
    callback.apply (this, [' Hi ', 3, 2, 1]);
} 
function foo (salutation, three, two, one) {
alert (salutation + "" + THIS.name +] – "+ three +" "+ Two +" "+ One );
} 
var t = new Thing (' Joe ');
T.dosomething (foo); Alerts "Hi joe–3 2 1" via ' foo '
</script>


   

Example
If the provided data source is an integer, for a student's score, when the num<=0, is processed by the bottom, when n>0 is handled by the high-level.

Copy the following function and save it to 1.js

function f (num,callback) {
 if (num<0) { 
 alert ("Call low-level function processing!");
 Alert ("Score cannot be negative, input error!"); 
 } else if (num==0) {
  alert ("Call low-level function processing!");
 Alert ("The student may not have taken the exam!") ");
 } else{
 alert ("Call high-level function processing!");
 Callback ();
 }

Save the following test.html file with 1.js in a directory:

 <!
DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "Http://www.w3.org/TR/html4/loose.dtd" >  
 

The following are additional users:

Callback mode in javascript:

Shaped like:

function Writecode (callback) { 
   //execute some things, 
   callback (); 
   //... 
  } 
 
  function Intrducebugs () { 
   //.... Introduce vulnerability 
  } 
 

We pass the application of the function to Writecode (), allowing the Writecode to execute it at the appropriate time (call back later)

Let's look at a less-than-good example (refactoring it later):

Simulates the DOM node in the lookup page, and finds the node in the array. The unified return//This function is only used to find no logical processing of the DOM nodes var findnodes = function () {var i = 100000;//A large number of loops, 
   var nodes = [];//used to store the found Dom node Var found; 
    while (i) {i-=1; 
   Nodes.push (found); 
  return nodes; 
   //To hide all the DOM nodes found in the var hide = function (nodes) {var i = 0, max = nodes.length; 
for (; i<max;i++) {//findnodes followed by parentheses to execute immediately, execute Findnodes () and then execute hide () < Hide (Findnodes ()), execute function}; 
  Nodes[i].style.display= the above method is inefficient, so that hide () must iterate over the array node returned by Findnodes (), and how to avoid this redundant loop. 
  We cannot hide the queried nodes directly in the findnodes (so that the retrieval can modify the logic coupling), then he is no longer a universal function.  The workaround is to use the callback pattern to pass the node-hiding logic to findnodes () as a callback function and delegate it to execute//refactor Findnodes to accept a callback function var findnodes = Fucntion (callback) {var i 
    = 100000, nodes = [], found; 
    Check if the callback function can be invoked if (typeof callback!== ' function ') {callback = false; 
     while (i) {i = 1; 
     if (callback) {callback (found); 
    } nodes.push (found); 
  return nodes; }//callback function var hide = function (node) {node.style.display = ' none '; //Find the successor node and hide it in subsequent execution findnodes (hide);/execute findnodes and hide, of course the callback function can also be created when calling the main function: Findnodes (function (node) { Node.style.display = ' none ';};