this小记

太久没有研究底层的js相关,今晚差点被紫红爸爸上课了。

正题

var net=new Object();  //定义一个全局变量net
net.AjaxRequest=function(url,onload,onerror,method,params){//创建一个构造函数
this.req=null;
this.onload=onload;
this.onerror=(onerror) ? onerror : this.defaultError;
this.loadDate(url,method,params);
}

this指向什么?是net.AjaxRequest还是net?刚开始没想起来答错了,说了net.AjaxRequest。其实这段代码的本质跟下面这段是一样的

var obj = {
name:"qiangzi",
show:function(){
console.log(this.name);
}
};
obj.show();

很明显,obj.show()的this指向调用该方法的对象,也即是obj,所以上面的代码其实也就是这样

var net = {
AjaxRequest: function (url, onload, onerror, method, params) {//创建一个构造函数
this.req = null;
this.onload = onload;
this.onerror = (onerror) ? onerror : this.defaultError;
this.loadDate(url, method, params);
}
};
net.AjaxRequest();

所以,很明显,上面的代码中,AjaxRequest的this指向就是net

然后紫红给我看了这图

图很可怕,但其实内容很简单,简化的问题如下

输出结果

根据上文分析,net.athis指向net,所以net.a内部调用this.b(),实际上就是指net.b()。但是,我们的b方法是加在net.a的原型上,而不是net的原型上,所以很明显,调用net.a()的时候输出结果是this.b is not a function

解决方法

为了能够正确的运行b方法,我们先试着把b方法加到net的原型上

var net = {
a:function(){
this.b();
}
};
net.prototype.b=function(){
console.log("success")
};
net.a()

结果,浏览器报错

Uncaught TypeError: Cannot set property 'b' of undefined

由于我们的net是对象,而对象上是无法添加原型的,所以这里就报错了,最后我们用了new来解决

var net = {
a:function(){
this.b();
console.log(this);
}
};
net.a.prototype.b=function(){
console.log("success");
};
new net.a();

输出

success

net.a {}

可以看出,new改变了我们的this指向,至于具体的用法以及原因,有时间再做探究。

this小记的更多相关文章

  1. [原]Paste.deploy 与 WSGI, keystone 小记

    Paste.deploy 与 WSGI, keystone 小记 名词解释: Paste.deploy 是一个WSGI工具包,用于更方便的管理WSGI应用, 可以通过配置文件,将WSGI应用加载起来. ...

  2. MySql 小记

    MySql  简单 小记 以备查看 1.sql概述 1.什么是sql? 2.sql发展过程? 3.sql标准与方言的关系? 4.常用数据库? 5.MySql数据库安装? 2.关键概念 表结构----- ...

  3. Git小记

    Git简~介 Git是一个分布式版本控制系统,其他的版本控制系统我只用过SVN,但用的时间不长.大家都知道,分布式的好处多多,而且分布式已经包含了集中式的几乎所有功能.Linus创造Git的传奇经历就 ...

  4. 广州PostgreSQL用户会技术交流会小记 2015-9-19

    广州PostgreSQL用户会技术交流会小记 2015-9-19 今天去了广州PostgreSQL用户会组织的技术交流会 分别有两个session 第一个讲师介绍了他公司使用PostgreSQL-X2 ...

  5. 东哥读书小记 之 《MacTalk人生元编程》

         一直以来的自我感觉:自己是个记性偏弱的人.反正从小读书就喜欢做笔记(可自己的字写得巨丑无比,尼玛不科学呀),抄书这事儿真的就常发生俺的身上. 因为那时经常要背诵课文之类,反正为了怕自己忘记, ...

  6. Paypal支付小记

    Paypal支付小记 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !impo ...

  7. linux 下cmake 编译 ,调用,调试 poco 1.6.0 小记

    上篇文章 小记了: 关于 Poco::TCPServer框架 (windows 下使用的是 select模型) 学习笔记. http://www.cnblogs.com/bleachli/p/4352 ...

  8. mongodb入门学习小记

    Mongodb 简单入门(个人学习小记) 1.安装并注册成服务:(示例) E:\DevTools\mongodb3.2.6\bin>mongod.exe --bind_ip 127.0.0.1 ...

  9. 【日常小记】统计后缀名为.cc、.c、.h的文件数【转】

    转自:http://www.cnblogs.com/skynet/archive/2011/03/29/1998970.html 在项目开发时,有时候想知道源码文件中有多少后缀名为.cc..c..h的 ...

  10. ulua 路径小记 以及 lua require 机制整理

    ulua 路径小记 在学习ulua时,require模块的根路径可以为项目的Lua文件夹或者ToLua文件夹(Editor下),但是在package.path和package.cpath中并没有看到当 ...

随机推荐

  1. Python网络编程——设备名和IPv4地址

    1.快速查看主机名和对应的IP地址小程序 import socket def print_machine_info(): # 定义print_machine_info()类 host_name = s ...

  2. (Problem 35)Circular primes

    The number, 197, is called a circular prime because all rotations of the digits: 197, 971, and 719, ...

  3. 【转】OCR识别引擎tesseract使用方法——安装leptonica和libtiff

    原文来自:http://cache.baiducontent.com/c?m=9f65cb4a8c8507ed4fece7631046893b4c4380146d96864968d4e414c4224 ...

  4. Debian下Apache配置多域名访问

    请见Github博客:http://wuxichen.github.io/Myblog/php/2014/10/10/DebianApacheSetting.html

  5. 免费利用网页版谷歌翻译实现任意语言转换php版

    本文源发布地址: http://ourgarden.cn/2013/07/20/%E5%85%8D%E8%B4%B9%E5%88%A9%E7%94%A8%E7%BD%91%E9%A1%B5%E7%89 ...

  6. HDU 5281 Senior's Gun

    Senior's Gun Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others) Tot ...

  7. datetime方法

    DateTime dt = DateTime.Now; dt.ToString();//2005-11-5 13:21:25 dt.ToFileTime().ToString(); dt.ToFile ...

  8. 【Web】java date 到 Oracle date 精确到时分秒

    有两种方法: java.util.Date startTime=new Date("2014/01/01 23:00:00"); 1.new Timestamp(startTime ...

  9. C#学习之-----再论委托

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...

  10. js Function 加不加new 详解

    以下来自:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new The new operato ...