forEach文内でさらにforEach文の処理を書きたい時の方法

「労務時間表アプリ」から複数レコードの必要な項目情報を取得し「請求書アプリ」でPDF化するためにテーブル項目へ挿入したいと思っていいます。

・kintoneAPIを使い、「workingTimeList_Info」に格納
・それをforEach文で回す際に項目を抽出し、配列(detailWorkInfo)へ格納
・detailWorkInfoをforEach文で回し、「請求書アプリ」のテーブルに挿入したいのですがこの部分でのforEach文が動いてくれません。

下記の画像はコードとその際のコンソールになります。原因が分かる方いましたらご教授をよろしくお願いいたします。



ご質問の趣旨とは一致しないかも知れませんが、再現させることも難しそうなので
以下のコードでforEachの中でforEachした場合は動作しないのではないか?
という疑問は解決するかと思います。

const someList = [
  [1, 2, 3],
  [4, 5],
  [6, 7, 8]
];

someList.forEach((element) => {
  if (element.length > 2) {
    element.forEach((secondElement) => {
      console.log(`output: ${secondElement}`);
    });
  }
});

この部分でのforEach文が動いてくれません。

という部分が不明確でわかりませんでした。

返信ありがとうございます。

**この部分でのforEach文が動いてくれません。**が分かりにくく申し訳ありません。
上記に関しては、コンソールの画像で、API で取得した項目を73行目で「detailWorkInfo」に格納できているのが確認できると思います。
本来はこの後に76行目がコンソール表示されて欲しいですが、
その次のコンソールでは105行目の「forEach文の最終行」が表示されているので、75行目のforEach文の処理が動いていないため76,77行目のコンソールが表示されていない。という意味です。

なので知りたかった内容は「detailWorkInfo.forEach」の処理がなぜ動いていないのかです。

分かりにくく申し訳ありませんがよろしくお願いいたします。

この場合はブレークポイント張ってみるとわかりやすいかもです!

1 Like

chromeのコンソール上で

// オブジェクトではなく配列として定義
const detailWorkInfo = []
detailWorkInfo["abc"]  = 1234
console.log(detailWorkInfo)
[abc: 1234]

となるのですね

console.log(detailWorkInfo["abc"])

1234

もし、

const detailWorkInfo = {}
detailWorkInfo["abc"]  = 1234
console.log(detailWorkInfo)
detailWorkInfo.forEach((element) => console.log(element))

とすれば

VM1370:1 Uncaught TypeError: detailWorkInfo.forEach is not a function

というエラーがでて気づいたかもしれません。

配列もオブジェクトの一種らしいので、

あえて配列にしたい場合で、
Object.keys()/Object.values()/Object.entries()を使わないとすると

const detailWorkInfo = []

detailWorkInfo["abc"]  = 1234
detailWorkInfo["def"]  = 5678

for(const element in detailWorkInfo){
  console.log(detailWorkInfo[element])
}

とすれば

1234
5678

と表示することはできました。

画像でコードを貼り付けたくなる理由は、

最小限の再現可能な例を作成する方法
How to create a Minimal, Reproducible Example - Help Center - Stack Overflow

の通りにしようとすることができないからで

これができるならエラーの理由も判明していることも多いので

  • この掲示板で質問されないか
  • この(バグっぽい)動作が正しいのかという質問になる

質問者は

  • エディタにVScodeを使っているように見えたし
  • varではなくconst/letをつかっていたし(この変数はconstでいいのでは?という点はある)
  • REST APIも使いこなしているようだった
  • 作成したコードの長さもおそらく長い方
  • ブレイクポイントを使用せずやってきたとは信じがたい

値が空だった場合、コンソール画面で確認しづらいので

console.log(変数名)

として使わず
ブレイクポイントを入れるか

// テンプレートを使うか
console.log(`変数名: ${変数名}`)
// オブジェクトプロパティのショートハンド
console.log(`{変数名}`)
1 Like

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。