专栏首页与神兽党一起成长在对象里定义了一个XMLHttpRequest请求了,怎么在请求的回调中引用对象的『this』『神兽必读』

在对象里定义了一个XMLHttpRequest请求了,怎么在请求的回调中引用对象的『this』『神兽必读』

问题

XMLHttpRequest inside an object: how to keep the reference to “this”

且看代码

javascriptmyObject.prototye = {
  ajax: function() {
    this.foo = 1;

    var req = new XMLHttpRequest();
    req.open('GET', url, true);
    req.onreadystatechange = function (aEvt) {  
      if (req.readyState == 4) {  
        if(req.status == 200)  {
          alert(this.foo); // reference to this is lost
        }
      }
  }
};

onreadystatechange回调中再也引用不到主对象的this了,当然就没有办法获取this.foo变量了,有什么办法可以在这个回调中继续引用主对象呢

答案

最简单的办法就是将主对象的this保存到局部变量中,

javascriptmyObject.prototype = {
  ajax: function (url) { // (url argument missing ?)
    var instance = this; // <-- store reference to the `this` value
    this.foo = 1;

    var req = new XMLHttpRequest();
    req.open('GET', url, true);
    req.onreadystatechange = function (aEvt) {  
      if (req.readyState == 4) {  
        if (req.status == 200)  {
          alert(instance.foo); // <-- use the reference
        }
      }
    };
  }
};

如果我没有猜错的话,myObject是一个构造函数,现在你这么直接设置它的原型对象,最好还是将原型对象的constructor属性(设置)恢复为myObject

附,在<<JavaScript设计模式>>看到的译者注: /* *译者注:定义一个构造函数时,其默认的prototype对象是一个Object 类型的实例,其constructor属性会被自动设置 *为该构造函数本身。如果手工将其prototype 设置为另外一个对象,那么新对象自然不会具有原对象的constructor值, *所以需要重新设置其constructor 值。 */

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 使用Mockito修改Bean的依赖

    在使用单元测试时经常会遇到某些dependency依赖了外部资源,或者想主动绕过真正的方法执行mock返回结果而快速得到单元测试最终的期望结果,可能有以下两种场...

    用户3579639
  • [MySQL]查询学生选课的情况(一)

    这是我工作遇到的问题,现在自己设计一个简化的类似场景,现实中这样的数据表设计可能有很多不合理的地方。 首先看表结构:

    用户3579639
  • unslider源码分析

    根据Bootstrap中文网的介绍,Unslider一个超小的 jQuery轮播(slider)插件,参照这个汉化版的介绍页面,这个插件有你需要的优点,但是本...

    用户3579639
  • 在大家热议Vicarious AI那篇Science论文时,我们和这家公司的CTO聊了聊(回应LeCun批判)

    机器之心
  • 1.2.4、 Google Analytics测试

    1.Assistant 在配置完后,需要检查跟踪代码是否部署正确,可以用Tag Assistant去检查。这个检测工具只能在Chrome浏览器上使用,你需要在C...

    GA小站
  • 如何确定单一产品利润最大化时的定价?

    逍遥之
  • Python类中公开方法、私有方法和特殊方法的继承原理

    在Python中,对象的私有成员在类外部、派生类或程序中无法直接访问,但是可以通过“对象名._类名__私有成员名”这样一种特殊的形式来访问。 基类的构造方法和公...

    Python小屋屋主
  • 哈佛联合MIT研究证明:抗生素会直接削弱人体的免疫系统 | 黑科技

    镁客网
  • Python mysql 爆破

    py3study
  • Google披露软件定义网络技术Andromeda

    谷歌(Google)正在向云服务开发者披露其分布式基础设施内“跳动的心脏”。 该公司周三宣布,开发者利用谷歌IaaS平台Google Compute E...

    静一

扫码关注云+社区

领取腾讯云代金券