前端开发学习随笔---------$.proxy()

                                         前端开发学习随笔---------$.proxy()

今天在学习编写推箱子游戏时，用到了一个新的jquery方法------------proxy（）；下面我将介绍一下$.proxy()的具体使用方法：

jQuery.proxy(),接受一个函数，然后返回一个新函数，并且这个新函数始终保持了特定的上下文(context )语境。

• jQuery.proxy( function, context )

  function将要改变上下文语境的函数。

  context函数的上下文语境(`this`)会被设置成这个 object 对象。

• jQuery.proxy( context, name )

  context函数的上下文语境会被设置成这个 object 对象。

  name将要改变上下文语境的函数名(这个函数必须是前一个参数 ‘context’ 对象的属性)

这个方法通常在向一个元素上附加事件处理函数时，上下文语境实际是指向另一个对象的情况下使用。

另外，jQuery 能够确保即使你绑定的函数是经过 jQuery.proxy() 处理过的函数，你依然可以用原先的函数来正确地取消绑定。

看一下官方的例子:

var obj = {
name: "John",
test: function() {
alert( this.name );
$("#test").unbind("click", obj.test);
}
};

$("#test").click( jQuery.proxy( obj, "test" ) );

// 以下代码跟上面那句是等价的:
// $("#test").click( jQuery.proxy( obj.test, obj ) );

// 可以与单独执行下面这句做个比较。
// $("#test").click( obj.test );

下面可以看一下我在编写推箱子游戏时使用到$.proxy()的代码例子：

<span style="font-family:Verdana, Arial, Helvetica, sans-serif;">createBox :function(){  //创建箱子
		$.each(this.nowJson.xiangzi,$.proxy(function(i,elem){  //
			var oBox = $('<div class="xiangzi"></div>');
			oBox.css({
				"left":elem.x*50,
				"top":elem.y*50
			});
			this.oParent.append(oBox);//如果没使用$.proxy()这里的this将会指向错误的地方

		},this))

	},</span>