JSON 現在已經成為了最常見的數據交換格式之一,而作為前端工程師,我們經常需要通過 get 請求來獲取 JSON 數據。下面我們來看一個簡單的例子。
$.get('/api/data.json', function(data) { console.log(data); });
上面的代碼中,我們使用了 jQuery 提供的 $.get 方法來發送一個 get 請求,并通過回調函數獲取到了數據。但是我們也可以使用原生的 JavaScript 代碼來完成這些操作,例如:
var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { console.log(xhr.responseText); } }; xhr.open('GET', '/api/data.json'); xhr.send();
這里我們使用了 XMLHttpRequest 對象來發送 get 請求,并通過 onreadystatechange 事件來監聽請求狀態變化,并在狀態為 4 (已完成)且響應狀態碼為 200 時打印響應內容。
無論使用什么方法,獲取 JSON 數據常見的問題就是如何解析 JSON 字符串。在 JavaScript 中,我們可以使用 JSON.parse 方法將 JSON 字符串解析為對象,例如:
$.get('/api/data.json', function(data) { var jsonObj = JSON.parse(data); console.log(jsonObj); });
同樣的,我們也可以使用原生 JavaScript 的方法完成相同的操作,例如:
var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { var jsonObj = JSON.parse(xhr.responseText); console.log(jsonObj); } }; xhr.open('GET', '/api/data.json'); xhr.send();
JSON 解析之后我們就可以方便地操作這些數據了。總的來說,獲取 JSON 數據并解析成對象的過程并不復雜,只需要注意數據的來源和格式以及解析方式即可。