連想配列から要素の取り出し

Question

```
{ name: 'projects/webapp-ccdf0/databases/(default)/documents/deliverys/J1sBuYY43uk9wFRQRhEw',
fields:
{ shopName: { stringValue: 'A' },
date: { stringValue: '2021/3/30' },
pickups: { mapValue: [Object] },
shopId: { stringValue: '$d128nbKsHJer3LiDW' },
distribute: { mapValue: [Object] } },
createTime: '2021-03-26T02:35:59.993541Z',
updateTime: '2021-03-31T06:59:54.565895Z',
readTime: '2021-04-04T21:53:32.207793Z' }

GASでの作業をしています。

これは今書いているコードのコンソールログなのですが、これのpickupsとdistributeにそれぞれ数字が入っています。
この数字を取り出してスプレッドに表示させたいのですが、方法がわかりません。
アドバイス頂きたいです。
すごく初心者なので、わkらないことだらけで説明も不十分でしたら申し訳ございません。
よろしくお願いいたします。

Comments

[xail2222]

FirestoreAppが何なのか知らないので、よくわからないですが。
提示の内容には[object]ってなってますけど、どんなobjectなんですか？
それと、前の質問ですが画像がちゃんと表示されてないです。

[ryudaiii]

ご回答いただきありがとうございます。
Objectの中身を追記しますのでみていただくと助かります。

画像の件ご指摘ありがとうございます。
修正させていただきます。

[Automatic9045]

もう少し分からない部分を具体的にすると良いかもしれません。
分からないのは、
・スプレッドシートに表示させる方法ですか？
・JSON内の特定の要素を取得する方法ですか？

[ryudaiii]

ご指摘ありがとうございます。

JSON内の要素を取得する方法です。

Answer 1

分からないのはJSON内の要素を取得する方法とのことなので、それに沿って回答します。

const json = { name: 'projects/webapp-ccdf0/databases/(default)/documents/deliverys/J1sBuYY43uk9wFRQRhEw',
  fields: 
   { shopName: { stringValue: 'A' },
     date: { stringValue: '2021/3/30' },
     pickups: { mapValue: [Object] },
     shopId: { stringValue: '$d128nbKsHJer3LiDW' },
     distribute: { mapValue: [Object] } },
  createTime: '2021-03-26T02:35:59.993541Z',
  updateTime: '2021-03-31T06:59:54.565895Z',
  readTime: '2021-04-04T21:53:32.207793Z' }

であるとき、例えばpickupのorangeのstringValueは

const pickupOrange = json.fields.pickups.mapValue.fields.orange.stringValue;

これで取得出来ます。
各要素名をピリオドで繋げて書いていけばOKです。

コメントを受けて追記

動的に取得したい場合は関数化すると良いです。

function getPickupOrange(json) {
    return  json.fields.pickups.mapValue.fields.orange.stringValue;
}

値を取得したいタイミングで逐一この関数を実行して下さい。

Comments

[ryudaiii]

ご回答いただき誠にありがとうございます！！
無事取り出すことができたのですが、
pickupのorangeなどのstringValueが、更新されるとなるとこの方法は使えないですか？
また質問で返すような形になってしまい申し訳ございません。

[Automatic9045]

動的に取得したい場合は関数化すると良いです。
コメント欄ではコードの整形がかけられないので、回答に追記しておきますね。

[ryudaiii]

ご丁寧にありがとうございます！！！

[ryudaiii]

度々申し訳ございません。
まず、JSONデータを取得する必要があると言うことですよね？

[Automatic9045]

すみません、質問の意図がいまいち分からないのですが…
何かしら問題があった感じですか？

[ryudaiii]

はい、、、
console.logしてみると[Function: getPickupOrange]
のように表示されてしまいます。。。

[Automatic9045]

console.log(getPickupOrange)

としていませんか？
これだとconsole.logの引数にはgetPickupOrange関数自体が渡されてしまいます。

変数jsonを作った上で

console.log(getPickupOrange(json))

として下さい。

[ryudaiii]

そうしていました。
回答者様が、記述してくださったように、
const json〜を書けばいいでしょうか？？

頼りっきりになってしまい、申し訳ございません。

[Automatic9045]

const json = (以下略
ではなく
var json = (以下略
と言った方が馴染み深いですかね。
jsonという名前の変数を宣言して、質問者さんがはじめに提示されたJSONオブジェクトを代入して下さい。

[Automatic9045]

あるいはconsole.logの表示内容を動的に変えたい…ということですか？

[ryudaiii]

最終的な目標としては、色ごと（四色の納品物、二色の回収物）に分かれた納品数・回収数管理アプリを作っていて、ユーザーが納品数などを入力した数や納品者のID、日付などをスプレッドで管理したいです。
なので、JSONに記されている内容を上書きというよりは日々スプレッドに保存していきたいです。

的外れな回答でしたらすみません。

[Automatic9045]

それでしたら私の2つ目のコメント（「あるいは〜」以降）は関係ないです。気にしないで下さい。

1つ目のコメントの通り、jsonという名前の変数を宣言して、質問者さんがはじめに提示されたJSONオブジェクトを代入すればOKです。

[ryudaiii]

ありがとうございます。

回答の一つ目のコードのconstをvarに変えれば大丈夫ですかね？？

[Automatic9045]

どちらでも大丈夫ですよ〜

[ryudaiii]

試してみましたが、'orange'が見つからないとエラーが出てしまいました。
頼りきりになってしまったので自分で解決してみようと思うのですが、何か最後にアドバイスいただけませんか？？
また、ここまで親身になってくださりありがとうございます。

[Automatic9045]

エラーが出たときにやることの流れでも。
私の場合はこんな感じです。

1. まずエラーメッセージで検索してみる。半分はここで原因が分かります。
2. 次はtypo（入力ミス）を疑う。
3. 今度は英語で検索してみる。
4. エラーの直前にブレークポイントを置いてみて、変数に想定外な値が代入されていたり、ifなどによる条件分岐が上手くいっていない所が無いか確かめてみる。
5. ④ですら原因が見つからないことは滅多にありませんが、もし万が一見つからなかったときは総当たりで研究するしかありません。teratailなどに質問を投げても解決する可能性は低いです（ただし、新しい技術についての疑問であれば質問は有効なことも）。

私はほとんど人に質問せずひたすら検索して解決するタイプなのでこのような感じになりますが、もう少し早めに質問を投げるのもありだと思います。
ただ質問前にtypoだけは確認して下さいね。赤っ恥なので。

また、エラーメッセージの英語が読めなかったらぜひ翻訳してみましょう。
「こんな意味じゃないかな」と推測すると大体誤解します。

[Automatic9045]

因みに今回の問題ですが、私はこの辺りが原因じゃないかなと思っています。手詰まりになってしまったら見てみて下さい。

①orangeをorengeなどと綴り間違えている
orangeが見つからないなら、fieldsかmapValueまでは見つかっているのです。

② 1階層抜かしている
json.fields.pickups.mapValue.orange.stringValue
とか書いていませんか？

③エラーメッセージの解釈間違い
実はそういう意味のエラーメッセージではなかった可能性。

④JSONを生成する側のバグや仕様
orange.stringValueが0のとき、そもそもorange要素自体を生成しない仕様になっていたりしませんか？

[Automatic9045]

こんな感じです。
もしどうしても分からなければ、teratailに帰ってくるのも有りですよ。その時は分かる範囲でお答えします。

それでは、頑張って下さい！

[ryudaiii]

本当にご丁寧にありがとうございます！！
お陰様でエラー原因がわかりました。
jsonを宣言したことで新しくjsonという配列ができてしまって、その中にはorange以降のキーが入っていないためだと思いました。
30分以上格闘したのですがわからないので少しヒントが欲しいです、、、
結局聞いてしまう羽目になってすみません。

[Automatic9045]

エラーが出る直前の部分にブレークポイントを置いてみて、変数jsonの中身を確認してみて下さい。
orange以降のキーは入っていましたか？

[ryudaiii]

参照したいfirestoreの中身をではなく、var json =以降の値を参照してしまっているので読み込めないです、、

[Automatic9045]

シャローコピーによる問題のような気がします。
ソースコードを見ていないのでなんとも言えませんが、

var hoge = json.fields.pickups.mapValue;

などとしてmapValueを他の変数に代入した後、そこに他の値を再代入していませんか？

[ryudaiii]

アドバイスいただいた通りに記述しているのですが、、、
なぜかダメみたいです。。

[Automatic9045]

なんとなく問題が見えてきましたが、ソースコードを確認したいです。
別途新しく質問を立てて、関連するソースコードを載せて下さい。

[ryudaiii]

console.logを入れなければエラーは出ないですが、入れるとCannot read property 'pickups' of undefinedが出てしまいます。

[ryudaiii]

わかりました！！
ありがとうございます。