Home » JavaScript » 6.1 Javascript: events and callback function

6.1 Javascript: events and callback function


when a page is going to do something or do something, we call it an event. The event is the property that comes with the web page, such as click, MouseMove, load, etc.

A function that responds to an event is called an event handler, or event listener .


function, a A function is passed as a parameter to another function B, the callback function will be called A in function B (or executive). The essence of the callback function is a kind of mode, so the callback function is also called callback mode. Here, A is called a callback function < / p> function
Deep understanding

function is nothing more than a value, either returning a value, or a null value

So treat it as a data,


another way of declaring functions

The name of the
var showName=function (name) {// function is the variable name 
Alert (, Your, name, is, +name+, your, number, is, +outValue ());
// here, the function body outValue is the variable value
When // uses this expression, it is also called the digital face quantity
// when a function body appears without a name, it is called the function number


From this code, you can see that functions can manipulate
as if they were changed
To put it plainly, a function is just a value that refers to the variable

of the body of the function
Call and reference of function

calling function:

Var value=outValue (); //outValue () calls a function (also a function literal)

Reference function

Var value=showName; showName

/ / in fact, is a reference to a function body
Events, callbacks, and HTML attributes

callback function is most commonly used to handle event

Use the Html property to connect callback functions and events
<body onload= "showName ();" >
<img src=, "...", " onclick=", "showImage ()", />

onload is the property of the Html tag, which works by linking the showName () function to the onload event,

Onclick is the property of the Html tag, which works by linking the showImage () function to the onclick event,

Separating Html and Javascript code using function reference

uses the function reference to set the callback function


Onclick is the property of the window object, and showName references the function

When the onlick event is triggered, the function
pointed to by the showName reference is executed
These code can write code in Javascript so that Html is separated from Jvavascript code

Passing arguments through function literals

uses the function literal as a function reference, and then calls the corresponding callback function

from the number of functions
function helloName (name) 
/ / output "Hello WeAreZero" functions with parameters
Alert (, Hello, +name);
The window.onclick=function (EVT) // function literal function () is assigned to the onclick event as a function reference
"Here, the literal function function (EVT) (helloName) to complete the call
HelloName (, WeAreZero, );

here, the function literal is a function without a name, so it is also called anonymous function

The evt parameter passes the event object as a parameter to the event handler, but the evt parameter

is not used here

joins events with functions and separates Html code from Javascript code, which is not only beneficial to code visualization and maintenance, but also can make your Javascript skills better.