安全なJSONパースの戦略
try/catch、小さな形状チェック、デフォルト値、簡単なヘルパーユーティリティを使って、信頼できないJSONを安全にパースします。
「安全なJSONパースの戦略」はCoddyKit上の無料JavaScript Academyレッスンです。 これはレッスン3/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavaScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 JavaScript Academyコースには全3レッスンが含まれています。
なぜ安全なパースなのか
目標：予期しない問題を避けてJSONを読み取ります。
- parseをtry/catchで囲む
- 小さなsafeParseヘルパー
- 必須フィールドの構造を確認する
- オプション値にデフォルト値を設定する
safeParseヘルパー
小さなsafeParseを使うと、クラッシュを避け、エラーを明確に伝えられます。
// safeParse: never throws, returns { ok, value, error }
function safeParse(text) {
try {
const value = JSON.parse(text);
return { ok: true, value: value, error: null };
} catch (e) {
return { ok: false, value: null, error: String(e.message) };
}
}
// Demo
const good = safeParse("{\"name\":\"Ayla\",\"age\":20}");
const bad = safeParse("{broken}");
console.log("good.ok:", good.ok, "name:", good.value && good.value.name);
console.log("bad.ok:", bad.ok, "error:", bad.error);
構造の確認
必須フィールド（name、age）と、単純な範囲を確認する小さなバリデーターを追加します。
// Validate required fields and simple types
function isNonEmptyString(x) {
return typeof x === "string" && x.trim().length > 0;
}
function isNonNegativeInt(x) {
return Number.isInteger(x) && x >= 0;
}
function validateUser(u) {
if (u == null || typeof u !== "object") {
return { ok: false, reason: "not an object" };
}
if (!isNonEmptyString(u.name)) {
return { ok: false, reason: "name required" };
}
if (!isNonNegativeInt(u.age)) {
return { ok: false, reason: "age must be a non-negative integer" };
}
return { ok: true };
}
// Demo
const rawUser = "{\"name\":\"Mina\",\"age\":22}";
const parsed = safeParse(rawUser);
if (parsed.ok) {
console.log("valid?", validateUser(parsed.value));
}
オプション値のデフォルト値
??と簡単な確認を使って、オプションフィールドに安全なデフォルト値を設定します。
// Apply defaults using nullish coalescing and spread
function normalizeUser(u) {
const theme = (u.theme ?? "light"); // default theme
const tags = Array.isArray(u.tags) ? u.tags : [];
return { ...u, theme: theme, tags: tags };
}
// Demo
const raw = "{\"name\":\"Lena\",\"age\":19}";
const p = safeParse(raw);
if (p.ok) {
const v = normalizeUser(p.value);
console.log("theme:", v.theme, "tags:", v.tags);
}
範囲と上限
数値の範囲をクランプし、配列のサイズに上限を設けることで、データを安全かつ予測可能に保ちます。
// Guard numbers and arrays with tiny limits
function clampNumber(x, min, max) {
if (typeof x !== "number" || !Number.isFinite(x)) return min;
return Math.min(max, Math.max(min, x));
}
function toStringArray(a) {
if (!Array.isArray(a)) return [];
return a.map(function (x) { return String(x); }).slice(0, 5); // cap length
}
// Demo
const cfgText = "{\"limit\":200,\"labels\":[\"a\",\"b\",\"c\",\"d\",\"e\",\"f\"]}";
const cfg = safeParse(cfgText);
if (cfg.ok) {
const limit = clampNumber(cfg.value.limit, 1, 100);
const labels = toStringArray(cfg.value.labels);
console.log("limit:", limit, "labels:", labels);
}
パース → 検証 → 正規化
処理の流れは、パース → 検証 → 正規化です。関数は小さく、読みやすく保ちます。
// Putting it together: parse → validate → normalize
function readUser(jsonText) {
const p = safeParse(jsonText);
if (!p.ok) return { ok: false, reason: "parse: " + p.error };
const check = validateUser(p.value);
if (!check.ok) return { ok: false, reason: "shape: " + check.reason };
const normalized = normalizeUser(p.value);
return { ok: true, value: normalized };
}
// Demo
const text = "{\"name\":\"Ayla\",\"age\":21,\"tags\":[\"new\"],\"theme\":\"dark\"}";
console.log(readUser(text));
安全なパースのクイズ
クイックチェック：安全なパターンです。
まとめ
まとめ：小さなsafeParseを作成し、必須フィールドと型を確認し、数値をクランプし、配列に上限を設け、デフォルト値を適用します。これにより、アプリが不正な入力にも落ち着いて対処できるようになります。
よくある質問
「安全なJSONパースの戦略」レッスンは無料ですか？
はい。「安全なJSONパースの戦略」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、JavaScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 JavaScript Academyコースには全3レッスンが含まれています。
「安全なJSONパースの戦略」で何を学びますか？
try/catch、小さな形状チェック、デフォルト値、簡単なヘルパーユーティリティを使って、信頼できないJSONを安全にパースします。 ブラウザで直接実行するハンズオンコードでJavaScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
JavaScript Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのJavaScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/3です。
「安全なJSONパースの戦略」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このJavaScript Academyレッスンでコードを書いて実行できますか？
はい。すべてのJavaScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。