Question

我要做的是创建一个将处理我的ajax调用的对象，我需要反复刷新几页，并为每个页面创建一个对象是我能想到的唯一方法这样做，仍然具有异步的ajax代码。但每当我测试时，没有任何事情发生，我不知道为什么。

这是我的代码

function PageLoader(url,id,repeatTime){
    this.id = id;
    this.url = url; 
    this.repeatTime = repeatTime;

    this.start = function(){        
        var time = Date.now();
        var xml = new XMLHttpRequest();

        xml.open("GET",this.url,true);
        xml.onreadystatechange = function(){        
            if(xml.readyState === 4){
                document.getElementById(this.id).innerHTML = xml.responseText+" <small>("+(Date.now()-time)+")</small>";

                if(this.repeatTime > 0){
                    setTimeout(this.start,this.repeatTime);
                }
            }
        }

        xml.send(null);
    }

    this.stop = function(){
        this.repeatTime = -1;
    }
}

以下是我尝试运行它的方法。

var infoAjax = new PageLoader('../modules/userinfo.php','StatusInfo',1000);

//Load everything automaticly
window.onload = function(){
    infoAjax.start();
}

Answer 1

我将进入网络，但我想花点时间解释一些关于JavaScript的内容。

首先，JavaScript没有传统意义上的类概念。 JavaScript中的每个对象都有一个原型，允许该对象访问外部属性，就好像它们是该对象的属性一样。例如，var point = {x: 0, y: 10}创建一个引用具有两个本地键point和x的对象的变量y，但point也具有可以访问的原型属性（例如，point.hasOwnProperty是来自Object.prototype的函数 - 这对于大多数JavaScript对象是通用的）。 this关键字是有趣的事情。每当调用一个函数时，this关键字指的是“拥有”该函数的对象。如果我执行point.incrementX = function () { this.x++; }之类的操作，则this会引用point，因为它“拥有”incrementX函数。 JavaScript允许您通过在函数上调用.call来覆盖此所有权，并在函数体内提供要用作this的对象。构造函数是JavaScript真正混淆事物的地方。将new关键字应用于函数时，它会执行两项操作。首先，它构造一个对象，其原型设置为构造函数的prototype属性。然后它将该对象作为this提供给构造函数。所以，当你var obj = new Constructor()执行var obj = Object.create(Constructor.prototype); Constructor.call(obj)时，Object.create会创建一个原型设置为所提供对象的对象。

无论如何，回到这一点。不要在构造函数中为PageLoader对象创建方法，而应考虑将它们放在prototype的{{1}}属性中。

PageLoader

另一件事 - 可能是您的代码无效的原因 - 是在PageLoader.prototype = { start: function () { ... }, stop: function () { ... } }; // or PageLoader.prototype.start = function () { ... }; PageLoader.prototype.stop = function () { ... };事件回调中使用this。当您使用onreadystatechange时，它实际上是指this变量而不是xml实例。要解决这个问题，只需将PageLoader之类的变量声明置于var self = this;回调之上。

- 编辑 -

不可否认，我的解释xml.onreadystatechange有点弱。如果您想了解更多说明，请查看MDN页面（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this）。

如何创建javascript类

1 个答案: