总觉得自己弄明确了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就是指实例化的对象。就非常难理解此处的问题。

js面向对象编程:this究竟代表什么?第二篇的更多相关文章

  1. js面向对象编程 ---- 系列教程

    原 js面向对象编程:数据的缓存 原 js面向对象编程:如何检测对象类型 原 js面向对象编程:if中可以使用那些作为判断条件呢? 原 js面向对象编程:this到底代表什么?第二篇 原 js面向对象 ...

  2. 页面循环绑定(变量污染问题),js面向对象编程(对象属性增删改查),js字符串操作,js数组操作

    页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...

  3. 简单粗暴地理解js原型链–js面向对象编程

    简单粗暴地理解js原型链–js面向对象编程 作者:茄果 链接:http://www.cnblogs.com/qieguo/archive/2016/05/03/5451626.html 原型链理解起来 ...

  4. 带你一分钟理解闭包--js面向对象编程

    上一篇<简单粗暴地理解js原型链--js面向对象编程>没想到能攒到这么多赞,实属意外.分享是个好事情,尤其是分享自己的学习感悟.所以网上关于原型链.闭包.作用域等文章多如牛毛,很多文章写得 ...

  5. Js面向对象编程

    Js面向对象编程 1.     什么是面向对象编程? 我也不说不清楚什么是面向对象,反正就那么回事吧. 编程有时候是一件很快乐的事,写一些小游戏,用编程的方式玩游戏等等 2.     Js如何定义一个 ...

  6. js原生设计模式——3简单工厂模式\js面向对象编程实例

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  7. JS面向对象编程(进阶理解)

    JS 面向对象编程 如何创建JS对象 JSON语法声明对象(直接量声明对象) var obj = {}; 使用 Object 创建对象 var obj = new Object(); JS对象可以后期 ...

  8. JS面向对象编程,对象,属性,方法。

    document.write('<script type="text/javascript" src="http://api.map.baidu.com/api?v ...

  9. js面向对象编程(第2版)——js继承多种方式

    附带书籍地址: js面向对象编程(第2版)

  10. 原生js面向对象编程-选项卡(自动轮播)

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

随机推荐

  1. 如何扫描统计全国Telnet默认口令

    如何扫描统计全国Telnet默认口令 zrools2016-01-21共339474人围观 ,发现 23 个不明物体系统安全终端安全 本文原创作者:zrools 本文中介绍的工具.技术带有一定的攻击性 ...

  2. 多图上传控制器及模型代码(2)thinkphp5+layui实现多图上传保存到数据库,可以实现图片自由排序,自由删除。

    公共css代码 <style> .layui-upload-img { width: 90px; height: 90px; margin: 0; } .pic-more { width: ...

  3. 一个小BUG引发的思考。(论开发与测试之间的那点事)

    标题不是“一个馒头引发的血案”. 言归正传:今天上午测试的时候,发现了一个BUG,如图: 一个用肉眼就能发现的BUG.原因当然是因为开发同事没有自测试,流入到了测试人员这里了. 无非是开发同事不严谨造 ...

  4. jeecg接口开发及权限实现原理

    接口开发使用的框架 jeecg本身是基于 Spring MVC 框架搭建的,因此,使用 Spring MVC 框架的 RESTful API 功能来进行接口开发就是顺理成章的事了. 接口的拦截与鉴权 ...

  5. 2.2 webpack

    webpack 介绍 webpack 是什么 为什么引入新的打包工具 webpack 核心思想 webpack 安装 webpack 使用 命令行调用 配置文件 webpack 配置参数 entry ...

  6. img路径错误时,用户友好图片

    img 标签的属性里面添加 onerror="this.src='error友好图片'" 就可以了!

  7. docker镜像私有仓库

    两台centos7的机器 192.168.100.151 docker镜像 192.168.100.157 docker私有仓库 步骤一 192.168.100.157主机开启私有仓库功能 docke ...

  8. centos7部署汉化版gitlab

    =============================================== 2018/6/5_第7次修改                       ccb_warlock 更新说 ...

  9. PHP算法之电话号码的字母组合

    给定一个仅包含数字 2-9 的字符串,返回所有它能表示的字母组合. 给出数字到字母的映射如下(与电话按键相同).注意 1 不对应任何字母. 示例: 输入:"23"输出:[" ...

  10. mfc中的_T

    mfc 中的字符串表示常用_T,意为text,定义为宏定义,可以方便的定义所有字符串为UNICODE(16位,长字符)或者ANSI(8位,短字符). 如果对于所有的字符串定义了_T并且定义了预处理标志 ...