zoukankan      html  css  js  c++  java
  • js面向对象编程:this究竟代表什么?第二篇

         总觉得自己弄明确了js中this的含义。this总是指向调用方法的对象,作为方法调用,那么this就是指实例化的对象。但前几天自己写脚本却遇到了一个非常奇怪的问题。

       代码例如以下:

     

     //内部对象AutoCompleteInner
              function AutoCompleteInner(transformResultInner)
    		  {
    		    if(transformResultInner)
    		    {
    		      this.transformResultInner=transformResultInner;
    			}		  
    		  }
    		   AutoCompleteInner.prototype.transformResultInner = function() 
    		  {    
                  alert("inner transformResult");
              }
              AutoCompleteInner.prototype.TestInner = function() 
    		  {    
                  this.transformResultInner();
              }
    		   //封装了对内部对象AutoCompleteInner的调用
           function AutoCompleteOuter(obj) 
    	   {   
                this.TextField = obj.TextField;
                this.ValueField = obj.ValueField;
               if (obj.transformResult) 
    		   {
                 this.transformResultOuter = obj.transformResultOuter;
               }  
            }
    		 AutoCompleteOuter.prototype.transformResultOuter=function() 
    		{
    		   alert("TextField:"+this.TextField+",ValueField:"+this.ValueField);	
            }
    		AutoCompleteOuter.prototype.TestOuter = function () 
    		{
    		  var test =new AutoCompleteInner(this.transformResultOuter);
    		  test.TestInner();
    		}
    測试代码1

     //測试代码 1   
    		 function test(){			  
    	        var obj={};
    		  obj.TextField = "TextField";
              obj.ValueField ="ValueField";		
    		  var temp=new AutoCompleteOuter(obj);	
    		   temp.transformResultOuter();		
    	     }	

    弹出现实的内容为“TextField:TextField,ValueField:ValueField”这个非常easy理解。在实例AutoCompleteOuter的方法transformResultOuter中的this就是AutoCompleteOuter的实例temp,弹出的内容自然也和合理,符合作为方法调用,那么this就是指实例化的对象。

    測试代码2

     function test(){			  
    	        var obj={};
    		  obj.TextField = "TextField";
              obj.ValueField ="ValueField";		
    		  var temp=new AutoCompleteOuter(obj);	
    		  // temp.transformResultOuter();
    		  temp.TestOuter();
    	     }	
    通过分析代码。发现。调用的也是AutoCompleteOuter的方法transformResultOuter,但:问题是:

    弹出的内容却是“TextField:undefined,ValueField:undefined

    非常奇怪,调用的方法一样传递的參数也样,但为什么弹出的弹出的内容不一样的?

    经过分析发如今測试二的代码中this的含义和測试一中的代码中的this已经不一样了,測试一中的this代表的是AutoCompleteOuter的实例。但在測试二中this代表的是AutoCompleteInner的实例,这也就是为什么同样的代码为什么显示的内容却不一样的原因了。

    看来this总是指向调用方法的对象这才是区分this的根本方法。this是上下文相关的,怎样机械的理解作为方法调用,那么this就是指实例化的对象。就非常难理解此处的问题。

查看全文
  • 相关阅读:
    ES6知识点脑图
    三大框架知识点比较(Angular, Vue, React)
    Angular(06)- 为什么数据变化,绑定的视图就会自动更新了?
    Angular(05)- 组件知识点脑图
    iTop4412开发板+虚拟机+tftp服务
    发布项目遇到的问题
    Ubuntu + Django(DRF) + channels(websocket)+NGINX + uwsgi 环境部署
    在Ubuntu中使用uwsgi 启动 Django ,但是静态文件映射出错
    Django + mysql 在创建数据库出错
    流媒体服务器搭建 ffmpeg + nginx
  • 原文地址:https://www.cnblogs.com/ldxsuanfa/p/10840821.html
  • Copyright © 2011-2022 走看看