Files
2nd/10_Wiki/Topic_JavaScript/JavaScript_JSON_Arrays.md
T
koriweb 9609c04755 docs(10_Wiki): W3Schools 위키화 — HTML/CSS/JavaScript(core)
W3Schools 튜토리얼을 P-Reinforce v3.1 포맷으로 위키화(영어 본문, 한/영 섹션 헤더).
- Topic_HTML: 59문서 (튜토리얼+예제, 레퍼런스/메타 제외)
- Topic_CSS: 190문서 (메인 + Advanced/Flexbox/Grid/RWD 전체)
- Topic_JavaScript: 120문서 (코어 언어; Temporal/DOM상세/BOM/WebAPI/AJAX/jQuery/Graphics 등은 후속)
각 폴더 00_INDEX.md(MOC) 포함. 코드 verbatim, 미확인분은 "Not found in source" 표기.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-23 19:21:18 +09:00

139 lines
5.2 KiB
Markdown

---
id: json-arrays
title: "JSON Arrays"
category: "Frontend"
status: "draft"
verification_status: "conceptual"
canonical_id: ""
aliases: ["JSON arrays", "JSON array literal", "array in JSON", "arrays in objects", "loop JSON array"]
duplicate_of: ""
source_trust_level: "B"
confidence_score: 0.88
created_at: 2026-06-23
updated_at: 2026-06-23
review_reason: ""
merge_history: []
tags: ["javascript", "js", "web", "frontend", "w3schools", "json", "arrays"]
raw_sources: ["https://www.w3schools.com/js/js_json_arrays.asp"]
applied_in: []
github_commit: ""
---
# [[JSON Arrays]]
## 🎯 한 줄 통찰 (One-line insight)
JSON arrays are square-bracket literals almost identical to JavaScript arrays — but their values are restricted to string, number, object, array, boolean, or null — accessed by index and commonly nested inside objects. [S1]
## 🧠 핵심 개념 (Core concepts)
- **Array literals live inside JSON strings** — a JSON string can hold a JSON array literal such as `["Ford", "BMW", "Fiat"]`. [S1]
- **Almost the same as JS arrays** — arrays in JSON are almost the same as arrays in JavaScript. [S1]
- **Restricted value types** — in JSON, array values must be of type string, number, object, array, boolean, or null; in JavaScript they can additionally be any valid JS expression, including functions, dates, and undefined. [S1]
- **Index access** — you access array values by index (`myArray[0]`). [S1]
- **Arrays nest in objects** — objects can contain arrays, accessed like `myObj.cars[0]`. [S1]
## 🧩 추출된 패턴 (Extracted patterns)
- **Literal or parse** — `myArray = [...]` or `myArray = JSON.parse(myJSON)`. [S1]
- **Index access** — `myArray[0]`, `myObj.cars[0]`. [S1]
- **Two loop forms** — `for...in` over indices, or a classic counting `for` loop using `.length`. [S1]
## 📖 세부 내용 (Details)
**JSON array literals**
This is a JSON string: [S1]
```json
["Ford", "BMW", "Fiat"]
```
Inside the JSON string there is a JSON array literal: [S1]
```json
["Ford", "BMW", "Fiat"]
```
Arrays in JSON are almost the same as arrays in JavaScript. In JSON, array values must be of type string, number, object, array, boolean or null. In JavaScript, array values can be all of the above, plus any other valid JavaScript expression, including functions, dates, and undefined. [S1]
**JavaScript arrays**
You can create a JavaScript array from a literal: [S1]
```javascript
myArray = ["Ford", "BMW", "Fiat"];
```
You can create a JavaScript array by parsing a JSON string: [S1]
```javascript
myJSON = '["Ford", "BMW", "Fiat"]';
myArray = JSON.parse(myJSON);
```
**Accessing array values**
You access array values by index: [S1]
```javascript
myArray[0];
```
**Arrays in objects**
Objects can contain arrays: [S1]
```json
{
"name":"John",
"age":30,
"cars":["Ford", "BMW", "Fiat"]
}
```
You access array values inside an object by index: [S1]
```javascript
myObj.cars[0];
```
**Looping through an array**
You can access array values by using a for-in loop: [S1]
```javascript
for (let i in myObj.cars) {
x += myObj.cars[i];
}
```
Or you can use a for loop: [S1]
```javascript
for (let i = 0; i < myObj.cars.length; i++) {
x += myObj.cars[i];
}
```
## 🛠️ 적용 사례 (Applied in summary)
Applied examples on the page: create an array from a literal and from `JSON.parse()`; access by index; embed an array in an object and read `myObj.cars[0]`; and iterate with both for-in and a counting for loop. No external project/commit applications found in the source.
## 💻 코드 패턴 (Code patterns)
Parse a JSON array and index it:
```javascript
myJSON = '["Ford", "BMW", "Fiat"]';
myArray = JSON.parse(myJSON);
myArray[0];
```
Loop an array nested in an object:
```javascript
for (let i = 0; i < myObj.cars.length; i++) {
x += myObj.cars[i];
}
```
## ⚖️ 비교 및 선택 기준 (Comparison & decision criteria)
JSON array values vs JavaScript array values: [S1]
- **JSON** — values restricted to string, number, object, array, boolean, or null.
- **JavaScript** — all of the above plus any valid JS expression, including functions, dates, and undefined.
- **Loop choice** — `for...in` iterates indices succinctly; a counting `for` loop with `.length` gives explicit index control. The source presents both as valid alternatives without preferring one.
## ⚖️ 모순 및 업데이트 (Contradictions & updates)
No contradictions found in the source.
## ✅ 검증 상태 및 신뢰도
- **상태:** draft
- **검증 단계:** conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
- **출처 신뢰도:** B (W3Schools — widely used educational reference, not a primary standards body)
- **신뢰 점수:** 0.88
- **중복 검사 결과:** 신규 생성 (New discovery)
## 🔗 지식 그래프 (Knowledge Graph)
- **상위/루트:** [[JavaScript Tutorial]]
- **관련 개념:** [[JavaScript JSON Objects]], [[JavaScript JSON Parse]], [[JavaScript JSON Data Types]], [[JavaScript JSON]]
- **참조 맥락:** Referenced whenever reading or iterating array data within parsed JSON.
## 📚 출처 (Sources)
- [S1] W3Schools — JSON Arrays — https://www.w3schools.com/js/js_json_arrays.asp
## 📝 변경 이력 (Change history)
- 2026-06-23: Initial draft synthesized from the W3Schools "JSON Arrays" page (Astra wiki-curation, P-Reinforce v3.1 format).