JSON .parse ()
Cách sử dụng phổ biến của JSON là trao đổi dữ liệu đến / từ máy chủ web.
Khi nhận dữ liệu từ máy chủ web, dữ liệu luôn là một chuỗi.
Phân tích cú pháp dữ liệu với JSON.parse()
và dữ liệu trở thành một đối tượng JavaScript.
Ví dụ - Phân tích cú pháp JSON
Hãy tưởng tượng chúng tôi nhận được văn bản này từ một máy chủ web:
'{"name":"John", "age":30, "city":"New York"}'
Sử dụng hàm JavaScript JSON.parse()
để chuyển đổi văn bản thành một đối tượng JavaScript:
const obj = JSON.parse('{"name":"John", "age":30, "city":"New
York"}');
Đảm bảo văn bản ở định dạng JSON, nếu không bạn sẽ gặp lỗi cú pháp.
Sử dụng đối tượng JavaScript trong trang của bạn:
Thí dụ
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = obj.name;
</script>
Mảng dưới dạng JSON
Khi sử dụng JSON.parse()
JSON trên một mảng, phương thức sẽ trả về một mảng JavaScript, thay vì một đối tượng JavaScript.
Thí dụ
const text = '["Ford", "BMW", "Audi", "Fiat"]';
const myArr = JSON.parse(text);
Ngoại lệ
Ngày phân tích cú pháp
Đối tượng ngày tháng không được phép trong JSON.
Nếu bạn cần bao gồm ngày, hãy viết nó dưới dạng chuỗi.
Bạn có thể chuyển đổi nó trở lại thành một đối tượng ngày tháng sau:
Thí dụ
Chuyển đổi một chuỗi thành một ngày tháng:
const text =
'{"name":"John", "birth":"1986-12-14", "city":"New York"}';
const obj = JSON.parse(text);
obj.birth = new Date(obj.birth);
document.getElementById("demo").innerHTML = obj.name + ", " + obj.birth;
Hoặc, bạn có thể sử dụng tham số thứ hai của JSON.parse()
hàm, được gọi là trình phục hồi .
Tham số hồi sinh là một hàm kiểm tra từng thuộc tính, trước khi trả về giá trị.
Thí dụ
Chuyển đổi một chuỗi thành một ngày, bằng cách sử dụng chức năng trình phục hồi :
const text =
'{"name":"John", "birth":"1986-12-14", "city":"New York"}';
const obj = JSON.parse(text, function (key, value) {
if
(key == "birth") {
return new
Date(value);
} else {
return value;
}
});
document.getElementById("demo").innerHTML = obj.name + ", " + obj.birth;
Các chức năng phân tích cú pháp
Các hàm không được phép trong JSON.
Nếu bạn cần bao gồm một hàm, hãy viết nó dưới dạng một chuỗi.
Bạn có thể chuyển đổi nó trở lại thành một hàm sau này:
Thí dụ
Chuyển đổi một chuỗi thành một hàm:
const text =
'{"name":"John", "age":"function () {return
30;}", "city":"New York"}';
const obj = JSON.parse(text);
obj.age = eval("(" + obj.age + ")");
document.getElementById("demo").innerHTML = obj.name + ", " +
obj.age();
Bạn nên tránh sử dụng các hàm trong JSON, các hàm sẽ mất phạm vi của chúng và bạn sẽ phải sử dụng eval()
để chuyển đổi chúng trở lại thành các hàm.