JSON: Đối tượng JSON
Cú pháp đối tượng
Ví dụ:
{ "name":"John", "age":30, "car":null }
Một đối tượng JSON được bao quanh bởi cặp ngoặc xoắn {}.
Các đối tượng JSON được viết trong các cặp key/value.
Khóa phải là chuỗi và giá trị phải là kiểu dữ liệu JSON hợp lệ (chuỗi, số, đối tượng, mảng, boolean hoặc null).
Khóa và giá trị được phân tách bằng dấu hai chấm.
Mỗi cặp khóa/giá trị được phân tách bằng dấu phẩy.
Truy cập giá trị đối tượng
Bạn có thể truy cập các giá trị đối tượng bằng cách sử dụng ký hiệu dấu chấm (.).
Ví dụ:
<!DOCTYPE html> <html> <body> <p>Access a JSON object using dot notation:</p> <p id="demo"></p> <script> var myObj, x; myObj = {"name":"John", "age":30, "car":null}; x = myObj.name; document.getElementById("demo").innerHTML = x; </script> </body> </html>
Bạn cũng có thể truy cập các giá trị đối tượng bằng cách sử dụng cặp ngoặc vuông ([]).
Ví dụ:
<!DOCTYPE html> <html> <body> <p>Access a JSON object using bracket notation:</p> <p id="demo"></p> <script> var myObj, x; myObj = {"name":"John", "age":30, "car":null}; x = myObj["name"]; document.getElementById("demo").innerHTML = x; </script> </body> </html>
Vòng lặp một đối tượng
Bạn có thể lặp qua các thuộc tính đối tượng bằng cách sử dụng vòng lặp for-in.
Ví dụ:
<!DOCTYPE html> <html> <body> <p>How to loop through all properties in a JSON object.</p> <p id="demo"></p> <script> var myObj, x; myObj = {"name":"John", "age":30, "car":null}; for (x in myObj) { document.getElementById("demo").innerHTML += x + "<br>"; } </script> </body> </html>
Trong vòng lặp for-in, hãy sử dụng ký hiệu dấu ngoặc vuông để truy cập các giá trị thuộc tính.
Ví dụ:
<!DOCTYPE html> <html> <body> <p>Use bracket notation to access the property values.</p> <p id="demo"></p> <script> var myObj, x; myObj = {"name":"John", "age":30, "car":null}; for (x in myObj) { document.getElementById("demo").innerHTML += myObj[x] + "<br>"; } </script> </body> </html>
Các đối tượng JSON lồng nhau
Giá trị trong một đối tượng JSON có thể là một đối tượng JSON khác.
Ví dụ:
myObj = {
"name":"John",
"age":30,
"cars": {
"car1":"Ford",
"car2":"BMW",
"car3":"Fiat"
}
}
Bạn có thể truy cập các đối tượng JSON lồng nhau bằng cách sử dụng ký hiệu dấu chấm hoặc ký hiệu dấu ngoặc vuông.
Ví dụ:
<!DOCTYPE html> <html> <body> <p>How to access nested JSON objects.</p> <p id="demo"></p> <script> var myObj = { "name":"John", "age":30, "cars": { "car1":"Ford", "car2":"BMW", "car3":"Fiat" } } document.getElementById("demo").innerHTML += myObj.cars.car2 + "<br>"; //or: document.getElementById("demo").innerHTML += myObj.cars["car2"]; </script> </body> </html>
Sửa đổi giá trị
Bạn có thể sử dụng ký hiệu dấu chấm để sửa đổi bất kỳ giá trị nào trong đối tượng JSON.
Ví dụ:
<!DOCTYPE html> <html> <body> <p>How to modify values in a JSON object.</p> <p id="demo"></p> <script> var myObj, i, x = ""; myObj = { "name":"John", "age":30, "cars": { "car1":"Ford", "car2":"BMW", "car3":"Fiat" } } myObj.cars.car2 = "Mercedes"; for (i in myObj.cars) { x += myObj.cars[i] + "<br>"; } document.getElementById("demo").innerHTML = x; </script> </body> </html>
Bạn cũng có thể sử dụng ký hiệu dấu ngoặc để sửa đổi giá trị trong đối tượng JSON.
Ví dụ:
<!DOCTYPE html> <html> <body> <p>How to modify values in a JSON object using the bracket notation.</p> <p id="demo"></p> <script> var myObj, i, x = ""; myObj = { "name":"John", "age":30, "cars": { "car1":"Ford", "car2":"BMW", "car3":"Fiat" } } myObj.cars["car2"] = "Mercedes"; for (i in myObj.cars) { x += myObj.cars[i] + "<br>"; } document.getElementById("demo").innerHTML = x; </script> </body> </html>
Xóa thuộc tính đối tượng
Sử dụng từ khóa delete để xóa thuộc tính khỏi đối tượng JSON.
Ví dụ:
<!DOCTYPE html> <html> <body> <p>How to delete properties of a JSON object.</p> <p id="demo"></p> <script> var myObj, i, x = ""; myObj = { "name":"John", "age":30, "cars": { "car1":"Ford", "car2":"BMW", "car3":"Fiat" } } delete myObj.cars.car2; for (i in myObj.cars) { x += myObj.cars[i] + "<br>"; } document.getElementById("demo").innerHTML = x; </script> </body> </html>