一篇文章帶你了解JavaScript json 對(duì)象
回復(fù)“前端”即可獲贈(zèng)前端相關(guān)學(xué)習(xí)資料
一、對(duì)象的語法
JSON 對(duì)象被大括號(hào)環(huán)繞 {}，JSON 對(duì)象被寫成key/value。
{ "name":"John", "age":30, "car":null }key必須是字符串，并且value必須是一個(gè)有效的JSON數(shù)據(jù)類型（字符串、數(shù)字、對(duì)象、數(shù)組、布爾值或空），Keys 和 values 由冒號(hào)分隔，每個(gè)key/value對(duì)被逗號(hào)分隔。
二、訪問對(duì)象的值
可以使用點(diǎn)（.）訪問對(duì)象值。
<html lang="en"><head><meta charset="UTF-8"><title>項(xiàng)目title>head><body style="background-color: aqua;"><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>
還可以使用方括號(hào)（[]）訪問對(duì)象值:
<script>var myObj, x;myObj = {"name": "John","age": 30,"car": null};x = myObj["name"];document.getElementById("demo").innerHTML = x;script>
三、循環(huán)一個(gè)對(duì)象
可以使用for-in循環(huán)，遍歷一個(gè)對(duì)象。
<script>var myObj = {"name": "John","age": 30,"car": null};for (x in myObj) {document.getElementById("demo").innerHTML += x + "
";}script>
使用括號(hào)表示法訪問屬性值:
<script>var myObj, x;myObj = {"name": "John","age": 30,"car": null};x = myObj["name"];document.getElementById("demo").innerHTML = x;script>
四、嵌套的 JSON 對(duì)象
JSON的值可以是另外一個(gè)JSON對(duì)象。
myObj = {"name":"John","age":30,"cars": {"car1":"Ford","car2":"BMW","car3":"Fiat"}}
您可以訪問嵌套的JSON對(duì)象使用點(diǎn)符號(hào)或括號(hào):
x = myObj.cars.car2;//or:x = myObj.cars["car2"];
1. 修改值
你可以使用點(diǎn)表示法修改JSON對(duì)象的任何值:
myObj.cars.car2 = "Mercedes";js完整代碼：
<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] + "
";}document.getElementById("demo").innerHTML = x;script>
你也可以使用方括號(hào)來修改一個(gè)JSON對(duì)象值:
myObj.cars["car2"] = "Mercedes";js完整代碼：
<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] + "
";}document.getElementById("demo").innerHTML = x;script>
2. 刪除對(duì)象的屬性
使用delete關(guān)鍵字從JSON對(duì)象刪除一個(gè)屬性:
delete myObj.cars.car2;完整代碼：
<html lang="en"><head><meta charset="UTF-8"><title>項(xiàng)目title>head><body style="background-color: aqua;"><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; //通過語句刪除內(nèi)容。for (i in myObj.cars) {x += myObj.cars[i] + "
";}document.getElementById("demo").innerHTML = x;script>body>html>
五、總結(jié)
本文基于JavaScript基礎(chǔ)，介紹了json 對(duì)象中，語法的使用，如何去訪問對(duì)中的值，如何去循環(huán)對(duì)象。如何去嵌套JSON 對(duì)象。對(duì)象中如何去嵌套數(shù)組，常見的修改，刪除數(shù)組，都做了詳細(xì)的講解。
通過豐富的案例分析，效果圖的展示，能夠幫助你更好的理解。
代碼很簡(jiǎn)單，希望能夠幫助你。
-------------------?End?-------------------
往期精彩文章推薦：
歡迎大家點(diǎn)贊，留言，轉(zhuǎn)發(fā)，轉(zhuǎn)載，感謝大家的相伴與支持
想加入前端學(xué)習(xí)群請(qǐng)?jiān)诤笈_(tái)回復(fù)【入群】
萬水千山總是情，點(diǎn)個(gè)【在看】行不行