How long does this JS Code save you?

Source: Internet
Author: User

1. application case:

         VaR Mouse = Function (){
// Look! No that = this!
This . Position = [0, 0];
If (Document. addeventlistener ){
Document. addeventlistener ('mousemove ',?); // This. Move?
} Else If (Document. attachevent ){
Document. attachevent ("onmousemove ",?); // This. Move? How to put it in
}

};
Mouse. Prototype. Move = Function (Arg1, arg2, event ){
Event = Window. Event | event;
VaR X = event. pagex | event. offsetx,
Y = event. Pagey | event. offsety;
This . Position = position = [x, y];
This . Log (arg1, arg2 );
};
Mouse. Prototype. log =Function (Arg1, arg2 ){
Console. Log (arg1 + "," + arg2 );
Console. Log ( This . Position );
};
New Mouse ();

You know above '? What are you doing there? I want to bind my move METHOD TO THE mousemove of the document, but it is difficult. In this case, mouse. Prototype. Move

This in will not point to the mouse object. I believe you often encounter this problem. Maybe you knew how to solve it, but is there a faster and simpler way? The answer is:

Function. Prototype. BIND () is a magic thing, but IE6 7 8 does not support it. Generally, modern browsers support it. What we need to do next is to imitate it,

Of course, we need to imitate such a good method. For how to imitate it, see the original method of nothing below.

( Function (){
VaR Proxy =Function (FN, target ){
VaR Proxy = Function (){
If (2 <arguments. Length) {// when the proxy function has Parameters
VaR Privateargs = array. Prototype. Slice. Call (arguments, 2 );
// Get it from the second one, [This, bound object, parameter list]
Return Function (){
VaR ARGs = array. Prototype. Slice. Call (arguments );
--> Here, the arguments is not the same as the outside. This is the arguments object inside the function to be proxy,
For example, the arguments [0] = [object event] of the move function is the E parameter in the event.

Array. Prototype. unshift. Apply (ARGs, privateargs );

--> The uploaded parameters are added here, and the parameter format is the same as that of native bind.
//-> And put private parameters in the front, such as a = new mouse (); A. Move );
// If this move method does not have a parameter, it means prototype. Move = FN () {arguments },
// The input parameter, arguments. Length = 3,
// Arguments [0] = 1, arguments [1] = 2, arguments [2] = [object event].

Return FN. Apply (target, argS );
}
// The reason for this complexity is that the proxy function can directly access arguments. For example, I directly use it instead of passing parameters to the proxy function.
// This arguments will contain the same object as the arguments of native function. Prototype. Bind,
// Here Code Esoteric, because you don't understand what arguments are in the native bind here. If you know it, you will know why I bound my own arguments.
// The main purpose of doing so much is to make the arguments in the function you are proxy to be consistent with the arguments object in function. Prototype. Bind.
}

Return Function (){
Return FN. Apply (target, arguments );
}
}
Return Proxy. Apply ( Null , Arguments );
};
/* Supports native use of native */
Function. Prototype. Bind = function. Prototype. Bind |
Function (Target ){ // This indicates the function to be proxy.
If (1 <arguments. Length ){
VaR ARGs = array. Prototype. Slice. Call (arguments, 1 ); // Retrieve the parameter list
Args. unshift ( This , Target ); // This ARGs eventually becomes [This, bound object, parameter list]
Return Proxy. Apply ( Null , ArgS );

-- If you directly use proxy (ARGs), The args becomes a parameter of the proxy function and an error is reported,
In fact, this mainly involves separate task processing. The proxy only cares about how the proxy and the parameters are passed to the proxy. If the proxy has no parameters, it will directly;
Return proxy (this, target) --> return fn. Apply (target, arguments); the answer on the 17th floor.
--> It is estimated that everyone will make the same mistake as the 17th floor. The reason for this complicated operation of the arguments object is to ensure that the arguments object is passed into the proxy function and that it is not invalid.
}
Return Proxy ( This , Target );
};
})();

Why does the above Code always return back to the proxy, because in this way you can call this. Move. BIND (this,) () and then the function will be executed immediately!

With the above code, we can easily implement it "? "No. What code should I write here? ^ _ ^, simple.

 If(Document. addeventlistener ){
Document. addeventlistener ('mousemove ',This. Move. BIND (This, 1, 2 ));
}Else If(Document. attachevent ){
Document. attachevent ("onmousemove ",This. Move. BIND (This, 1, 2 ));
}

Is it very easy for this method to point to other objects when an event is to be added and then called in the future ..

It's hard to understand the above Code.

 VaRA =Function(){
Console. Log (arguments [0]);//1
Console. Log (arguments [1]);//2
Console. Log (This. Key1 );
//In this way, if you bind a parameter, it is as simple as the native bind,
};
VaRB = {
Key1: "value1"
};

A. BIND (B, 1, 2 )();

I think this is a mistake that many people make. The Code is as follows:

Function. Prototype. Bind = Function (Target ){
VaR Self = This ;
Return Function (){
Return Self. Apply (target, arguments ); // Here arguments cannot be passed in.
}
}
VaR A = Function (){
Console. Log (arguments. Length ); // In this case, the arguments parameter is invalid.
// Arguments. Length = 0.
Console. Log ( This . Key1 );
};
VaR B = {
Key1: "value1"
};
A. BIND (B, [1, 2], 3 )(); // The expected arguments. Length = 2
// This is why I am eager to operate the arguments parameter.
// I know most people here will think right, but you are wrong. You still have to think about it on the 17th floor.

Source code without comments,

( Function (){
VaR Proxy = Function (FN, target ){
VaR Proxy = Function (){
If (2 <arguments. Length ){
VaR Privateargs = array. Prototype. Slice. Call (arguments, 2 );
Return Function (){
VaR ARGs = array. Prototype. Slice. Call (arguments );
Array. Prototype. unshift. Apply (ARGs, privateargs );
Return FN. Apply (target, argS );
}
}
Return Function (){
Return FN. Apply (target, arguments );
}
}
Return Proxy. Apply ( Null , Arguments );
};
/* Supports native use of native */
Function. Prototype. Bind = function. Prototype. Bind |
Function (Target ){
If (1 <arguments. Length ){
VaR ARGs = array. Prototype. Slice. Call (arguments, 1 );
Args. unshift ( This , Target );
Return Proxy. Apply ( Null , ArgS );
}
Return Proxy ( This , Target );
};
})();

If you do not understand, please refer

Http://www.cnblogs.com/nothingbrother/archive/2011/12/16/2290460.html

If you need to repost this article, please attach a link

Http://www.cnblogs.com/nothingbrother/

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.