1,在callObjMethod方法中,我用了兩種方式回調“method"方法:
第一種方式:method("通過默認上下文回調");
沒有指定上下文,我們發現回調函數內部訪問context的值是全局變量的值,
這說明,執行該方法的默認上下文是全局上下文。
第二種方式:method.call(obj,"指定顯式對象上下文回調");
指定obj爲method執行的上下文,就能夠訪問到對象內部的context
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <mce:script type="text/javascript"><!--
- var context="全局";
- var testObj={
- context:"初始",
- callback:function (str){
- //回調函數
- alert("callback:我所處的上下文中,context="+this.context+",我被回調的方式:"+str);
- }
- };
- //創建一個對象,作爲測試回調函數的上下文
- testObj.context="已設置";
- function testCall(){
- callMethod(testObj.callback);
- callObjMethod(testObj,testObj.callback);
- }
- function callMethod(method){
- method("通過默認上下文回調");
- }
- function callObjMethod(obj,method){
- method.call(obj,"指定顯式對象上下文回調");
- }
- // --></mce:script>
- </head>
- <body> <a href="javascript:void(0)" mce_href="javascript:void(0)" onclick="testCall()">調用測試</a> </body>
- </html>
2,在javascript中,在function內部創建一個function的時候,會自動創建一個closure,
而這個closure就能記住對應的function創建時的上下文
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <mce:script type="text/javascript"><!--
- var context="全局";
- var testObj={
- context:"初始",
- callback:function (str){
- //回調函數
- alert("callback:我所處的上下文中,context="+this.context+",我被回調的方式:"+str);
- }
- };
- //創建一個對象,作爲測試回調函數的上下文
- testObj.context="已設置";
- function testCall(){
- callMethod(testObj.callback);
- callWithClosure(function(param){testObj.callback(param);});
- callObjMethod(testObj,testObj.callback);
- }
- function callMethod(method){ method("通過默認上下文回調"); }
- function callWithClosure(method){ method("通過Closure保持上下文回調"); }
- function callObjMethod(obj,method){ method.call(obj,"指定顯式對象上下文回調"); }
- // --></mce:script>
- </head>
- <body> <a href="javascript:void(0)" mce_href="javascript:void(0)" onclick="testCall()">調用測試</a> </body>
- </html>
3,在javascript中,this也可以代表當前對象,但不能直接用在匿名function中用,比如:
JScript code var testObj={ context:"初始", callback:function (str){//回調函數 alert("callback:我所處的上下文中,context="+this.context+",我被回調的方式:"+str); }, caller:function(){ callWithClosure(function(param){this.callback(param);}); } };//創建一個對象,作爲測試回調函數的上下文
以上代碼中的this指的不是testObj,而是全局上下文, 需要在closure外寫一個臨時變量來代表this,完整的代碼如下:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <mce:script type="text/javascript"><!--
- var context="全局";
- var testObj={
- context:"初始",
- callback:function (str){
- //回調函數
- alert("callback:我所處的上下文中,context="+this.context+",我被回調的方式:"+str);
- },
- caller:function(){
- callWithClosure(function(param){this.callback(param);});
- var temp=this;
- callWithClosure(function(param){temp.callback(param);});
- }
- };
- //創建一個對象,作爲測試回調函數的上下文
- testObj.context="已設置";
- function testCall(){
- //callMethod(testObj.callback);
- testObj.caller();
- //callWithClosure(function(param){testObj.callback(param);});
- //callObjMethod(testObj,testObj.callback);
- }
- function callObjMethod(obj,method){method.call(obj,"指定顯式對象上下文回調"); }
- function callMethod(method){ method("通過默認上下文回調"); }
- function callWithClosure(method){ method("通過Closure保持上下文回調"); }
- function callback(str){ alert("callback:我是定義在外部的全局函數。"); }
- // --></mce:script>
- </head>
- <body> <a href="javascript:void(0)" mce_href="javascript:void(0)" onclick="testCall()">調用測試</a> </body>
- </html>