Vue를 공부하면서 헷갈리는 data에 대해서 정리하고자 한다. 처음 Vue.js 튜토리얼을 통해 공부를 하면 인스턴스에 대해서 배운다. 인스턴스는 대략 다음과 같은 구조를 가지는데 보면 인스턴스(좌)는 data가 객체로 선언되어 있다. 해당 객체에 몇개의 데이터든 집어 넣고 필요할때마다 꺼내 쓸 수 있는 방식이다. 그런데 컴포넌트(우)를 보면 data가 객체가 아닌 함수로 이루어져 있는 것을 알 수 있다. 왜 다를까? 무언가 이유야 있으니 다른거겠지만, 모르고 쓰면 헷갈려서 정리를 하고자 한다. 우선 컴포넌트를 사용하는 이유를 알면 간단하다. 컴포넌트를 이용하는 이유는 필요할 때 마다 인스턴스를 작성하는 것이 아닌 필요할 때마다 꺼내 쓰는 재사용성을 위함이다. 만약 컴포넌트를 사용하지 않는다면 필요할 ..