1. 오늘 한 것 (What I Did)
1. 스위치문 학습
- 기본 문법과 구조 이해
- if-else와의 차이점 비교
- fall-through 현상과 break의 중요성
- 실제 코드 예시를 통한 활용법 학습
2. While문 동작 원리 파악
i--위치에 따른 실행 결과 차이 분석- 무한루프 방지 방법
- 초기값 → 조건 확인 → 실행 → 변경 순서의 중요성
3. 코드 디버깅 실습
- 문법 오류 찾기 (따옴표 불일치, 문자열 미완성)
- if-else 문법 오류 수정
- return문의 부적절한 사용 발견
4. JavaScript 기본 개념 정리
- var, let, const의 스코프 차이
- 호이스팅 개념과 함수 선언문 vs 표현식
- 자동 형변환 규칙 (특히 + 연산자)
- const 배열/객체 수정 가능 원리
5. MDN 공식 문서 읽기
- 문법과 자료형 문서 분석
- JavaScript 기본 실습 예제 이해
- DOM 조작과 이벤트 처리 기초
2. 새롭게 알게 된 것 (What I Learned)
1. while문에서 i-- 위치의 임팩트
// 원래 코드 (i-- 마지막): Countdown10, 9, 8, ..., 1, Blast off
// i-- 맨 위로 이동 시: 9, 8, 7, ..., 1, Blast off, -1핵심: 현재 값으로 작업한 후 변경 vs 변경한 후 새 값으로 작업의 차이
2. 스위치문 적용 기준의 명확한 구분
- 적합: 정확한 값 매칭 (
status === 'active') - 부적합: 범위 조건 (
score >= 70) switch (true)패턴은 가능하지만 비추천
3. JavaScript 형변환의 일관성 없는 규칙
"5" + 3 // "53" (문자열 연결)
"5" - 3 // 2 (숫자 계산)
"5" * 3 // 15 (숫자 계산)+ 연산자만 특별히 문자열 연결 우선
4. const의 진짜 의미
- 변수 자체의 재할당 금지
- 참조하는 객체/배열의 내용 변경은 가능
- "참조를 고정"한다는 개념
5. 호이스팅의 실제 동작 방식
// 함수 선언문: 완전 호이스팅 (선언 전 호출 가능)
// 함수 표현식: 변수만 호이스팅 (undefined 상태)
// let/const: temporal dead zone6. DOM 조작 시 요소 존재 확인의 중요성
let element = document.querySelector("selector");
if (element) { // 요소가 존재하는지 확인 후 조작
element.textContent = "내용";
}7. 이벤트 처리에서 함수 참조 vs 호출
// 잘못: button.onclick = myFunction(); (즉시 실행)
// 올바름: button.onclick = myFunction; (함수 참조)3. 여전히 모르겠는 부분 (What I'm Still Confused About)
1. 언제 어떤 문법을 선택해야 효율적인가?
- for vs while: 개인 선호라고 하는데 실제 기준이 궁금
- if-else vs switch: 경계선이 애매한 경우들
- 함수 선언문 vs 표현식: 호이스팅 외의 실무적 차이점
2. JavaScript의 "유연함"의 구체적 의미
- 문서에서 "믿을 수 없을 정도로 다재다능"이라고 하는데
- 다른 언어 대비 어떤 점이 특별히 유연한지
- 이 유연함이 실제 개발에서 어떤 장단점을 가져오는지
3. 스코프와 관련된 복잡한 상황들
// 이런 상황에서 변수가 어떻게 동작하는지
function outer() {
var a = 1;
function inner() {
var b = 2;
// a와 b에 접근 가능?
}
// b에 접근 가능?
}4. 이벤트 버블링/캡처링
- 개념은 이해했지만 실제 문제 상황과 해결법
- 언제 이것 때문에 문제가 생기고 어떻게 대처하는지
5. 동적 타이핑의 실무적 활용
- 타입이 자유롭게 바뀌는 게 언제 도움이 되고 언제 문제가 되는지
- TypeScript 같은 도구가 필요한 이유와 연결점