JSのfetchで取得するResponseオブジェクトは、Object.keys()でキー一覧が取得できないのはなぜなのでしょうか

Question

'use strict';

fetch('https://www.jma.go.jp/bosai/forecast/data/overview_week/130000.json')
  .then((response) => {
    console.log(response);
    console.log(response.status);
    console.log(Object.keys(response));
    console.log(JSON.stringify(response));
    return response.json();
  })
  .then((json) => {
    console.log(json);
  });

上記の1つ目の then() に渡したコールバック関数の引数 response は少なくとも status というキーを持つはずなのですが 、Object.keys(response) と JSON.stringify(response) の結果が空配列や空オブジェクトになってしまいます。

これはなぜなのでしょうか。ご教示いただければ幸いです。

Comments

[退会済みユーザー]

.

Answer 1

reseponseオブジェクトはResponseインタフェースを継承してるからじゃないですかね。

Object.keys()では継承元のプロパティは表示されません。

表示するにはObject.getPrototypeOf(response) を使って継承元を取得するとか。

fetch('https://www.jma.go.jp/bosai/forecast/data/overview_week/130000.json')
  .then((response) => {
    console.log(Object.keys(Object.getPrototypeOf(response)));
  })

あとは　for ... in　を使うとか。

fetch('https://www.jma.go.jp/bosai/forecast/data/overview_week/130000.json')
  .then((response) => {
    for(let p in response){
       console.log(p)    
    }
  })

Comments

[yuzunoha123]

>Object.keys()では継承元のプロパティは表示されません。

なるほど！回答ありがとうございました！