JS資源時序問題思考

(Owed by: 春夜喜雨 http://blog.csdn.net/chunyexiyu)

最近碰到一個問題，涉及JS的時序，借總結梳理梳理思路，事件的處理如下：

1. 資源初始化
2. 加載網絡資源：從網絡fetch資源，完成後會觸發Promise
3. 獨立事件-修改資源
   其中，修改資源時，資源已初始化，但網絡資源加載未完成，導致了異常。

這個就存在一個簡單的時序，對於一個資源，它的狀態有幾種：

• 資源不存在
• 資源存在
  a. 資源未完整（已初始化）
  b. 資源已完整（初始化+加載網絡資源完成）

對於獨立事件-修改資源，我們期望於它的執行結果是怎樣的呢？

• 資源不存在時：直接報錯返回
• 資源已完整時：直接修改資源，返回成功
• 資源未完整時：
  a. 修改非完整性依賴資源（不依賴網絡資源），直接修改，返回成功
  b. 修改完整性依賴資源（網絡依賴資源），有兩種處理模式:
  第一種是通過資源promise等網絡資源完成之後再修改，返回promise；
  第二種是報異常，返回失敗；

問題經常發生在資源未完整的情況，這種情況，如果可以先區分出修改資源的類型：完整性依賴資源，完整性不依賴資源，就可以針對情況做出不同的處理了。

另外已知JS頁面線程本身是單線程執行的，對於一塊操作代碼，它完整執行之後，纔會執行其它的代碼：所以對於資源達到完整的時機和Promse執行的時機是順序執行的。不用考慮資源加鎖，時序通過promis把依賴安排好即可。

關於資源的狀態標示，可以考慮初始化時，爲資源添加狀態位：

• 資源是否已完整
• 資源完整的Promise
  從而方便對資源的各種狀態下的處理做判定。

對於獨立事件-修改資源的僞代碼可以考慮如下這種寫法：

if (resource){
  if (resource.isCompleted){
     // resource is completed, do change
     return succ;
  } else {
     // resource is not completed
     if (incompleteDoAfterPromise){
       // incomplete: do it after complte
       return resource.completePromise.then(function(){
        // after complete, do change
       });
     } else {
        // incomplete: return fail
        return fail;
     }
  }
} else {
  // resource not exist
  return fail;
}

(Owed by: 春夜喜雨 http://blog.csdn.net/chunyexiyu)