javascript 프레임워크 모듈화된 두 가지 쓰기

쓰기 1: (객체 형식)

var Garu = {};
Garu.val = "Garu"; //  
Garu.init = function(){ //  
  console.log("Garu init");
}

/*
  Garu.World
*/
Garu.World = {};
(function(){
  var World = Garu.World;
  World.val = "World"; // World 
  World.init = function(){ // World 
    console.log("Garu.World init");
  }
})();

/*
  Garu.Render
*/
Garu.Render = {};
(function(){
  var Render = Garu.Render;
  Render.val = "Render"; // Render 
  Render.init = function(){ // Render 
    console.log("Garu.Render init");
  }
})();

Garu.init(); //  
console.log(Garu.val); //  

var World = Garu.World;
World.init(); //  
console.log(World.val); //  

var Render = Garu.Render;
Render.init();
console.log(Render.val);

쓰기 2: (클래스 + 원형 체인 + 대상 형식)

var Garu = (function(){
  function Garu(){
    this.val = "garu"; //  
  }
  
  Garu.prototype.init = function(){ //  
    console.log("Garu init");
  }
  
  var World = Garu.prototype.World = {};
  World.val = "World"; // World 
  World.init = function(){ // World 
    console.log("Garu.World init");    
  }
  
  var Render = Garu.prototype.Render = {};
  Render.val = "Render"; // Render 
  Render.init = function(){ // Render 
    console.log("Garu.Render init");    
  }
  
  return Garu;
})();

var Garu = new Garu();
Garu.init();
console.log(Garu.val);

var World = Garu.World;
World.init();
console.log(World.val);

var Render = Garu.Render;
Render.init();
console.log(Render.val);