컴포넌트의 선언부와 실행부를 분리하기 위해서 입니다
약 2주째 vanila js로 프로그램을 따라 만들어보고, 프로젝트를 만들어 보고 있다. 그때마다 강사님께서는 App.js와 main.js를 분리해서 만드셨다. 수업 초반에 "왜 이 둘을 분리해서 쓰는지 생각해보세요." 라는 말을 한적이 있다. 사실 수업을 들으면서 main.js가 하는 역할이 App의 state 초기 데이터를 만들고, App 인스턴스를 생성하는 기능이 대부분이라 굳이 나누지 않고, 그냥 App.js에서 모든 것을 다하도록 하면 안되나 하는 생각도 해봤다. 어쨌든 강사님께서 생각해보라는 이유는 분명히 있을거라 생각해 몇일동안 고민해봤다.
(대략적인 코드 구성은 다음과 같다)
<body>
<script src='./src/main.js', type='module'></script>
</body>import App from './App.js'
export default function main(){
...
new App()
}export default function App(){
...
}그래서 낸 결론은 javascript에는 main()가 존재하지 않기 때문이라고 생각했다. java, C 등의 컴파일러 기반의 언어가 모두 main함수를 우선적으로 실행하기 때문에 어떤 함수가 main함수인지 별도로 구분할 필요가 없다. 특히, 자바의 경우 main()가 있는 클래스 이름과 프로젝트 이름이 반드시 일치해야 하기 때문에 어디서 실행되야 하는지 명확하다. 그래서 javascript에 main.js를 만들어 가장 먼저 실행되게 끔 코드를 구성한 것이라 생각했다.
오늘 수업에서 결국엔 분리한 이유를 알 수 있었다. 내가 생각한 이유가 일부 맞긴 했다. 그러나 궁궁적인 이유는 컴포넌트의 선언부와 실행부를 분리하기 위해서였다. 분리의 목적은 'App컴포넌트를 여러개 생성할 수 있다는 것'과 유지보수 측면에서 둘을 분리하는게 '코드의 흐름을 따라가는데 유리'하기 때문이다.
맞는 말이었다. 코드가 단순한 경우 큰문제가 안되지만, 복잡하고 고도화된 코드에서 선언부와 실행부가 뒤섞여 있으면 복잡도가 증가하게 되고 이는 궁극적으로 유지보수 난이도를 불필요하게 어렵게 만드는 요소가 될 수 있다.
컴파일러 기반의 언어로 프로젝트를 하면서 경험적으로 알고 있던 내용이었는데 언어가 바뀌면서 그 이유를 제대로 떠오르지 못했다는게 스스로에게 아쉬웠다. 아마 좀더 많은 프로젝트 경험이 필요하다는 의미가 아닐까 싶다. 앞으로는 프로그래밍을 하면서 코드에 합리적인 의도와 의미를 부여하는 연습을 해봐야 겠다. 단순 코더가 아닌 프로그래머가 되야하니까!
