上兩週主要給大家介紹了遊戲中是如何檢測遊戲角色和遊戲角色和障礙物間的碰撞。今天回到 mario 繼續寫我們 super mario 這款遊戲。
在開始新的內容之前，我們需要整理一下前面的代碼。我們看圖中的 loadBackgroundSprites 和下面定義的 comp 對象都是應該屬於 level（關卡），因爲他們都會關卡息息相關。關卡包含背景圖的組合(這裏所謂組合將許多層組合爲背景展示給用戶)
創建 Level 類，Level 中我們將 compositor（圖層組合）遊戲角色集合 entities。
介紹一下 ES6提供了Set 數據結構。類似於數組，但是沒有重複值。下面代碼可以幫助大家理解 Set 數據結構。
回到主（main.js）函數，由於 comp 已經成爲 Level 一個屬性，我們就可以刪除此行代碼。
我們將與 Level 有關的代碼移到 Level 類中來整合代碼，已經類的概念，也就是面向對象編程的終極目標就是複用代碼
在 loader.js 我們對 loadLevel 進行改動，改動力度很大，稍一說明。在讀取 json 和加載背景 sprite。兩個加載完成後，我們需要創建 Level 實例，這個實例提供 comp 和 entities 。我們現在就把 compositor 封裝到 Level 類中了。然後把 Mario 看作 Level 的 entities 集合中的一個。
切換到 layer.js 文件中，進行一些調整，這裏內容顯然易見，就不做過多解釋了。
修改main.js 中代碼，如下圖。
現在一切和調整代碼之前一樣，除了沒有看到主角 mario，我們要看到 mario 就還需要一些工作，就是將 mario 添加到 entities 中。
我們把 mario 的 update 方法也移到 Level 這類中，這樣看起來就更合理，因爲所有角色的都在 entities 這個集合中，所以可以 level 的 update 方法代替 mario（做一個 entity）他自己方法。然後在 level 的 update 方法中，我們遍歷 entities 然後調用每一個 entity 的 update 方法。