JavaScriptでjsonファイルを読み込む方法

このようなjsonファイルをローカルで読み込む場合、

1
2
3
4
5
6
7
8
{
  id:"1",
  name:"taro"
},
{
  id:"2",
  name:"hanako"
},

jQueryの$.getJSON()を使って読み込む場合が多いと思いますが、jQueryを使わずともJavaScriptだけで簡単に実装できます。

そう、Fetch APIを使えばね。

1
2
3
fetch('../index.json')
  .then(response => response.json())
  .then(data => console.log(data));