HTML - 문제 미리보기
문제 1032
hard
다음 localStorage 사용 코드의 실행 결과는?
```javascript
// 초기 상태: localStorage가 비어있음
if (localStorage.clickCount) {
localStorage.clickCount = Number(localStorage.clickCount) + 1;
} else {
localStorage.clickCount = 1;
}
console.log(typeof localStorage.clickCount);
console.log(localStorage.clickCount);
```
```javascript
// 초기 상태: localStorage가 비어있음
if (localStorage.clickCount) {
localStorage.clickCount = Number(localStorage.clickCount) + 1;
} else {
localStorage.clickCount = 1;
}
console.log(typeof localStorage.clickCount);
console.log(localStorage.clickCount);
```
정답: B
Web Storage의 중요한 특징을 이해하는 문제입니다:
핵심 포인트: localStorage는 모든 값을 문자열로 저장합니다
코드 실행 과정:
1. `localStorage.clickCount`가 없으므로 (undefined/falsy)
2. `else` 블록 실행: `localStorage.clickCount = 1`
3. 숫자 1이 저장되지만 자동으로 문자열 "1"로 변환됨
결과:
• `typeof localStorage.clickCount` → "string"
• `localStorage.clickCount` → "1" (문자열)
따라서 숫자 연산을 할 때는 반드시 `Number()`, `parseInt()` 등으로 형변환이 필요합니다.
핵심 포인트: localStorage는 모든 값을 문자열로 저장합니다
코드 실행 과정:
1. `localStorage.clickCount`가 없으므로 (undefined/falsy)
2. `else` 블록 실행: `localStorage.clickCount = 1`
3. 숫자 1이 저장되지만 자동으로 문자열 "1"로 변환됨
결과:
• `typeof localStorage.clickCount` → "string"
• `localStorage.clickCount` → "1" (문자열)
따라서 숫자 연산을 할 때는 반드시 `Number()`, `parseInt()` 등으로 형변환이 필요합니다.
💡 학습 팁
이 문제를 포함한 HTML 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.