JavaScript Tips | 配列ユーティリティ：Excel 行変換

JavaScript JavaScript
スポンサーリンク

テーマの整理：「Excel 行変換」とは何か

ここで扱うのは、「JavaScript の配列（オブジェクト配列）を、Excel の“行”として扱いやすい形に変換するユーティリティ」です。 業務だと、次のような場面でよく出てきます。

Excel から読み込んだ行データを、アプリ側のオブジェクト配列に変換したい。 逆に、アプリ側のオブジェクト配列を、Excel に貼り付けやすい“行の配列”にしたい。 列順やヘッダー名を意識しながら、行データをきれいに扱いたい。

ここでは、「Excel 行変換」を初心者向けにかみ砕きつつ、実務でそのまま使える形で説明していきます。

基本コンセプト：Excel の「行」と JavaScript の「オブジェクト配列」を行き来する

Excel の「行」のイメージをコードに落とす

Excel の 1 行は、ざっくり言うと「セルの配列」です。

例えば、こんな表があるとします。

A列B列C列
1Alicealice@example.com
2Bobbob@example.com

これを JavaScript で表現すると、こんな感じになります。

const header = ["id", "name", "email"]; // ヘッダー行
const rows = [
  [1, "Alice", "alice@example.com"],
  [2, "Bob",   "bob@example.com"],
];
JavaScript

一方、アプリ側ではこんな形で扱いたくなることが多いです。

const users = [
  { id: 1, name: "Alice", email: "alice@example.com" },
  { id: 2, name: "Bob",   email: "bob@example.com" },
];
JavaScript

つまり、

Excel 的な「行の配列（配列の配列）」 アプリ的な「オブジェクト配列」

この 2 つを行き来するのが「Excel 行変換」です。

ユーティリティ 1：オブジェクト配列 → Excel 行配列

実装：objectsToExcelRows

まずは、「オブジェクト配列を Excel 行に変換する」ユーティリティです。

function objectsToExcelRows(objects, headerKeys) {
  if (!Array.isArray(objects) || objects.length === 0) {
    return { header: [], rows: [] };
  }

  const keys =
    Array.isArray(headerKeys) && headerKeys.length > 0
      ? headerKeys
      : Object.keys(objects[0]);

  const header = keys.slice();

  const rows = objects.map((obj) => {
    return keys.map((key) => obj[key] ?? "");
  });

  return { header, rows };
}
JavaScript

重要なポイントをかみ砕いて説明します。

まず「オブジェクト配列かどうか」「空かどうか」をチェックしています。 headerKeys が渡されていればそれを列順として使い、なければ最初のオブジェクトのキー順を使います。 header は「列名の配列」で、そのまま Excel の 1 行目に対応します。 rows は「各オブジェクトを、キー順に値を並べた配列」にしたものです。 値が undefined や null のときは、Excel 的に扱いやすいように空文字にしています。

これで、「アプリ側のオブジェクト配列」を「Excel に貼り付けやすい行配列」に変換できます。

例題：ユーザー一覧を Excel 行に変換する

const users = [
  { id: 1, name: "Alice", email: "alice@example.com" },
  { id: 2, name: "Bob",   email: "bob@example.com" },
];

const { header, rows } = objectsToExcelRows(users);

console.log("header:", header);
console.log("rows:", rows);
JavaScript

出力イメージはこうなります。

header: ["id", "name", "email"]
rows: [
  [1, "Alice", "alice@example.com"],
  [2, "Bob",   "bob@example.com"],
]
JavaScript

このまま CSV にしたり、Excel ライブラリに渡したり、クリップボードにコピーしたりできます。

ユーティリティ 2：Excel 行配列 → オブジェクト配列

実装：excelRowsToObjects

次に、「Excel 的な行配列をオブジェクト配列に戻す」ユーティリティです。

function excelRowsToObjects(header, rows) {
  if (!Array.isArray(header) || header.length === 0) {
    console.warn("excelRowsToObjects: header is empty");
    return [];
  }

  if (!Array.isArray(rows) || rows.length === 0) {
    return [];
  }

  return rows.map((row) => {
    const obj = {};
    header.forEach((key, index) => {
      obj[key] = row[index];
    });
    return obj;
  });
}
JavaScript

重要なポイントをかみ砕いて説明します。

header は「列名の配列」で、各列がどのキーに対応するかを決めます。 rows は「行の配列」で、各行がセルの配列になっています。 各行について、header の順番に従って「オブジェクトのキー → セルの値」を対応付けています。 header や rows が空の場合は、空配列を返して処理を落とさないようにしています。

これで、「Excel から読み込んだ行データ」を「アプリ側のオブジェクト配列」に変換できます。

例題：Excel 行からユーザー一覧オブジェクトを作る

const header = ["id", "name", "email"];
const rows = [
  [1, "Alice", "alice@example.com"],
  [2, "Bob",   "bob@example.com"],
];

const users = excelRowsToObjects(header, rows);

console.log(users);
JavaScript

出力イメージはこうなります。

[
  { id: 1, name: "Alice", email: "alice@example.com" },
  { id: 2, name: "Bob",   email: "bob@example.com" },
]
JavaScript

これで、Excel から読み込んだデータをそのままアプリのロジックで扱えるようになります。

例題 3：列順を指定して Excel 行を作る（業務仕様対応）

シナリオ

仕様で「Excel の列順」が決められている。 内部のオブジェクトのキー順とは違う順番で出したい。

コード

const users = [
  { id: 1, name: "Alice", email: "alice@example.com" },
  { id: 2, name: "Bob",   email: "bob@example.com" },
];

const columnOrder = ["name", "email", "id"];

const { header, rows } = objectsToExcelRows(users, columnOrder);

console.log("header:", header);
console.log("rows:", rows);
JavaScript

出力イメージはこうなります。

header: ["name", "email", "id"]
rows: [
  ["Alice", "alice@example.com", 1],
  ["Bob",   "bob@example.com",   2],
]
JavaScript

ここでのポイントは、

内部のオブジェクトは { id, name, email } の順番でも、 Excel に出すときは [“name”, “email”, “id”] の順番にできる。

というところです。 業務では「Excel のフォーマット仕様」が先に決まっていることが多いので、ここを柔軟にできるのはかなり重要です。

例題 4：Excel 行変換と CSV 変換を組み合わせる

シナリオ

オブジェクト配列を Excel 行に変換し、 そのまま CSV にしてダウンロードしたい。

コード（概念的な例）

function escapeCsvValue(value) {
  if (value === null || value === undefined) {
    return "";
  }
  const str = String(value);
  const needsQuote =
    str.includes(",") ||
    str.includes('"') ||
    str.includes("\n") ||
    str.includes("\r");
  if (!needsQuote) return str;
  const escaped = str.replace(/"/g, '""');
  return `"${escaped}"`;
}

function rowsToCsv(header, rows) {
  const headerLine = header.join(",");
  const dataLines = rows.map((row) =>
    row.map((v) => escapeCsvValue(v)).join(",")
  );
  return [headerLine, ...dataLines].join("\n");
}

const users = [
  { id: 1, name: "Alice", email: "alice@example.com" },
  { id: 2, name: "Bob",   email: "bob@example.com" },
];

const { header, rows } = objectsToExcelRows(users);
const csv = rowsToCsv(header, rows);

console.log(csv);
JavaScript

ここでのポイントは、

オブジェクト配列 → Excel 行（header, rows） Excel 行 → CSV

というふうに、「Excel 行変換」が CSV 変換の前段としてきれいに機能していることです。 Excel に貼る、CSV にする、どちらも「行配列」をベースにすると扱いやすくなります。

Excel 行変換ユーティリティで意識してほしい重要ポイント

「列名（ヘッダー）」をちゃんと扱う

Excel 行変換の肝は、ヘッダー（列名）とオブジェクトのキーをどう対応付けるかです。

オブジェクト → 行 のときは、「どのキーをどの順番で出すか」を決める。 行 → オブジェクト のときは、「ヘッダーの文字列をそのままキーにするか」「別名マッピングするか」を決める。

初心者向けには、まずは「ヘッダー＝キー名」で始めて、 必要になったら「ヘッダー名とキー名のマッピング」を追加するイメージを持つとよいです。

「空セル」「欠損値」をどう扱うか

Excel では、セルが空のことがよくあります。 オブジェクト側では、null や undefined が入っていることもあります。

ここをユーティリティ側で決めておくと、コードが安定します。

オブジェクト → 行 のときは、undefined / null を空文字にする。 行 → オブジェクト のときは、空文字をそのまま文字列として扱うか、null に変換するかを決める。

初心者のうちは、「まずは空文字で統一する」くらいで十分です。

手を動かして「Excel 行変換」の感覚をつかむ

次のコードを実行して、

オブジェクト配列 → Excel 行 Excel 行 → オブジェクト配列

の往復を体感してみてください。

function objectsToExcelRows(objects, headerKeys) {
  if (!Array.isArray(objects) || objects.length === 0) {
    return { header: [], rows: [] };
  }

  const keys =
    Array.isArray(headerKeys) && headerKeys.length > 0
      ? headerKeys
      : Object.keys(objects[0]);

  const header = keys.slice();

  const rows = objects.map((obj) => {
    return keys.map((key) => obj[key] ?? "");
  });

  return { header, rows };
}

function excelRowsToObjects(header, rows) {
  if (!Array.isArray(header) || header.length === 0) {
    console.warn("excelRowsToObjects: header is empty");
    return [];
  }

  if (!Array.isArray(rows) || rows.length === 0) {
    return [];
  }

  return rows.map((row) => {
    const obj = {};
    header.forEach((key, index) => {
      obj[key] = row[index];
    });
    return obj;
  });
}

function demo() {
  const users = [
    { id: 1, name: "Alice", email: "alice@example.com" },
    { id: 2, name: "Bob",   email: "bob@example.com" },
  ];

  console.log("=== objects -> excel rows ===");
  const { header, rows } = objectsToExcelRows(users);
  console.log("header:", header);
  console.log("rows:", rows);

  console.log("=== excel rows -> objects ===");
  const restored = excelRowsToObjects(header, rows);
  console.log("restored:", restored);
}

demo();
JavaScript

まとめ：Excel 行変換ユーティリティで「配列と Excel を自然につなぐ」

「Excel 行変換」は、 「アプリ側のオブジェクト配列」と「Excel 的な行データ」を、ストレスなく行き来させるためのユーティリティ」です。

プロジェクトに例えば次のような形で置いておくイメージです。

export function objectsToExcelRows(objects, headerKeys) { ... }
export function excelRowsToObjects(header, rows) { ... }
JavaScript

そして、

Excel インポート／エクスポート、 CSV 出力、 レポート生成

といったところでは、必ずこの「Excel 行変換」を通す。

こう決めておくと、 「Excel とのやりとり」が“その場しのぎのコード”ではなく、 ちゃんとした“橋渡しの仕組み”になっていきます。

Excel は業務の現場でずっと使われ続けるツールです。 そこにきれいに接続できる配列ユーティリティを持っているのは、かなり“仕事が分かっているエンジニア”の動き方です。

スポンサーリンク
タイトルとURLをコピーしました