-
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
28강 수강 중 JSX 작성 방법에 대해 궁금해져서 질문 남깁니다!
23.01.05 16:55 작성 조회수 227
0
화면을 출력할 때,
강사님이 작성하신
const ItemComponents = orderType === "products" ? Products : null;
const optionItems = items.map((item) => (
<ItemComponents
key={item.name}
name={item.name}
imagePath={item.imagePath}
/>
));
return <div>{optionItems}</div>;
이 코드와
return (
<div>
{orderType === "Products"
? items.map((item) => (
<Products
key={item.name}
name={item.name}
imagePath={item.imagePath}
/>
))
: null}
</div>
);
제가 익숙하게 사용하는 방식인 이 코드의 차이점이 있을까요?
혼자 생각해봐도 차이점을 알 수 없어서 질문 남깁니다
성능상의 이점이나 코드를 읽기 수월해진다는 이점인지, 혹은 코드 스타일인지 궁금합니다! :)
좋은 강의 감사합니다!
답변을 작성해보세요.
1
John Ahn
지식공유자2023.01.05
안녕하세요!
v님
성능상의 이점은 없으며
아무래도 저 부분을 좀 더 특정해서
저 부분이 하는 일이 무엇인지 변수의 이름으로 정의를 해주기 때문에
저 특정 부분이 어떠한 부분인지 좀 더 자세히 알 수가 있게 됩니다!
v님이 작성해주신 코드도 너무 좋은 코드입니다!!
감사합니다!
답변 1