具有承諾和關閉范圍的延遲加載

Question

我需要制作異步和延遲加載模塊以獲取一些配置值。 與承諾相關的閉包變量作用域是否存在某些限制？

給定以下模塊，該模塊定義了一個加載器函數，該函數執行帶有promise的異步加載並將配置存儲到模塊范圍中，以實現延遲加載，從而避免每次都不必要地加載配置。

const configModule = () => {
  let config;

  const loader = () => {
    return new Promise((resolve, reject) => {
      if(!config) {
        setTimeout(() => {
          const loadedValues = {foo: 'this be config', bar: 'OK?'};
          console.log('config loaded', loadedValues);
          resolve(loadedValues);
        }, 1);  
      }
      else {
        console.log('config already loaded');
        resolve(config);
      }
    }).then(res => {
      console.log('loader then', res);
      config = res;
      return config;
    })
  };

  return {
    loader: loader
  };
};

使用以下客戶端代碼，該配置將被加載，但始終是全新的，即它不被緩存，延遲加載不起作用。

const cc = configModule();

cc.loader().then(result => {
  console.log('1', result);
});
cc.loader().then(result => {
  console.log('2', result);
});

在這里我缺少閉包范圍和承諾嗎？ 還是這種方法可行？ 有什么選擇？

Answer 1

您的緩存模塊運行正常。 但是在測試中，您將立即進行兩個“ API調用”。 因此，兩個cc（）調用都將在另一個if (!config)更新之前測試它if (!config) 。 只要一個調用能夠返回一個值並更新config ，緩存就會開始工作。

 const configModule = () => { let config; const loader = () => { return new Promise((resolve, reject) => { if (!config) { setTimeout(() => { const loadedValues = { foo: 'this be config', bar: 'OK?' }; console.log('config loaded', loadedValues); resolve(loadedValues); }, 1); } else { console.log('config already loaded'); resolve(config); } }).then(res => { console.log('loader then', res); config = res; return config; }) }; return { loader: loader }; }; const cc = configModule(); cc.loader().then(result => { console.log('1', result); }); setTimeout(() => cc.loader().then(result => { console.log('2', result); }), 100);