기술·IT

자바스크립트 퀴즈

JS 핵심 문법·비동기·DOM 개념 10문항

10문항 · 4지선다 · 해설 포함

자바스크립트 퀴즈 문항 · 정답 해설

전체 10문항의 정답과 해설입니다. 아직 풀지 않았다면 위에서 먼저 풀어보세요.

정답 · 해설 전체 보기 (스포일러)
  1. Q1. JavaScript에서 var, let, const의 주요 차이는?

    • var는 함수 스코프, let/const는 블록 스코프이며 const는 재할당 불가 (정답)
    • 이름만 다를 뿐 동작에 차이가 없는 키워드
    • let이 셋 중 가장 먼저 도입된 오래된 키워드
    • const로 선언하면 값을 자유롭게 바꿀 수 있다

    var는 함수 스코프·호이스팅, let은 블록 스코프·재할당 가능, const는 블록 스코프·재할당 불가입니다. ES6 이후 var 대신 let/const 사용을 권장합니다.

  2. Q2. JavaScript에서 == 와 === 의 차이는?

    • ===는 검사가 많아 항상 더 느리게 동작한다
    • 비교 방식이 같아 결과에 차이가 없다
    • ==는 타입 변환 후 비교, ===는 타입까지 엄격히 비교 (정답)
    • ==가 타입을 맞춰주므로 더 안전하다

    == (동등)은 타입 강제 변환 후 비교(1 == "1" → true), === (일치)는 타입까지 같아야 합니다(1 === "1" → false). 버그 방지를 위해 ===를 권장합니다.

  3. Q3. Promise.all()의 동작은?

    • 가장 먼저 완료된 Promise 하나의 결과만 반환
    • 배열에 담긴 순서대로 하나씩 차례로 실행
    • 가장 오래 걸리는 것만 기다리고 나머지는 취소
    • 모든 Promise가 완료(resolve)되면 결과 배열 반환, 하나라도 실패시 reject (정답)

    Promise.all()은 전달된 모든 Promise가 resolve될 때 결과 배열을 반환합니다. 하나라도 reject되면 전체가 즉시 reject됩니다. 병렬 비동기 작업에 유용합니다.

  4. Q4. JavaScript에서 클로저(Closure)란?

    • 클래스를 초기화할 때 호출되는 생성자 함수
    • 함수가 자신이 생성될 때의 외부 변수(스코프)를 기억하는 것 (정답)
    • this를 바인딩하지 않는 화살표 함수 문법
    • 어디서나 전역 변수에 접근할 수 있는 성질

    클로저는 함수가 선언될 당시의 렉시컬 스코프를 기억해 외부 함수가 종료된 이후에도 해당 변수에 접근할 수 있는 기능입니다. 데이터 은닉과 팩토리 함수에 활용됩니다.

  5. Q5. async/await의 역할은?

    • Promise를 동기처럼 읽기 쉽게 작성하는 문법 (정답)
    • 기존의 동기 코드를 비동기로 바꿔주는 문법
    • 여러 스레드를 만들어 병렬로 처리하는 문법
    • 콜백 함수로는 대체가 불가능한 전용 문법

    async/await는 Promise 기반 비동기 코드를 동기 코드처럼 읽기 쉽게 작성하는 ES2017 문법입니다. async 함수 안에서 await로 Promise 결과를 기다립니다.

  6. Q6. JavaScript에서 이벤트 버블링(Event Bubbling)이란?

    • 조건에 따라 이벤트 자체가 취소되는 현상
    • 이벤트가 부모에서 자식 방향으로 내려가는 현상
    • 이벤트가 자식에서 부모 방향으로 전파되는 현상 (정답)
    • 이벤트 루프가 큐를 처리하는 순서를 뜻함

    이벤트 버블링은 특정 요소에서 발생한 이벤트가 부모 요소로 전파되는 현상입니다. event.stopPropagation()으로 전파를 막을 수 있습니다.

  7. Q7. DOM(Document Object Model)이란?

    • HTML 문서를 프로그래밍으로 조작할 수 있는 트리 구조 API (정답)
    • 데이터를 표 형태로 저장하는 데이터베이스 모델
    • 자바스크립트에 기본 내장된 표준 라이브러리
    • CSS 선택자를 해석해 요소를 찾는 엔진

    DOM은 HTML/XML 문서를 트리 형태로 표현한 프로그래밍 인터페이스입니다. JavaScript로 document.querySelector() 등을 통해 요소를 생성·수정·삭제할 수 있습니다.

  8. Q8. JavaScript에서 null과 undefined의 차이는?

    • 이름만 다를 뿐 같은 의미로 쓰이는 값
    • null은 의도적으로 없음을 나타냄, undefined는 값이 할당되지 않은 상태 (정답)
    • null이 예기치 않은 오류를 더 자주 일으킨다
    • undefined는 값이 아니라 에러의 한 종류다

    null은 개발자가 의도적으로 "없음"을 할당한 것, undefined는 변수를 선언했지만 값을 할당하지 않은 상태입니다. typeof null은 "object"(역사적 버그)입니다.

  9. Q9. 스프레드 연산자(...)의 주요 용도는?

    • 문자열의 글자 수를 세어 반환하는 연산자
    • DOM 요소를 선택하고 조작하는 연산자
    • 비동기 작업의 완료를 기다리는 연산자
    • 배열/객체를 펼쳐 복사·결합하거나 함수 인자로 전달 (정답)

    스프레드 연산자는 [...arr1, ...arr2]로 배열 결합, {...obj1, ...obj2}로 객체 병합, f(...args)로 배열을 함수 인자로 전달하는 등 다양하게 활용됩니다.

  10. Q10. localStorage와 sessionStorage의 차이는?

    • 저장할 수 있는 용량에만 차이가 있다
    • localStorage는 탭 닫아도 유지, sessionStorage는 탭 닫으면 삭제 (정답)
    • sessionStorage가 암호화되어 더 안전하다
    • 둘 다 브라우저가 아닌 서버에 저장된다

    localStorage는 브라우저를 닫아도 데이터가 영구적으로 유지됩니다. sessionStorage는 탭/창이 닫히면 삭제됩니다. 둘 다 클라이언트 사이드 저장소입니다.

자주 묻는 질문

Q. 자바스크립트 퀴즈는 몇 문제인가요?

10문제이며 문제마다 보기 4개 중 하나를 고릅니다. 전체 1분 정도 걸립니다.

Q. 자바스크립트 퀴즈 점수는 어떻게 매겨지나요?

맞힌 개수를 10문제 기준으로 환산해 점수와 정답률을 함께 보여줍니다. 문제를 풀 때마다 정답 여부가 바로 표시됩니다.

Q. 자바스크립트 퀴즈는 어떤 분야를 다루나요?

기술·IT 분야의 상식 문제로 구성했습니다 — JS 핵심 문법·비동기·DOM 개념 10문항.

Q. 틀린 문제의 해설을 볼 수 있나요?

네, 10문제 모두 해설이 붙어 있습니다. 보기를 고르면 정답과 함께 왜 그런지 바로 확인할 수 있습니다.

기술·IT 더 보기