템플릿 표현식 내 코드가 길어질 경우 가독성이 떨어지고 유지보수가 어려워진다. 이럴 때 계산된 속성인 computed를 사용 !
예를 들어 템플릿 내에서
<template>
<p> 강의가 존재해요? </p>
<span>{{teacher.lectures.length >0? 'YES':'NO'}}</span>
</template>지금은 계산된 속성이 1개이지만, 사용자의 레벨 등 복잡해지는 계산이 많아진다면 computed로 분리하여 작성해주는 것이 좋다.
그리고 computed내에 선언하는 것과 method 내에 선언하는 차이에 대해서도 잘 인지를 해둬야할 것 같다.
이번에 사용자 이름 출력하는 부분에서 난 method에 작성해뒀다 computed로 옮겨 코드로직을 수정했는데 이 부분과 더불어 생각해보는 게 좋을 것 같아 써본다.
computed 는 한번 계산된 결과를 보관하고 있기때문에 재렌더링되면 이 결과를 돌려주고,
method는 실행될 때마다 계산이 된다.
그러니 computed가 성능면에서 훨씬 유리하다!
그리고 computed는 기본적으로 getter전용이다(읽기전용).
