기술 면접 예상 질문 모음-3

gyojinnK·2024년 1월 18일
post-thumbnail

Q1) var, let, const의 차이에 대해 알려주세요.

  1. var
    • 함수 스코프
      • ‘var’로 선언한 변수는 함수 스코프를 가지거나 전역 스코프를 가집니다.
    • 호이스팅
      • ‘var’는 호이스팅이 되어 변수 선언 이전에도 사용 가능합니다.
    • 재선언, 재할당 가능합니다.
  2. let
    • 불록 스코프
      • ‘let’은 블록 레벨의 스코프를 가집니다.
      • ‘if’나 ‘for’문 같은 블록 내에서만 유효합니다.
    • 호이스팅
      • 호이스팅은 있지만 초기화 전에 접근할 수 없습니다.
      • 선언은 끌어올려지지만 초기화 전에는 ‘referenceError’가 발생합니다.
    • 재할당이 가능합니다.
  3. const
    • 블록스코프
      • 블록스코프를 가집니다.
    • 호이스팅
      • 호이스팅은 있지만 초기화 전에 접근 불가합니다.
    • 재할당이 불가합니다.

💡 핵심 키워드 : 호이스팅, 재선언, 재할당

예시 답안(짧은 버전)
ar로 선언한 변수는 재선언과 재할당이 가능하며, 함수 스코프를 가지고 있어 함수 내에서만 유효합니다. 반면에 let은 변수를 재선언하지 못하지만 재할당은 가능합니다. const는 변수를 재선언하거나 재할당할 수 없으며 한 번 할당한 값은 변경할 수 없습니다. const와 let은 블록 스코프를 가지고 있어 중괄호 내에서만 유효합니다.


Q2) Async/Await와 Promise의 차이에 대해 설명해주세요.

핵심 키워드 : 비동기 처리, 콜백 지옥, 예외 처리

  • Async/Await
    • 동기 코드처럼 작성 가능
      • await 키워드 사용
      • 비동기 작업이 완료될 때까지 함수의 실행을 일시적으로 중단
    • try catch 블록
      • 에러 처리 용이
      • 가독성 향상
  • Promise
    • 비동기 작업의 최종 완료 또는 실패를 나타내는 객체
    • then(), catch() 메서드로 성공/실패 시 로직 분리 가능
      • 여러 개의 then()을 연결하여 비동기 작업 순차적으로 처리 가능

예시 답안
Async/Await와 Promise는 모두 자바스크립트에서 비동기 처리를 위한 방법입니다. 사용 방식과 가독성에 차이가 있습니다.
비동기란 프로그램이 특정 작업을 완료하는 동안 다른 작업을 동시에 수행할 수 있게 하는 처리 방식을 말합니다.
Promise는 비동기 작업의 최종 완료 또는 실패를 나타내는 객체입니다.
.then() .catch() 메서드를 사용하여 비동기 작업이 성공했을 때와 실패했을 때의 로직을 분리할 수 있습니다.
여러 개의 .then()을 연결하여 비동기 작업을 순차적으로 처리할 수 있습니다.Async/Await 비동기는 코드를 마치 동기 코드처럼 작성할 수 있습니다.async 함수 내에서 await 키워드를 사용하면 해당 비동기 작업이 완료될 때 까지 함수의 실행을 일시적으로 중단합니다.try catch 블록을 사용하여 에러 처리를 할 수 있으므로 가독성이 높아지고, 에러를 쉽게 잡을 수 있습니다.


Q3) Arrow Function 이란 무엇인지 설명해주실 수 있을까요?

  • Arrow Function (화살표 함수)
    • ES6에서 도입
      • this의 동작을 더 명확하기 하기 위한 목적
    • 함수 선언을 간결하게 함
      • ex) const test = () => {}

+) 일반 함수에서의 this는 전역 객체

  • 화살표 함수 내에서 this
    • 함수가 정의된 시점의 상위 스코프의 this를 유지
      • 즉, 화살표 함수 내의 this는 lexical scope

예시 답안
ES6에서 도입된 Arrow Function(화살표 함수)는 함수 선언을 간결하게 하고 this의 동작을 더 명확하기 하기 위한 목적으로 등장했습니다.
일반 함수에서의 this는 전역 객체를 가르킵니다.
(예: 브라우저 환경에서는 ‘window’ 객체)
하지만 화살표 함수에서의 this는 함수가 정의된 시점의 상위 스코프의 this 값을 유지합니다. 즉 화살표 함수 내의 this는 lexical scope를 따르게 됩니다.
이로인해 this가 더 예측 가능하고 일관성 있게 동작할 수 있다는 장점이 있습니다.


profile
기록하고 꺼내보고

0개의 댓글