javascript - 将数据设置为对象属性

我有一个问题，我不知道该如何进一步。

我有这样的东西。

function Paginator() {
    this.currentPage = 1;
};

Paginator.prototype.getCurrentPage = function() {
        return this.currentPage;
};

Paginator.prototype.getNextPage = function () {
    this.currentPage++;
    return this.getCurrentPage();
};

Paginator.prototype.getPreviousPage = function () {
    this.currentPage--;
    return this.getCurrentPage();
};

Paginator.prototype.setCurrentPage = function (page) {
    this.currentPage = page;
    return this.getCurrentPage();
};

Paginator.prototype.renderPage = function (page, data) {
    this.currentPage = page;
    this.pageList = [];
    for(i = 0; i < Math.ceil(75/12); i++)
    {
        this.pageList.push([i, (i-1)*12, i*12]);
    }
    for(i=this.pageList[page][1]; i < this.pageList[page][2]; i++) {
        var tmpl = "<article class='col-lg-3 col-md-4 col-sm-12 col-xs-12 video'><div class='video-image'><img class='img-responsive img' src='img/" + data[i].image + ".jpeg'><img class='player img-responsive' src='img/icon.png' width='75px' height='75px'></div><p class='video-title'><strong>" + data[i].title + "</strong></p><p class='video-timestamp'>" + data[i].timestamp + "</p></article>";
        $(".video-container").append(tmpl);
    }
};

这是我的分页对象。

当我调用paginator.getCurrentPage（）;时它将返回1，因为这是默认值。

但是，如果我调用renderPage（3，data）;它应该为第3页呈现第3页的数据及其工作。问题在于，此渲染函数在另一个函数中调用，该另一个函数是ajax函数的回调：

Loader.prototype.load = function (url, callback, from, to) {
    //load JSON from url
    var xhr = new XMLHttpRequest();
    var self = this;

    xhr.onreadystatechange = ensureReadiness.bind(self);

    function ensureReadiness() {
        if (xhr.readyState < 4) {
            return;
        }
        if (xhr.status !== 200) {
            return;
        }
        // all is well
        if (xhr.readyState === 4) {
            var JSONObject = JSON.parse(xhr.responseText);
            (to) == "all" ? to = JSONObject.length : to;
            callback(JSONObject, from, to);
        }
    }
    xhr.open('GET', url, true);
    xhr.send('');
};

Cache.prototype.load = function(data, from, to) {
    this.data = data;
    paginator.renderPage(3, data);

};

一切正常，它加载正确的数据并显示它们，但是在脚本的底部，我有：

cache = new Cache();

paginator = new Paginator();

loader = new Loader();
loader.load("http://academy.tutoky.com/api/json.php",cache.load.bind(cache), 0, 30);

这应调用loader.load函数，该函数调用cache.load函数，该函数调用创建视图的paginator.renderPage函数，但也应将paginator.currentPage设置为renderPage函数参数中的某个值。它确实在paginator.renderPage函数的范围内，但是当我添加console.log（paginator.getCurrentPage（））;时。到整个脚本的底部，它将返回1，而不是page参数的值。

最佳答案

看来问题出在您登录页码之前，异步调用未完成。我已经将fiddle更新为将console.log包装在回调中，如下所示：

loader.load("http://academy.tutoky.com/api/json.php",test, 0, 30);

function test(data, from, to) {
    cache.load(data, from, to);
    console.log(paginator.getCurrentPage());
}

显然，您可能想看看改善我的命名！ ; o）