The method that is called when the event is added also wants to point to another object

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 do you want to do there? I want to bind my Move method to document's MouseMove, but I have a problem, so Mouse.prototype.move

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

Function.prototype.bind () This magical thing, but IE6 7 8 is not supported, the general modern browser is supported, and the next thing we do is to imitate him,

Such a good way of course to imitate it, how to imitate the original method of seeing nothing below

(function () {

var proxy = function (FN, target) {

var proxy = function () {

if (2 < Arguments.length) {//when there are arguments to the proxy function

var Privateargs = Array.prototype.slice.call (arguments, 2);

Remove from the second start, [this, bound object, parameter list]

return function () {

var args = Array.prototype.slice.call (arguments);

-The arguments here is not the same as the outside, this is the arguments object within the function of the agent,

For example, the Arguments[0]=[object event for the move function here is the E-parameter inside the event

Array.prototype.unshift.apply (args, Privateargs);

--and here, with the parameters passed in, it's done, like the original bind parameter form

And here is to put the private parameters in front of such as A=new Mouse (); a.move;

If the Move method has no arguments, it means prototype.move=fn () {arguments},

And I passed in the parameters, the arguments.length=3 of the parameters,

Arguments[0]=1,arguments[1]=2,arguments[2]=[object event].

Return fn.apply (target, args);

}

The reason why this is complicated is because, in the function of the agent can directly access the arguments, for example, I do not give the proxy function to pass parameters, and directly use

So this arguments will contain the same object as the native Function.prototype.bind arguments,

The code here is esoteric, because you don't understand what the arguments is in the native bind here, and know why you bind my own arguments.

To do so much, the main purpose is to make the arguments inside the function you are acting on is consistent with what the arguments object in Function.prototype.bind contains.

}

return function () {

Return fn.apply (target, arguments);

}

}

return proxy.apply (null, arguments);

};

/* Support for native use of native */

Function.prototype.bind = Function.prototype.bind | |

function (target) {//This here refers to the functions to be proxied

if (1 < arguments.length) {

var args = Array.prototype.slice.call (arguments, 1); Take out the parameter list

Args.unshift (this, target); This args eventually becomes the [this, bound object, parameter list]

return proxy.apply (null, args);

--It is estimated that everyone will make the same mistake as the 17 floor, the reason why this complex operation arguments object, only in order to guarantee the transfer into the proxy function, to ensure that the arguments object is not invalidated

}

Return proxy (this, target);

};

})();

The above code why I have to return back to the agent, because so you can call This.move.bind (this,1,2) () and then the function is executed immediately!

With the above code, we can easily implement the "?" What code to write here, ^_^, easy.

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 not easy to come across a method that is going to add an event and then call it again to point to another object?

It's a little hard to understand the above code.

var a = function () {

Console.log (Arguments[0]); 1

Console.log (Arguments[1]); 2

Console.log (This.key1);

With this binding parameter, my parameters are listed in order to be as simple as the native bind,

};

var B = {

Key1: "Value1"

};

A.bind (b, 1, 2) ();

Refute the 17 floor classmate's code error, I think this is a lot of people will make mistakes, the code is as follows

Function.prototype.bind = function (target) {

var = this;

return function () {

Return self.apply (target, arguments); The arguments here won't come in.

}

}

var a = function () {

Console.log (arguments.length); If this bind, the arguments parameter fails.

Arguments.length=0.

Console.log (This.key1);

};

var B = {

Key1: "Value1"

};

A.bind (b, [1, 2], 3) (); As can be seen from here, the desired arguments.length=2

That's why I'm so earnest. Operation arguments Parameters

I know most people here will feel right, but you're wrong, 17 floor students you have to think about

Non-annotated source code,

(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);

};

/* Support for 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);

};

})();

The method that is called when the event is added also wants to point to another object