Feed Step 10 - amorfati0310/javascript-vm GitHub Wiki
์ง๊ธ ๊ตฌ์กฐ์์๋
controller ์ ์ด๋ฐ ๋ฉ์๋๋ค์ด ์ด๋์ ์ด๋ป๊ฒ ๋ถ๋ฆฌ๋์ง ์์๊ฐ ์์ด์ ์ฝ๊ฐ ๋ต๋ตํ๋ค์.
๊ทธ๋ฆฌ๊ณ ๋ฉ์๋ ์ด๋ฆ์ด '๋ฉ์์ง'์ ์ผ์น์ํจ ๊ฑด ๋๋ฆ๋๋ก์ ์์ด๋์ด๋ก ๋ณด์ฌ์.
๋ค๋ง ์ด๋ฆ๊ณผ ๋ฉ์์ง๋ช
์ ์ผ์น์์ผ์ผ ํด์ ์ด๋ฆ์ด ๋ณ๊ฒฝ๋๋ฉด ์์ชฝ์ ๋ชจ๋ ์์ ํด์ผ ํ๋ ์ด์๊ฐ ์์ ๊ฑฐ ๊ฐ๋ค์.
๋ฌผ๋ก ์ด๋ ๊ฒ ๊ตฌํํด๋ ํฐ ๋ฌธ์ ๊ฐ ์๋ ๊ฑด ์๋๊ณ ์.
ํผ๋ ๋ด ์๊ฐ
- ใ ใ bind๋๊ฑฐ๋ observable๋ก ํ ๋ถ๋ถ์ ์ด๋ป๊ฒ ์ฝํ์๋์ง๊ฐ ๋ณด์ธ๋ค. ๊ทธ๋ฐ๋ฐ ์ง๊ธ ์ฝ๋์์๋ emit์ ํ๋ ๋ถ๋ถ์ด ๋ค model์ด๋ view์์๋ง ๋ํ๋์ ธ ์๋ค. ์ปจํธ๋กค๋ฌ์์ ํ์ ํ๊ธฐ ์ด๋ ค์ด ๋ฌธ์ ๊ฐ ์๋ค
๋ฌธ์ ๋ ์ธ์ํ๋๋ฐ ์ด๋ป๊ฒ ํด๊ฒฐํ ์ ์์๊น?.? ...
observable notify์ ๋น์ท emit์์ eventName๊ณผ data์ ๋ณด๋ด์ฃผ๋ ๊ฒ๊ณผ ์ง๋ณธ observable ํจํด์์๋ data, type type์ผ๋ก method๋ฅผ ๊ตฌ๋ถ์ํค๋ ๊ฒ ๋ง์ด ํก์ฌ ํจ
initRender(){
this.vendingMachineViewInitRender()
this.walletViewInitRender()
}
vendingMachineViewInitRender(){
const snackList = this.vendingMachine.getSnackList()
this.vendingMachineView.initRender(snackList)
}
walletViewInitRender(){
const myMoney = this.wallet.getMyMoney();
const toatlMoney = this.wallet.getTotalMoney()
this.walletView.initRender(myMoney, toatlMoney);
}
๋ฅ๋์ ์ผ๋ก ๋ ๋๋ง์ ํ๋ค. data๋ฅผ ์ง์ ๋ฃ์ด์ค๋ค. ์ด๊ฒ ๋ง๋ ๊ฑด์ง ?
document.addEventListener("DOMContentLoaded", (e)=> {
console.log("DOM fully loaded and parsed");
// rendering
walletView.initRender(myMoney,wallet.getTotalMoney());
vendingMachineView.initRender(snackList);
});