---
id: javascript-while-loop
title: "JavaScript While Loop"
category: "Frontend"
status: "draft"
verification_status: "conceptual"
canonical_id: ""
aliases: ["while loop", "do while", "JS while loop", "condition loop", "do while loop"]
duplicate_of: ""
source_trust_level: "B"
confidence_score: 0.89
created_at: 2026-06-23
updated_at: 2026-06-23
review_reason: ""
merge_history: []
tags: ["javascript", "js", "web", "frontend", "w3schools", "while-loop", "do-while", "loops", "iteration"]
raw_sources: ["https://www.w3schools.com/js/js_loop_while.asp"]
applied_in: []
github_commit: ""
---

# [[JavaScript While Loop]]

## 🎯 한 줄 통찰 (One-line insight)
A `while` loop runs a block of code as long as a condition is true; its `do/while` variant guarantees the block runs at least once before the condition is checked. [S1]

## 🧠 핵심 개념 (Core concepts)
- **Condition-driven repetition** — the `while` loop loops through a block of code as long as a specified condition is true. [S1]
- **Two while forms** — JavaScript offers the `while` loop and the `do/while` loop. [S1]
- **`do/while` runs once first** — it executes the code block once before checking the condition, then repeats while the condition is true. [S1]
- **Runs at least once** — `do/while` runs at least once, even if the condition is false from the start. [S1]
- **Infinite-loop hazard** — forgetting to increase the condition variable means the loop never ends and crashes the browser. [S1]

## 🧩 추출된 패턴 (Extracted patterns)
- **Advance the counter inside the body** — increment the loop variable (`i++`) within the block so the condition eventually fails. [S1]
- **Truthy-element traversal** — loop while `cars[i]` is truthy to walk an array until it runs out of elements. [S1]
- **`for` ↔ `while` equivalence** — a `for (;cars[i];)` loop and a `while (cars[i])` loop express the same iteration. [S1]

## 📖 세부 내용 (Details)
**Introduction** [S1]
While loops execute a block of code as long as a specified condition is true. JavaScript offers two while loop types: the `while` loop and the `do/while` loop.

**The while loop** [S1]
The `while` loop loops through a block of code as long as a specified condition is true.
```javascript
while (condition) {
  // code block to be executed
}
```
```javascript
while (i < 10) {
  text += "The number is " + i;
  i++;
}
```
Warning: If you forget to increase the variable used in the condition, the loop will never end. This will crash your browser.

**The do/while loop** [S1]
The `do/while` loop is a variant of the while loop. This loop will execute the code block once, before checking if the condition is true, then it will repeat the loop as long as the condition is true.
```javascript
do {
  // code block to be executed
}
while (condition);
```
```javascript
do {
  text += "The number is " + i;
  i++;
}
while (i < 10);
```
The `do while` runs at least once, even if the condition is false from the start.

**Comparing for and while** [S1]
Using a `for` loop to traverse a cars array:
```javascript
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";

for (;cars[i];) {
  text += cars[i];
  i++;
}
```
The same loop expressed as a `while` loop:
```javascript
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";

while (cars[i]) {
  text += cars[i];
  i++;
}
```

## 🛠️ 적용 사례 (Applied in summary)
The page's own snippets are the canonical applied examples — accumulating numbers while `i < 10` in both `while` and `do/while` forms, and traversing a `cars` array while `cars[i]` is truthy. No external project/commit applications found in the source.

## 💻 코드 패턴 (Code patterns)
Standard while loop:
```javascript
while (i < 10) {
  text += "The number is " + i;
  i++;
}
```
Do-while (runs at least once):
```javascript
do {
  text += "The number is " + i;
  i++;
}
while (i < 10);
```
Truthy-element array traversal:
```javascript
while (cars[i]) {
  text += cars[i];
  i++;
}
```

## ⚖️ 비교 및 선택 기준 (Comparison & decision criteria)
- **`while` vs `do/while`** — use `do/while` when the block must run at least once regardless of the initial condition; use `while` when the block should be skipped entirely if the condition is false at the start. [S1]
- **`for` vs `while`** — the two are interchangeable for condition-only iteration (`for (;cars[i];)` equals `while (cars[i])`); choose based on whether you want the init/update folded into the header. [S1]

## ⚖️ 모순 및 업데이트 (Contradictions & updates)
No contradictions found in the source.

## ✅ 검증 상태 및 신뢰도
- **상태:** draft
- **검증 단계:** conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
- **출처 신뢰도:** B (W3Schools — widely used educational reference, not a primary standards body)
- **신뢰 점수:** 0.89
- **중복 검사 결과:** 신규 생성 (New discovery)

## 🔗 지식 그래프 (Knowledge Graph)
- **상위/루트:** [[JavaScript Tutorial]]
- **관련 개념:** [[JavaScript Loops]], [[JavaScript For Loop]], [[JavaScript Break]], [[JavaScript Booleans]]
- **참조 맥락:** The condition-driven iteration construct; companion to the counted [[JavaScript For Loop]].

## 📚 출처 (Sources)
- [S1] W3Schools — JavaScript While Loop — https://www.w3schools.com/js/js_loop_while.asp

## 📝 변경 이력 (Change history)
- 2026-06-23: Initial draft synthesized from the W3Schools "JavaScript While Loop" page (Astra wiki-curation, P-Reinforce v3.1 format).