我對於模組化的東西的方式是希望，可以在主程式去 new 出所有東西，並且可以隨時修改他的參數，所以我的 index.js 會import 希望import 所有檔案，而拆分也不是依自己想要的就馬上拆，有一個大原則就是：先求有再求好，將檔案模組化不是一步登天就將所以檔案分出去，因爲這樣你會不知道哪邊出了問題，而是要一個一個的分出去，讓我帶大家實作看看啦：

我們先拆分 Enemy 出去，所以主程式要 import Enemy ，而 Enemy 要 export ，而這邊有點類似將設定檔在 Enemy 裡面做，而在主程式去 new 出一個 phaser class 出來

//index.js
import Enemy from '/.Enemy'
//...
function create(){
//...
//爲什麼要傳入 path ，我後面會一起解釋
    let path = this.add.path(96,-32)
    let myEnemy = new Phaser.Class(Enemy(path))
    enemies = this.physics.add.group({
        classType: myEnemy,
    })
}

// Enemy.js
export default function Enemy(path){
    return {
        //...
    }
}

這是模組的第一步，我們將 Enemy 拆出去，如果遊戲可以正常的跑，恭喜，你已經完成最大的一步了，因爲我光是這一步就花了快要一天的時間了，因爲如同前面講的，要一步一步拆分，而我想說應該沒有這麼難，就一次做很多事情，就造成解了一個錯誤噴了一個錯誤，所以不要犯跟我一樣的錯阿

再來就是希望在主檔案直接修改參數，所以可以將 Enemy 的參數都拿出來，並傳入 Enemy 裡面，當然哪邊的參數要吃這個值也要記得修改

let enemySpeed = 1 / 10000
let enemyHp = 200
let myEnemy = new Phaser.Class(Enemy(path, enemySpeed, enemyHp))
// Enemy.js
export default function Enemy(path, enemySpeed, enemyHp, ) {
//...
}

就可以輕鬆的去 new 出不同參數的敵人了，其他檔案的方式也是如法炮製啦，而這邊有幾個我在拆分的時候遇到的問題跟大家分享

• 全域變成區域
  在原本的檔案，會有很多的全域變數大家共用，但如果將檔案拆分了，勢必吃不到這些全域變數，就會報錯，當然這邊有兩個解決方式(我認爲的)，
  1.將全域的變數也 import 進去子檔案裡面
  2.在實例化的時候，一併將會用到參數傳進去(順便將全域變成區域)
  第一種方式是我認爲可以但是實作上有點奇怪的感覺，所以使用第二種方式去傳一些大家可能用的到的東西(雖然我覺得這個方式不是很好，但要整個架構再重新想過才能重構)
• 你的 this 是什麼
  在原本的檔案可以看到會 this 來 this 去的，但如果你嘗試去 console 這些 this ，會發現他們在不同的地方指向的是不一樣的(或許可以看看你所不知道的 JS｜範疇與Closures，this與物件原型 (You Don't Know JS: this & Object Prototypes) ，或是看看其他人寫的 JS 的 this ， 就知道不止是在這裡，JS 的世界 this 也要知道在哪裏的)，所以當你模組化時，如果有說 prototype 找不到之類的通常就是 this 指向的不是你想的那個或是你現在使用的沒有你預設他會有的東西

或許有點抽象，但這種東西就是自己試着 module ，這樣才能更感同身受的知道在拆分的過程需要注意的地方與技巧

這邊附上我拆分完的 github，明天再來講講我還加了一些東西