javascript - es6中缓存方法调用结果

Question

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

示例 es2015:

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 = {};

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

class Helper {
    getCount(url) {
       //...
    } 
}

感谢您的帮助!

Answer 1

缓存返回值以避免不必要的密集操作是一个好主意。 OOP 中缓存最常见的场景是当您需要从工厂类创建大量相似的对象时。这实际上是一种 GoF 模式(请参阅享元)。

就你的情况而言，如果我很好地理解你的问题，你正在尝试使用缓存来避免无用的 AJAX 调用。对于 ES6，我认为一个好的实现可能涉及用于缓存的 Map 和用于更好的异步处理的 Promise。在以下使用 GitHub API 的实现中，ajax 是静态方法，getUser 是原型(prototype)属性，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);