JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptでJSONファイルから条件に合う値だけを選択的に抽出する方法

本記事では、Node.js環境のJavaScriptを使って、JSONファイルから条件を満たすデータだけを選択的に抽出する方法を解説します。

サンプルデータ

まず、以下のような内容を持つJSONファイルdata.jsonを用意します。names配列の各要素は、名前を表す「name」と、読み取り可否を示す真偽値「readable」の2つのプロパティを持っています。

{
    "names": [{
        "name": "Ramesh",
        "readable": true
    }, {
        "name": "Suresh",
        "readable": false
    }, {
        "name": "Mahesh",
        "readable": true
    }, {
        "name": "Gourav",
        "readable": true
    }, {
        "name": "Mike",
        "readable": false
    }]
}

実現したい処理

今回作成するのは、parseDataという関数です。この関数は、JSONファイルへのパスを唯一の引数として受け取り、そのファイルを読み込んだ上で、names配列のうちreadableがtrueになっている要素だけを含むサブ配列を返します。

コード例

JSONデータの読み込みにはrequireモジュールを使用します。Node.jsでは、require()でJSONファイルを読み込むと自動的にJavaScriptオブジェクトへ変換されるため、JSON.parse()を呼び出す必要はありません。その後、Array.prototype.filter()メソッドを使えば、条件に合致する要素だけを簡単に絞り込めます。

const path = "./data.json";
const parseData = (path) => {
    const data = require(path);
    // すでにパース済みのため、JSON.parse()は不要
    return data.names.filter(el => el.readable);
}
const results = parseData(path);
console.log(results);

ポイント解説

  • require()による読み込み: JSONファイルは読み込んだ時点でオブジェクト化されるため、追加のパース処理が不要です。
  • filter()による絞り込み: コールバック関数でel.readableがtrueの要素だけを新しい配列として返します。元の配列は変更されません。

実行結果

コンソールには、readableがtrueの要素だけが含まれた配列が以下のように出力されます。

[
    { name: 'Ramesh', readable: true },
    { name: 'Mahesh', readable: true },
    { name: 'Gourav', readable: true }
]

このように、require()とfilter()を組み合わせることで、わずか数行のコードでJSONファイル内から必要なデータだけを効率的に取得できます。APIレスポンスや設定ファイルの加工など、さまざまな場面で応用できるテクニックです。

  1. JavaScriptでテキストボックスに値を出力する方法をわかりやすく解説

    JavaScriptでテキストボックスに値を出力したい場合は、input要素が持つvalueプロパティを利用します。ユーザーが入力した値を取得し、処理結果を別のテキストボックスのvalueに代入することで、画面への出力が可能になります。 ここでは、2つの数値を入力してその合計を表示するシンプルなサンプルを紹介します。 サンプルコード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewp

  2. JavaScriptでJSON配列からデータを読み取る方法をサンプルコード付きで解説

    Web開発では、APIから取得したJSONデータを処理する場面が非常によくあります。本記事では、JavaScriptを使ってJSON配列からデータを読み取り、画面に表示する方法を、実際に動作するサンプルコードとともにわかりやすく解説します。 JSON配列からデータを読み取る基本の流れ JSON形式の文字列をJavaScriptで扱うには、まずJSON.parse()メソッドで文字列をJavaScriptのオブジェクト(配列)に変換します。変換後は、forEach()メソッドなどを活用して、配列の各要素に格納された値へ簡単にアクセスできます。 サンプルコード <!DOCTYPE htm