2nd/10_Wiki/Topic_JavaScript/JavaScript_If.md

---
id: javascript-if
title: "JavaScript If"
category: "Frontend"
status: "draft"
verification_status: "conceptual"
canonical_id: ""
aliases: ["JS if statement", "if statement", "nested if", "conditional execution", "logical AND in if", "if syntax"]
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", "if", "control-flow"]
raw_sources: ["https://www.w3schools.com/js/js_if.asp"]
applied_in: []
github_commit: ""
---

# [[JavaScript If]]

## 🎯 한 줄 통찰 (One-line insight)
Use the JavaScript `if` statement to execute a block of code when a condition is `true` — and `if` must be lowercase, since `If`/`IF` raise an error. [S1]

## 🧠 핵심 개념 (Core concepts)
- **`if` runs code when true** — use the `if` statement to execute a block of code when a condition is `true`. [S1]
- **Lowercase only** — `if` must be in lowercase; uppercase `If` or `IF` will generate a JavaScript error. [S1]
- **Braced block** — the code to run conditionally goes inside `{ ... }` after the parenthesized condition. [S1]
- **Nesting works but adds complexity** — `if` statements can be nested, but nesting makes code more complex. [S1]
- **Prefer logical AND over nesting** — a better solution than nesting two `if`s is to combine conditions with the logical AND operator `&&`. [S1]

## 🧩 추출된 패턴 (Extracted patterns)
- **Default-then-override** — set a default value, then override it inside an `if` when the condition holds. [S1]
- **Flatten nesting with `&&`** — replace `if (A) { if (B) {...} }` with `if (A && B) {...}`. [S1]

## 📖 세부 내용 (Details)
**The JavaScript if Statement** [S1]
Use the JavaScript `if` statement to execute a block of code when a condition is `true`.

**Syntax** [S1]
```
if (condition) {
  //  block of code to be executed if the condition is true
}
```

**Note** [S1]
Note that `if` is in lowercase letters. Uppercase letters (`If` or `IF`) will generate a JavaScript error.

A basic `if` setting a greeting: [S1]
```javascript
if (hour < 18) {
  greeting = "Good day";
}
```

A default-then-override example where the condition is true: [S1]
```javascript
let age = 18;
let text = "You can Not drive";

if (age >= 18) {
  text = "You can drive";
}
```

The same pattern where the condition is false (the default is kept): [S1]
```javascript
let age = 16;
let text = "You can Not drive";

if (age >= 18) {
  text = "You can drive";
}
```

**Nested if** [S1]
Nested if statements can make your code more complex:
```javascript
let age = 16;
let country = "USA";
let text = "You can Not drive!";

if (country == "USA") {
  if (age >= 16) {
    text = "You can drive!";
  }
}
```
A better solution is to use the logical AND operator:
```javascript
let age = 16;
let country = "USA";
let text = "You can Not drive!";

if (country == "USA" && age >= 16) {
  text = "You can drive!";
}
```

## 🛠️ 적용 사례 (Applied in summary)
The page's own snippets are the canonical applied examples — greeting based on `hour`, a driving-eligibility check with default-then-override, and flattening a nested `if` into a single `&&` condition. No external project/commit applications found in the source.

## 💻 코드 패턴 (Code patterns)
Default then override on a true condition:
```javascript
let age = 18;
let text = "You can Not drive";

if (age >= 18) {
  text = "You can drive";
}
```
Combine conditions with logical AND instead of nesting:
```javascript
if (country == "USA" && age >= 16) {
  text = "You can drive!";
}
```

## ⚖️ 모순 및 업데이트 (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 If Else]], [[JavaScript Conditional Operators]], [[JavaScript Comparisons]], [[JavaScript Operators]]
- **참조 맥락:** The foundational branching statement, referenced before adding `else`/`else if` or a `switch`.

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

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