자바스크립트 기초

자바스크립트란? 실행 환경

자바스크립트가 어떻게 탄생했고 브라우저와 서버에서 어떻게 실행되는지 이해한다. 개발 환경을 설정하고 첫 코드를 실행해본다.

변수와 상수(let/const)

var의 문제점을 이해하고 let/const를 언제 써야 하는지 배운다. 호이스팅과 TDZ(일시적 사각지대) 개념을 통해 자바스크립트 변수의 동작 원리를 파악한다.

자료형과 형 변환

자바스크립트의 7가지 원시 타입과 참조 타입을 구분하고, 암묵적/명시적 형 변환의 규칙을 이해한다. typeof 연산자와 타입 체크 패턴을 익힌다.

연산자

산술·비교·논리·할당 연산자의 동작 원리를 정확히 이해하고, 단축 평가·옵셔널 체이닝·널 병합 연산자 등 현대 자바스크립트에서 자주 쓰이는 패턴을 익힌다.

조건문(if/switch)

if/else, switch, 삼항 연산자의 올바른 사용법과 패턴을 배우고, 조건문을 더 읽기 좋게 작성하는 리팩터링 기법을 익힌다.

반복문(for/while)

for, while, do...while, for...of, for...in의 각 사용 시나리오를 정확히 이해하고, break/continue/레이블의 동작을 익힌다. 무한루프를 피하는 안전한 반복문 작성법도 배운다.

함수 기초

함수 선언식과 표현식의 차이, 매개변수 기본값·rest 파라미터·arguments 객체를 이해한다. 순수 함수 개념과 함수를 일급 객체로 다루는 방법을 배운다.

화살표 함수와 스코프

화살표 함수의 간결한 문법과 this 바인딩 차이를 정확히 이해한다. 렉시컬 스코프와 클로저의 동작 원리를 익히고, 클로저를 실무에서 활용하는 패턴을 배운다.

배열 다루기

배열 생성, 인덱스 접근, 추가/삭제/검색 등 핵심 메서드를 배우고 스프레드 연산자와 구조분해로 배열을 다루는 현대적 패턴을 익힌다.

배열 메서드(map/filter/reduce)

map, filter, reduce, forEach, every, some, flatMap 등 배열 고차함수의 동작 원리와 체이닝 패턴을 완전히 이해한다. 실무에서 for문 대신 고차함수를 써야 하는 이유를 익힌다.

객체 기초

객체 리터럴 문법, 프로퍼티 접근, 메서드 정의, this 바인딩을 이해한다. 동적 프로퍼티, 프로퍼티 단축, 계산된 프로퍼티명 등 현대적 객체 문법을 익힌다.

객체와 구조분해

객체 구조분해 할당의 다양한 패턴을 익히고, 중첩 객체 분해, 기본값, 별칭, rest 수집을 자유롭게 활용한다. 함수 매개변수에서 구조분해를 쓰는 실무 패턴도 배운다.

문자열 다루기

자바스크립트 문자열의 불변성과 주요 메서드를 익힌다. 템플릿 리터럴 고급 활용, 정규표현식 기초, 그리고 문자열 파싱과 포맷팅 실무 패턴을 배운다.

DOM 이해하기

DOM 트리 구조를 이해하고 요소를 선택·생성·수정·삭제하는 방법을 배운다. style과 classList 조작, 속성 접근, 그리고 효율적인 DOM 조작 패턴을 익힌다.

이벤트 처리

addEventListener의 동작 원리와 이벤트 객체, 버블링/캡처링, 이벤트 위임 패턴을 이해한다. 폼 이벤트, 키보드/마우스 이벤트, 사용자 경험을 높이는 이벤트 처리 패턴을 익힌다.

비동기와 콜백

자바스크립트의 싱글 스레드 동작 방식과 이벤트 루프를 이해한다. 콜백 함수의 구조와 콜백 헬이 발생하는 이유, setTimeout/setInterval의 정확한 동작을 익힌다.

프로미스(Promise)

Promise의 세 가지 상태와 then/catch/finally 체이닝을 이해한다. Promise.all, Promise.race, Promise.allSettled 등 정적 메서드와 fetch API를 활용한 실전 패턴을 익힌다.

async/await

async/await 문법으로 비동기 코드를 동기처럼 읽기 좋게 작성하는 방법을 배운다. try/catch 에러 처리, 병렬 실행 최적화, 그리고 for...of와의 조합 등 실무 패턴을 익힌다.

모듈과 import/export

ES 모듈 시스템의 named export와 default export를 구분하고, import 다양한 문법을 익힌다. CommonJS와의 차이, 동적 import, 번들러의 역할을 이해한다.

종합 실습: 미니 프로젝트

지금까지 배운 자바스크립트 기초를 총동원해 투두리스트 앱을 처음부터 완성한다. DOM 조작·이벤트·배열·모듈·로컬스토리지를 통합하는 실전 경험을 쌓는다.