[기술면접]Section1 기술면접 준비

인트로

부트캠프 기술면접 준비용 포스트입니다.

매우 주관적인 생각도 들어가있으니 주의해주세요.

잘못된 내용이 있다면 댓글 달아주시면 정말 감사하겠습니다.

---

li 요소는 왜 ul 요소의 자식요소여야만 하나요? (선택)

한 줄 설명: li는 목록의 항목을 나타내는 태그이고 ul은 비정렬 목록을 나타냅니다. 

ul과 함께 사용하지않은 li는 목록의 항목을 나타내는 것이 아니라 그냥 항목을 늘여놓은 것과 다를바가 없습니다.

따라서 li는 문법적으로 부모 요소와 함께 사용해야합니다. 이때 가능한 부모 요소로는 ul, ol, menu 태그가 있습니다.

 

menu : 사용자가 수행하거나 하는 명령의 묶음 ex) cut, copy, paste

개인적인 생각

부모 요소와 함께 사용하지 않고 li를 늘여놓으면 어떤 목록의 항목인지 구별하기 힘듭니다.

식당의 메뉴에서 음료, 디저트가 목록 구별없이 써있다면 원하는 항목을 찾기 힘들 것입니다. 목록으로 구별해주어야 해당 항목의 의미를 명확히 할 수 있습니다. 구별해주지않는다면 요소들을 구분하기 힘듭니다.

번외 ) ul에 자식 요소가 있어야하는 이유

ul는 플로우 콘텐츠입니다.

플로우 콘텐츠는 보통 자식으로 텍스트나 내장 콘텐츠를 포함합니다.

플로우 콘텐츠가 모델인 요소는 적어도 하나의 뚜렷한 노드가 있어야합니다.

하나 이상 li 요소를 자식으로 두었을 때 뚜렷한 콘텐츠가 됩니다.

ul의 자식요소가 없을 경우 뚜렷한 콘텐츠와 플로우 콘텐츠의 조건을 만족하지 못합니다.

 

뚜렷한 콘텐츠 : 내용이 비어있거나 숨겨지지 않은 경우 뚜렷한 콘텐츠입니다.

내장 콘텐츠 : 다른 리소스를 가져오거나, 콘텐츠를 다른 마크업 언어, 네이스페이스로부터 문서에 삽입합니다.

ex) audio, video, embed, iframe, img 태그 등

멘토 피드백

시맨틱한 부분에 대한 내용이 있어야한다. 

스스로 피드백

질문에 대한 명확한 레퍼런스를 찾지 못해 신청을 하게 되었는 데 피드백도 받고 좋은 선택이었던 것 같다.

오히려 HTML 관련 질문에 답변을 더 못할 수도 있겠다는 생각을 했기에 위 질문을 선택하게 되었다.

준비한 내용에서 말을 추가하려다보니 오히려 하려고 하던 말의 순서가 섞이는 느낌이 들었음.

조금더 천천히 생각하면서 말을 하더라도 완성된 문장을 말하는게 좋을 것 같다. 

 

너무 많은 정보를 쏟아내려고 하는 것보다 작은 정보라도 완벽하게 전달하는 연습을 지금부터 하는게 좋을 것 같다.

 

얕은 복사와 깊은 복사에 대해서 설명해주세요.

한 줄 설명 : 

얕은 복사는 객체를 할당한 변수를 다른 변수에 할당하는 것을 말합니다. === 참조값(주소값)을 복사

깊은 복사는 원시 값을 할당한 변수를 다른 변수에 할당하는 것을 말합니다. === 실제 값을 복사

 

원시 값 : 변경 불가능한 값, 원시 값을 변수에 할당하면 변수에는 실제 값 저장

객체 타입의 값 : 변경 가능한 값, 객체를 변수에 할당하면 변수에는 참조 값 저장

핵심포인트

객체의 경우 : 얕은 복사는 한 단계까지만 복사하지만 깊은 복사는 객체에 중첩되어있는 객체까지 모두 복사합니다.

 

원시값을 다른 변수에 할당할 때 그 값을 다른 독립적인 메모리 공간에 할당하기 때문에, 복사를 하고 값을 수정해도 기존  원시값을 저장한 변수에 영향이 없습니다. (깊은 복사)

 

참조값을 복사할 때는 복사된 변수가 객체에 저장된 주소값을 복사하게 됩니다. 그래서 복사를 하고 객체를 수정하면 기존 객체를 저장한 변수에 영향을 줍니다. (얕은 복사)

객체를 복사하려면?

spread syntax (중첩된 구조는 복사가 불가능)

배열 : slice()

객체 : Object.assign()

깊은 복사를 하려면 어떻게 하는가

JSON.parse, JSON.stringify를 이용하면 됩니다.

JSON.stringify는 객체를 json 문자열로 변환합니다. 이때 원본 객체와의 참조가 끊어집니다.

JSON.parse()를 이용해 원래 객체로 만들어주면 깊은 복사가 가능합니다.

그러나 이또한 예외가 있습니다. 중첩된 객체된 참조 자료형 중 함수가 포함될 경우 함수가 null로 바뀝니다.

 

외부 라이브러리 사용

Lodash와 같은 라이브러리를 사용하면 더 쉽고 안전하게 깊은 복사를 할 수 있습니다.