Use of call, apply, setcapture, and releasecapture in JS

Source: Internet
Author: User
  • Drag the page elements-setcapture and releasecapture in HTML

The setcapture function sends subsequent mouse events to this object. The releasecapture function returns the mouse event
Document, window, object and so on. This ensures that the drag process will not be disturbed by other elements. In addition, there is a heavy
The thing is, on Win32, the mouse
The move event is not continuous. That is to say, every time we move the 1px mouse pointer, A mousemove occurs. Windows periodically checks the mouse
To generate the mousemove event. Therefore, if it is a very small page object, such as a dot with a diameter of 5 PX, if there is no setcapture and
Releasecapture: After you press and hold the mouse, you can move the mouse quickly, but the dot is still in place because of the next mousemove.
It is no longer sent to this dot object.

  • Application of the call and apply functions in Javascript
We often encounter call and apply functions in Object-Oriented applications of javascipt; sometimes we get confused. In fact, they can change the value of this reserved word in a function or object; the default value of this reserved word is the class itself. Example:

<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Script language = "JavaScript">
Test = {
Value: 'default ',
Exec: function (){
Alert (this. value );
}
}
Function hhh (OBJ ){
Test.exe C ();
Test.exe C. Apply (OBJ );
}
</SCRIPT>
</Head>

<Body>
<Input type = "button" onclick = "hhh (this);" value = "test"/>
</Body>
</Html>

The above page will be quickly understood.

 

The call and apply functions can process anonymous functions.

The initialization applications of classes are as follows:

Person = function (){
This. init. Apply (this, arguments );
};
Person. Prototype = {
First: NULL,
Last: NULL,
Init: function (first, last ){
This. First = first;
This. Last = last;
},
Fullname: function (){
Return this. First + ''+ this. Last;
},
Fullnamereversed: function (){
Return this. Last + ',' + this. First;
}
};

VaR S = new person2 ('crees', 'yang ');
Alert (S. fullname ());
Alert (S. fullnamereversed ());

 

The call and apply functions can assign values to the function content (with anonymous parameters, but not trigger)

The Application of function binding events is as follows:

Function. Prototype. bindforevent = function (){
VaR _ m = This, object = arguments [0], argS = new array ();
For (VAR I = 1; I <arguments. length; I ++ ){
Args. Push (arguments [I]);
}
Return function (event ){
Return _ M. Apply (object, [(event | window. Event)]. Concat (ARGs ));
}
}

The call and apply functions apply the following parameters to function binding:

Function. Prototype. Bind = function (){
VaR _ m = This, object = arguments [0], argS = new array ();
For (VAR I = 1; I <arguments. length; I ++ ){
Args. Push (arguments [I]);
}
Return function (){
Return _ M. Apply (object, argS );
}
}

The call and apply functions are the same, that is, the parameter format is different; fun. Call (OBJ, arguments); arguments of apply is an array; and call is a singular form.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.