1

localStorageRailsがキャッシュされた結果をフェッチするのと同じように、小さなラッパーを書き込もうとしています。Railsのパターンは次のようになります。

# Data.find is a block which just returns the data if the cache key was not found
data = Rails.cache.fetch(key, options) { Data.find }

JavaScriptでは、キャッシュが空の場合にデータを返すために実行されるコールバックの結果を取得するのに苦労しています。

function fetch(key, callback) {
    var result = localStorage.getItem(key);
    if (result) {
        return JSON.parse(result);
    } else {
        result = callback();
        if (result) {
            result = JSON.stringify(result);
            localStorage.setItem(key, result);
        }
        return result;
    }
}

私はそれをこのように使おうとしています：

var data = fetch('projects-delivered', function() {
    var result;
    d3.json('/projects/delivered.json', function(data) {
        result = formatDates(data);
    });
    return result;
});

ただし、データは常に検出されません。別のコールバックを渡す必要がありますか、それとも何らかの方法で同期する必要がありますか？または、これはJavaScriptの非同期性では不可能ですか？

4

1 に答える 1

4

AJAX は非同期で実行されるため、コールバックは常に を返しundefinedます。

getData関数内からコールバックを呼び出す必要があります。

function fetch(key, getData, callback) {
    var result = localStorage.getItem(key);

    result ? callback(JSON.parse(result)) : getData(function (result) {
        result && localStorage.setItem(key, JSON.stringify(result));

        callback(result);
    }
}

次のように使用します。

fetch('projects-delivered', function (callback) {
    d3.json('/projects/delivered.json', function (data) {
        callback(formatDates(data));
    });
}, function (data) {
    // Use the data
});

fetchまたは、関数から promise を返すこともできます。

function fetch(key, getData) {
    var result = localStorage.getItem(key);

    if (result) return Promise.resolve(JSON.parse(result));

    return new Promise(function (resolve) {
        getData(function (result) {
            result && localStorage.setItem(key, JSON.stringify(result));

            resolve(result);
        });
    });
}

次に、返された promise を使用します。

var promise = fetch('projects-delivered', function (callback) {
    d3.json('/projects/delivered.json', function (data) {
        callback(formatDates(data));
    });
});

promise.then(function (data) {
    // Use the data
});
于 2012-10-16T21:42:04.377 に答える