Question

是否可以在es6中缓存方法调用结果，以及如何正确完成？

示例es2015：

If your table name is athletes, note: use DB in controller
$athletesInfo = DB::table('athletes')
                     ->select('level', DB::raw('count(*) as total'))
                     ->groupBy('level')
                     ->get();

我正在寻找类似的东西，但是在es6。

Helper.prototype.getCount = function (requestURL) {
    var cache = Helper.prototype.getCounters.cache,
        result = '';

    if (cache[requestURL] === undefined) {
        result = doSomething();
    } else {
        // if result wild in cache -> load it
        result = cache[requestURL];
    }

    return result;

    function doSomething() {
        var result = 1; // ... some havy operations

        // save results in cache
        cache[requestURL] = result;

        return result;
    }
}

Helper.prototype.getCounters.cache = {};

感谢您的帮助！

Answer 1

缓存返回值以避免不必要的密集操作是一个好主意。在OOP中缓存的最常见方案是，您需要从工厂类创建许多类似的对象。这实际上是一个GoF模式（参见 Flyweight ）。

在您的情况下，如果我理解您的问题，您正在尝试使用缓存来避免无用的AJAX调用。使用ES6，我认为一个好的实现可能涉及Map用于缓存，Promise用于更好的异步处理。在使用GitHub API的以下实现中，ajax是静态方法，getUser是原型属性，cache是静态属性。

class GitHub {
  static ajax(username) {
    return new Promise((resolve, reject) => {
      let req = new XMLHttpRequest();

      req.onreadystatechange = function () {
        if (this.readyState === XMLHttpRequest.DONE) {
          if (this.status === 200) {
            let json = JSON.parse(this.responseText),
                user = {
                  name: json.name,
                  bio: json.bio
                };
            GitHub.cache.set(username, user);
            resolve(user);
          } else {
            reject(new Error(`${this.status} ${this.statusText}`));
          }
        }
      };

      req.open('GET', `https://api.github.com/users/${username}`, true);
      req.send(null);
    });
  }
  
  getUser(username = 'Badacadabra') {
    if (!GitHub.cache.has(username)) {
      console.log('AJAX');
      return GitHub.ajax(username);
    } else {
      console.log('Cache');
      return GitHub.cache.get(username);
    }
  }
}
GitHub.cache = new Map();

let github = new GitHub();

github.getUser()
  .then(console.log)
  .then(() => github.getUser())
  .then(console.log)
  .then(() => github.getUser())
  .then(console.log)
  .catch(console.error);

缓存方法调用结果为es6

1 个答案: