map으로 배열을 만들지 않아도 괜찮을까요?
planet.forEach(planetName => {
/* html */
$('.space').insertAdjacentHTML(
'beforeend',
`<div class="solar_system"
data-planet-name="${planetName}">
<div class="planet ${planetName}">
<div class="overlay"></div>
<h2>${planetName}</h2>
</div>
</div>`
);
});이렇게 처음부터 forEach로 요소를 만들어도 괜찮나요?
답변 1
0
안녕하세요 jay k 님 :)
행성의 이름으로 태그 배열을 만들어서 insert하는 방법과
바로 태그를 생성하는 방법과는 기능적으로 차이가 없으므로 둘 다 사용이 가능합니다.
다만, 저는 컴퓨터 과학인 관심사의 분리 (Separation of concerns) 로 봤을 때
'태그를 생성하는 일' 과 '태그를 html에 붙여넣는 일' 은 엄연히 다르다고 생각했기 때문에 두가지의 기능을 분리 하여 따로 코드를 작성한 것 입니다 😄
여러 프레임워크 (vue, react, etc..)를 사용해보셨다면 더욱 이해가 쉬울 것 같습니다.
오늘날의 프로그래밍은 컴포넌트를 기준으로 하는 모듈 프로그래밍 방식을 주로 사용하고 있기 때문에
서로의 기능을 분리하여 관리하고 사용하는 관점으로의 접근이 필요합니다.
하지만 이는 정해진 규칙은 아니며 개발자의 성향과 회사의 개발 컨벤션에 따라 달라질 수 있습니다.
감사합니다 :)
1
친절한 답변 감사합니다 !
강의 멈추고 혼자 써보고 듣는식으로 수강하다보니 궁금한점이 많이 생기네요 😂
Part3도 오픈 하자마자 수강신청 했습니다 잘부탁드립니다 ! 🙇🏻
아래 질문 (토이스토리 title에 있는 button에 링크 거는 법)에 대한 해결방법이 이게 맞을까요? 더 좋은 방법이 있으면 알려주세요
0
57
1
토이스토리 practice에서 "WATCH NOW"버튼에 대한 href 속성값을 변경하는 방법
0
45
1
motionpath 플러그인에서 align의 자세한 역할 궁금합니다
1
80
2
선생님 알려주신 내용을 기반삼아 구현하고 싶은 UI가 있습니다.
1
197
2
set에 대해서 궁금증.
1
179
2
set에 대해서
1
143
2
gsap.set 은 어디에서 처음 배우는가요?
2
202
2
섹션 0, 버그와 리팩토링에서 아이콘 클릭시 진행률을 알아올 수 있나요??
1
146
1
GSAP 가이드 Part.02 강의 > 01 > practice html 맨처음 시작시 강의랑 동일하지 않을 경우
1
240
2
advanced 수업자료 문의
2
220
1
duration과 stagger
1
246
1
이미지 관련 사이트 문의드립니다.
1
215
1
노션 링크는 어디에 있는지 문의 드립니다~
1
369
1
SplitText를 순수 자바스크립트로 써봤어요
3
661
1
.left는 quickTo를 쓰지 않는 이유
2
344
1
[3D 텍스트효과(2)] GSAP을 위한 애니메이션 Timeline flow"기획", 이렇게 하면 될까요?
1
514
1
애니메이션 재생헤드를 처음으로...
2
307
1
forEach안에서 gsap을 사용할 때 이벤트가 한번밖에 안걸리는 문제
1
626
1
gsap.set() vs gsap.default()
1
361
1
dragger에서 #timeline이 드래그 되는 이유
1
234
1
강의 보던중 사용중인 툴이 궁금해서 여쭤봅니다.
1
340
1
안녕하세요 수업자료를 다운받았는데 중간중간 파일이 없어요 ㅠㅠ
1
404
1
안녕하세요 이렇게 나오는데..
1
415
1
이후에 출시될 강의엔 유료 플러그인이 사용되나요?
1
291
1