Javascript 对象和异步调用

标签 javascript oop asynchronous

我正在尝试一种更面向对象的 JavaScript 方法,并通过使用 class.prototype 实现了一个带有一些方法的类。

但我有一个问题。

我尝试使用 myclass 中的方法作为 ajax 调用的成功函数。问题是当 ajax 回调时,我无法在该方法中使用 this 。即:

MyClass.prototype.myMethod = function(data)
{
this.data = data; /* in here this is the window object */
}
var myClass = new MyClass();
$.ajax:
    success:myClass.myMethod;

我做错了什么吗?

编辑:尝试完整功能

am not i am

方法

    function MyClass()
{
    this.name="myclass";
};

MyClass.prototype.print = function()
{
    alert(this.name);
};

var myAjax = function(context_,func)
{
    $.ajax({
        url:"www.google.com",
        type: "GET",
        context:context_,
        complete:function(data){
            func(data);
        }
    });
};


var refreshGroups = function(groups)
{
    var myClass = new MyClass();
    myAjax(myClass,myClass.print);
    return;
}

结果:警报为空

最佳答案

"The issue is I can't use this withing that method when is called back by ajax."

使用 $.ajax 调用的 context: 属性。

$.ajax({
    url:...,
    context: myClass,
    success: myClass.myMethod
});

或使用$.proxy ...

$.ajax({
    url:...,
    success: $.proxy(myClass, 'myMethod')
});
<小时/>

鉴于更新的代码,您需要将 func(data) 更改为从使用 context: 设置的调用上下文中调用,因此您需要 this.func(数据)...

var myAjax = function(context_,func)
{
    $.ajax({
        url:"www.google.com",
        type: "GET",
        context:context_,
        complete:function(data){
            this.func(data);
        }
    });
};

...但是由于除了调用您传递的函数并传递参数之外,您在该匿名函数中没有执行任何操作,因此您可以执行 complete:func...

var myAjax = function(context_,func)
{
    $.ajax({
        url:"www.google.com",
        type: "GET",
        context:context_,
        complete:func
    });
};

...func 的调用上下文将设置为您传递的对象,并且 data 参数仍将传递给函数。

<小时/>

当然,这实际上不是代码工作方式的问题,因为您已经拥有对上下文的封闭引用,因此您也可以跳过传递 func,而只需从你的对象中获取它......

var myAjax = function(context_) // <-- no function argument needed
{
    $.ajax({
        url:"www.google.com",
        type: "GET",
        complete:function(data){
            context_.print(data);
        }
    });
};

var refreshGroups = function(groups)
{
    var myClass = new MyClass();
    myAjax(myClass); // <--just pass the object
    return;
}

关于Javascript 对象和异步调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9827737/

相关文章:

javascript - 当在配置中设置规则数组时,Webpack 无法识别 JSX

javascript - typescript 或 JavaScript 将对象的嵌套数组转换为键、值对

javascript - 我使用了倒数计时器,但它会自行重置

php 工具包而不是框架

收到新事件时,Flutter Bloc 取消正在运行的事件

javascript - jQuery .val() 工作正常 - 除非我将它传递给我真正需要的值

java - 一个使用 Java 中 OOP 基本原理的简单项目

php - 每次我需要一些东西时创建新的mysql连接对象

c# - Take/TryTake 和 Add/TryAdd 在阻塞集合上的区别

jquery - 在循环中使用 jQuery 延迟并完成异步 SQLite 数据库查询