一篇文章带你了解 JavaScript json 对象 JSON 对象被写成key/value

2024-05-28 15:47:23 [百科] 来源：避面尹邢网

一篇文章带你了解 JavaScript json 对象

作者：前端进阶者 2023-07-25 16:06:57开发前端今天我们一起来带你你了解一下JavaScript json 对象都有哪些吧。篇文

一、章带对象的篇文语法

JSON 对象被大括号环绕 { }，JSON 对象被写成key/value。章带

{  "name":"John",篇文 "age":30, "car":null }

key必须是字符串，并且value必须是章带一个有效的JSON数据类型（字符串、数字、篇文对象、章带数组、篇文布尔值或空），章带Keys 和 values 由冒号分隔，篇文每个key/value对被逗号分隔。章带

一篇文章带你了解 JavaScript json 对象 JSON 对象被写成key/value

二、篇文访问对象的章带值

可以使用点（.）访问对象值。

一篇文章带你了解 JavaScript json 对象 JSON 对象被写成key/value

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>项目</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>

还可以使用方括号（[]）访问对象值:

一篇文章带你了解 JavaScript json 对象 JSON 对象被写成key/value

<script>var myObj, x;myObj = { "name": "John","age": 30,"car": null};x = myObj["name"];document.getElementById("demo").innerHTML = x;</script>

三、循环一个对象

可以使用for-in循环，遍历一个对象。

<script>var myObj = { "name": "John","age": 30,"car": null};for (x in myObj) { document.getElementById("demo").innerHTML += x + "<br>";}</script>

使用括号表示法访问属性值:

<script>var myObj, x;myObj = { "name": "John","age": 30,"car": null};x = myObj["name"];document.getElementById("demo").innerHTML = x;</script>

四、嵌套的 JSON 对象

JSON的值可以是另外一个JSON对象。

myObj = {    "name":"John",   "age":30,   "cars": {        "car1":"Ford",       "car2":"BMW",       "car3":"Fiat"  }}

您可以访问嵌套的JSON对象使用点符号或括号:

x = myObj.cars.car2;//or:x = myObj.cars["car2"];

1. 修改值

你可以使用点表示法修改JSON对象的任何值:

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] + "<br>";    }    document.getElementById("demo").innerHTML = x;</script>

你也可以使用方括号来修改一个JSON对象值:

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] + "<br>";  }  document.getElementById("demo").innerHTML = x;</script>

2. 删除对象的属性

使用delete关键字从JSON对象删除一个属性:

delete myObj.cars.car2;

完整代码：

<!DOCTYPE html><html lang="en">  <head>    <meta charset="UTF-8">    <title>项目</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; //通过语句删除内容。      for (i in myObj.cars) {         x += myObj.cars[i] + "<br>";      }      document.getElementById("demo").innerHTML = x;</script>  </body></html>