JSONからデータを抽出し項目ごとにカウントしたいがさっぱり分からない

Question

###前提・実現したいこと
JavaScript初心者です。お手柔らかにお願いいたします…
とあるゲームサイトのJSONAPIデータを用いて1時間に1回実行しスプレッドシートに随時記録していくスクリプトを組みたいのですが、今まで触ってきたデータとは異なるものでかれこれ3時間ほど頭を抱えています。
APIデータの中から「"area_id"」別のデータをカウントし、それをスプレッドシートに書き込ませるようにしたいのです。
1時間に1回実行するところや、スプレッドシートに書き込むところ（GetRange(x, x).setValue(xxx)）はすでに知っています。が、どれを使ってデータを引っ張ってきて仕分けていくのかがさっぱりわかりません…

###該当のソースコード
使いたいAPI→https://so2-api.mutoys.com/json/sale/all.json
定義など→https://so2-docs.mutoys.com/common/api.html

[

{
"sale_serial": 販売通し番号(number),
"area_id": 街ID(number),
"pos_x": X座標(number),
"pos_y": Y座標(number),
"user_id": オーナー番号(number),
"shop_id": ショップ番号(number),
"shop_name": ショップ名(string),
"item_id": 商品ID(number),
"price": 販売単価(number),
"unit": 販売在庫数(number),
"bundle_sale": まとめ売り(number) // 0:ばら売り 1:まとめ売り
},
...
]

function TotalSO2() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('total');
  var response = UrlFetchApp.fetch('https://so2-api.mutoys.com/json/sale/all.json');
  var responseList = JSON.parse(response.getContentText());
  var GetDate = new Date();
  
   // Spreadsheetに書き出し
　
//行の追加
sheet.insertRowAfter(1);
//行が2000行を超えたら削除していく
var LastRow = sheet.getLastRow();
if(LastRow > 2000){
    sheet.deleteRows(LastRow, 1);
}    
  
  //ここに、responseListのArrayから特定の「"area_id":x」 を抜き出してカウントし、//
  //下のsetValueに反映させてareaid別にスプレッドシートに書き込みたい//
  
  sheet.getRange(2, 1).setValue(GetDate); //データ日時の取得
  sheet.getRange(2, 2).setValue(xx);
  sheet.getRange(2, 2).setValue(xx);
}

###試したこと
searchStr,countなどと呼ばれるものは一通りWebサイトを見て試しました。空白のセルが書き出されるか、undefinedが出てきます。

Comments

[kei344]

ご自身で試されたコードを質問文に追記し、「何」が「どのように」わからないのか、コードのどの部分で詰まっているのかなどを具体的に追記されたほうが回答が望めると思います。

[kei344]

「Java初心者」とありますが、JavaScriptの間違いでは？また、質問タグに「Google Apps Script」も追加されてはいかがでしょう。

[nonmom_so2]

ありがとうございます。そうですね、JavaでなくてJavascriptですね…お恥ずかしい…。

Answer 1

例えばブラウザ等の通常の環境であれば、下記のようにすればできますが、Google Apps Script は実行時間が限られていているので動かないかもしれません。（ブラウザとGoogle Apps Scriptでは使用できるJavaScriptのバージョンが違ったかも）

カウントするとかはスプレッドシートのほうの関数を使うほうが実行時間制限にかかりにくいかもしれません。

const d = [
{"sale_serial":130891,"area_id":7,"pos_x":44,"pos_y":25,"user_id":2192,"shop_id":2192,"shop_name":"アイスブラント","item_id":33,"price":450,"unit":500,"bundle_sale":0}
/*省略*/
];

// 例1
let f = d.filter(ele=>ele.area_id === 7); // area_id が 7のものだけに絞り込む
console.log(f);

// 例2
let r = d.reduce( ( pre, curr ) =>{
  let int = pre.has( curr.area_id ) ? pre.get( curr.area_id ) : 0;
  pre.set( curr.area_id, ++int );
  return pre;
}, new Map() ); // area_id それぞれが何個あるかカウントする
console.log(r);

// 例3
let x = d.reduce( ( pre, curr ) =>{
  pre.push( [ curr.sale_serial, curr.area_id, curr.pos_x, curr.pos_y, curr.user_id, curr.shop_id, curr.shop_name, curr.item_id, curr.price, curr.unit, curr.bundle_sale ] );
  return pre;
}, [] ); // setValuesで使う用の配列を組む
console.log(x);
```**動くサンプル：**[https://jsfiddle.net/k03xnt8z/1/](https://jsfiddle.net/k03xnt8z/1/)

---


【Google Apps Scriptで配列を使ってスプレッドシートにデータ行を追加する方法】
[https://tonari-it.com/gas-array-push-append/](https://tonari-it.com/gas-array-push-append/)

【Google Apps Scriptのスプレッドシート読み書きを格段に高速化をする方法】
[https://tonari-it.com/gas-spreadsheet-speedup/](https://tonari-it.com/gas-spreadsheet-speedup/)

【Array.prototype.filter() - JavaScript | MDN】
[https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/filter](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)

【Map - JavaScript | MDN】
[https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Map](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Map)

Comments

[nonmom_so2]

ありがとうございます。
書き込んで実行してみましたところ、
let f = d.filter(ele=>ele.area_id === 7);
let r = d.reduce( ( pre, curr ) =>{
let int = pre.has( curr.area_id ) ? pre.get( curr.area_id ) : 0;
let x = d.reduce( ( pre, curr ) =>{
の部分で「ステートメントの前に ; がありません。」のエラーが、
}, new Map() );
}, [] );
の部分で構文エラーが出てしまいました。

今まで作ったコードとは難易度が桁違いに飛躍していて、流れは何となく理解できてもどこをどう治せばいいのか分からない状態です。
これはもう諦めたほうがいいのでしょうか…

[kei344]

https://jsfiddle.net/k03xnt8z/2/
アロー関数に対応してなさそうですね。上記でもエラーが出ますか？

【JavaScript アロー関数を説明するよ - Qiita】
https://qiita.com/may88seiji/items/4a49c7c78b55d75d693b

提示したコードはとりあえず配列関数を使ったけど、
responseList[0].sale_serial
で1件目のsale_serialの内容が取れると思います。
forで必要件数まで取り出すことも（制限時間に引っかからなければ）できますよ。

[nonmom_so2]

jsfinddleはエラーが出るというか、おそらく結果が書き出されるであろう右下部分がRunを押しても真っ白です。もしかしてPCが反応していない…？（Vistaを使っています）

いま、以下の式で「true」が帰ってきました。areaidを指定したresponseListをfor文で回してtrueの数をカウントすればいける…のか？？
var areaid = responseList[0].area_id == 7;
var number = areaid
Logger.log(number)

[kei344]

＞ 結果が書き出されるであろう右下部分がRunを押しても真っ白
ちがいますよ、デベロッパーツールで確認してください。
http://eng-entrance.com/javascript-display-error

[nonmom_so2]

何から何までありがとうございます…
確認したところ、Map内に
Mapsize: (...)
__proto__:
Map<entries>[8]0: {7 => 3}1: {21 => 1}2: {12 => 2}3: {2 => 2}4: {1 => 1}5: {4 => 2}6: {3 => 1}7: {31 => 1}
という記載があったので、jsfindle上ではうまく作動していたようです。

Answer 2

自己解決しました…！

var eme = 0;
  var ruby = 0;
  for(var key in responseList)
  {
    var item = responseList[key];
    switch(item["area_id"])
    {
        case 1:　//area_id指定
            eme++;
            break;
        case 2:
            ruby++;
            break;
（繰り返し省略）
    }
  }
  Logger.log(eme);　//ここをsetValueにする
  Logger.log(ruby);
（繰り返し省略）
}

で、どうにかなりました。
アホ丸出しの質問に根気強く答えて下さりありがとうございました…！