자바스크립트 질문 9가지

첫 질문은 '자바와 자바스크립트가 어떻게 다른가' 하는 자스와 전혀 상관 없는 질문이라 뺐다. (마치 '코와 코끼리가 어떻게 다른가')

참고한 medium 자료🥟

2. What are the differences between let, const, and var?
   This question assesses your knowledge of variable declaration in JavaScript.

키워드: 호이스팅, 스코프, 재할당

3. Explain hoisting in JavaScript.
   선언문을 위로 끌어올리는 동작

4. What is the difference between == and === operators?
   값만 보느냐 타입까지 보느냐

5. What is the event loop in JavaScript?
   자스는 호출 스택 하나 -- 비동기로 극복
   브라우저 비동기 실행 로직: 이벤트 핸들러, 통신 함수, 타이머 함수
   이 셋은 실행되면 브라우저 뒤편으로 던져져 콜백 큐로 이동한다.
   호출 스택의 동기적 코드가 모두 실행되어 호출 스택이 비워지면
   콜백 큐의 내용들을 호출 스택으로 이동시키는 이 메커니즘

6. What is a closure in JavaScript?
   외부 함수가 종료되어도 내부 함수가 여전히 외부 함수의 지역 변수를 참조할 수 있는 현상
   예: 리액트의 useState, for문에서 맨 마지막 값만 나오는 오류 해결

7. Explain the concept of prototypal inheritance.
   프로토타입: 자스 인스턴스가 모두 갖고 있는 상위 개념의 인스턴스.
   여기에 생성될 인스턴스들이 공통으로 갖게 될 상태와 메서드를 선언해두면
   만들어지는 인스턴스마다 중복으로 선언할 필요가 없어진다.

8. What are the differences between call, apply, and bind?
   셋 다 this의 명시적 바인딩을 위한 메서드
   call은 컴마(인수를 하나씩 넘김), apply는 배열로 한번에 넘긴다.
   또 call과 apply는 바인딩 후에 알아서 실행까지 해주지만 bind는 따로 실행을 안 해줘서 명시적으로 소괄호를 붙여 호출까지 해줘야 한다.

9. How does asynchronous programming work in JavaScript?
   자스는 기본적으로 호출 스택이 하나
   호출 스택이 하나라는 것은 원래 한번에 하나의 동작밖에 못 한다는 뜻
   자스에서는 이거를 '비동기'라는 개념으로 해결하고 있다.
   비동기는 순서가 보장이 안 되지만 먼저 완료되는 게 먼저 실행되어 blocking이 없다는 장점이 있다.
   답에 있던 세 가지 개념: callback, Promise, async/await

10. What are some techniques to optimize JavaScript performance? (이 질문만 새로 공부)

• DOM 조작 최대한 줄이기 (DOM 최대한 덜 건드리기)
• 반복문 최적화 (최대한 반복을 덜 하게 -- while문 무한 루프? xx)
• 변수 캐싱
• 이벤트 위임 (모든 하위 DOM에 이벤트를 다 등록하는 게 아니라 상위에 하나만 등록)
• 네트워크 요청 횟수 줄이기 (캐싱과 이어짐, 이미 받은 데이터를 캐싱(저장)해두고 기존에 데이터가 이미 있으면 동일한 요청을 하지 않는 식으로 최적화)
  • 구현했던 예: 자동완성 검색 구현할 때 검색어에 따라 API를 요청 - 검색했던 검색어를 저장해두고 새로 입력한 검색어가 이전 검색어 중에 있으면 따로 API 요청을 하지 않고 저장된 데이터를 사용하도록 함 (콘솔로 확인)