初心者のための JSON 完全ガイド |ケイティのブログ

JSON (JavaScript Object Notation) is the universal language of data exchange on the web. Whether you're building APIs, storing configuration files, or communicating between services, understanding JSON is essential for any developer. This comprehensive guide takes you from the basics to advanced concepts.

JSONとは何ですか?

JSON is a lightweight, text-based data interchange format. Despite "JavaScript" in the name, JSON is language-independent and supported by virtually every programming language. It was derived from JavaScript object syntax but has become the de facto standard for data exchange.

💡 Fun Fact: JSON was popularized by Douglas Crockford in the early 2000s. It's now defined by two standards: RFC 8259 and ECMA-404. The format is so simple that the entire specification fits on a business card.

JSON 構文: 基本

JSON is built on two structures:

Objects: Collections of key-value pairs enclosed in curly braces {}
Arrays: Ordered lists of values enclosed in square brackets []

単純な JSON オブジェクト

                {

                  "name": "John Doe",

                  "age": 30,

                  "isActive": true,

                  "email": "[email protected]"

                }

JSON データ型

JSON supports six data types:

Type	Example	Description
String	`"Hello World"`	Text enclosed in double quotes
Number	`42`, `3.14`, `-17`	Integer or floating-point
Boolean	`true`, `false`	Logical values (lowercase)
Null	`null`	Empty or absent value
Object	`{"key": "value"}`	Unordered key-value pairs
Array	`[1, 2, 3]`	Ordered list of values

入れ子構造

JSON's power comes from nesting objects and arrays:

                {

                  "user": {

                    "id": 12345,

                    "profile": {

                      "firstName": "Jane",

                      "lastName": "Smith"

                    },

                    "tags": ["developer", "designer"]

                  }

                }

よくある JSON の間違い

⚠️ JSON is Strict: Unlike JavaScript objects, JSON requires exact syntax. A single error will cause parsing to fail completely.

1. 末尾のカンマ

// ❌ Invalid - trailing comma after last item

                { "name": "John", "age": 30, }

// ✅ Valid

                { "name": "John", "age": 30 }

2. 一重引用符

// ❌ Invalid - JSON requires double quotes

                { 'name': 'John' }

// ✅ Valid

                { "name": "John" }

3. 引用符で囲まれていないキー

// ❌ Invalid - keys must be quoted

                { name: "John" }

// ✅ Valid

                { "name": "John" }

4. コメント

// ❌ Invalid - JSON doesn't support comments

                {

                  "name": "John" // This is a name

                }

// ✅ JSON simply doesn't allow comments

JavaScript での JSON の操作

JSON の解析 (文字列 → オブジェクト)

                const jsonString = '{"name": "John", "age": 30}';

                const user = JSON.parse(jsonString);

                console.log(user.name); // "John"

                console.log(user.age); // 30

文字列化 (オブジェクト → 文字列)

                const user = { name: "John", age: 30 };

                const jsonString = JSON.stringify(user);

                console.log(jsonString);

// '{"name":"John","age":30}'

きれいな印刷

                const user = { name: "John", age: 30 };

// Third parameter = indentation spaces

                const pretty = JSON.stringify(user, null, 2);

                console.log(pretty);

// {

// "name": "John",

// "age": 30

// }

✅ プロのヒント: 安全な解析

Always wrap JSON.parse() in try-catch to handle invalid JSON gracefully instead of crashing your application.

Python での JSON の操作

                import json

# Parsing JSON

                json_string = '{"name": "John", "age": 30}'

                user = json.loads(json_string)

                print(user["name"]) # John

# Creating JSON

                user_dict = {"name": "Jane", "age": 25}

                json_output = json.dumps(user_dict, indent=2)

                print(json_output)

JSON と XML: それぞれをいつ使用するか

Aspect	JSON	XML
Readability	More readable for humans	More verbose
File Size	Smaller	Larger (more markup)
Parsing Speed	Faster	Slower
Data Types	Native types (numbers, booleans)	Everything is a string
Comments	Not supported	Supported
Namespaces	Not supported	Supported
Best For	APIs, web apps, config files	Documents, complex schemas

実際の JSON の例

APIレスポンス

                {

                  "status": "success",

                  "data": {

                    "users": [

                      { "id": 1,
                "name": "Alice" },

                      { "id": 2,
                "name": "Bob" }

                    ],

                    "total": 2

                  }

                }

設定ファイル（package.json）

                {

                  "name": "my-project",

                  "version": "1.0.0",

                  "dependencies": {

                    "express": "^4.18.0",

                    "lodash": "^4.17.21"

                  }

                }

ベストプラクティス

Use descriptive keys: "firstName" is better than "fn"
Be consistent with naming: Choose camelCase or snake_case and stick with it
Validate before parsing: Always validate JSON from external sources
Handle null values explicitly: Don't omit keys—use null for empty values
Use arrays for lists: Even if there's currently only one item
Keep nesting reasonable: Deeply nested JSON is hard to work with

🔧 JSON のフォーマットまたは検証が必要ですか?

Use our free JSON Formatter tool to beautify, validate, and minify JSON instantly.

JSON フォーマッタを開く →

結論

JSON's simplicity is its strength. With just objects, arrays, and six data types, you can represent virtually any data structure. Master the basics covered here, avoid the common pitfalls, and you'll be working with JSON like a pro.

Remember: when in doubt, validate your JSON with a tool before debugging your code. Nine times out of ten, the issue is a syntax error—usually a missing comma or quote.

📋 初心者のための JSON 完全ガイド