[TIL] 240806 (최종 프로젝트 모바일 결제 기능 완료)

·2024년 8월 6일

TIL

목록 보기
121/268
post-thumbnail

🥞 오늘 한 일

  • 최종 프로젝트
    • 디자인 적용
      • 공유 모달
      • 공유 버튼
      • 공구템 쪽 글씨 크기 수정
    • 모바일 결제 기능 완료
    • 추가 기능 3차 기획
    • 개별 모의 면접 자료 작성
    • UT 테스트 인스타, 지인 배포
    • 공구 종료 시 공유 버튼 삭제
    • 공구템 버튼 height 맞추기
  • 기술면접 연습

기술면접 연습

클로저에 대해 설명해주세요.

데이터 은닉화 및 캡슐화를 구현할 수 있는 개념입니다. 자바스크립트에서 작업이 종료되어 호출 스택에서 빠져나오게 되면 참조가 사라져 메모리에서 사라지는데, 호출 스택에서 빠져나왔지만 특정 행동에 의해 참조가 사라지지 않을 경우 일종의 유령 상태가 됩니다. 남용할 경우 메모리가 누수될 수 있는 단점도 있습니다.

html에서 자바스크립트 코드를 로딩하는 script 태그는 보통 body 태그의 최하단에 위치하는데요. 그 이유가 무엇일까요?

브라우저는 html을 읽다가 script 태그를 만나면 해당 자바스크립트 코드를 읽고 실행하기 시작하기 때문에 페이지의 로딩이 느려질 수 있고, 또한 해당 script에 html 태그를 가져오는 코드가 있다면 아직 DOM 트리 구축 전이라 undefined가 나올 수 있으므로 최하단에 위치합니다. script 태그에 defer나 module을 작성하면 script 태그를 지연 로딩할 수 있습니다.

여러 비동기 함수를 동시에 병렬로 호출하기 위해서는 어떻게 해야 할까요?

async await을 사용해 데이터를 불러오게 되면 순차적으로 데이터를 불러오는데, Promise.all() 함수를 사용하면 함수의 인자로 넘겨준 비동기 함수를 병렬로 실행할 수 있습니다.

🍴 돌아보기

캠프에 관련되어 있기는 하지만, 면접 자료 준비 및 UT 테스트 부탁(?), 그리고 또 다시 추가 기능을 기획하느라 코드 자체는 많이 치지 못한 날이었다. 하지만 이 역시 꼭 필요한 과정이었기 때문에 아쉬움이 남지는 않는다. 그래도 내일은 코드 많이 치고 싶다...!

🍳 내일 목표

  • 최종 프로젝트
    • 인풋에 잘못된 값 입력 시 아래 오류 문구 띄우기
    • 럭키박스 갯수 가져와서 랜딩 페이지에서 몇 개 남았는지 수정
profile
웹 프론트엔드 개발자

0개의 댓글