-
WEB前端
站-
热门城市 全国站>
-
其他省市
-
-
400-636-0069
小职
2021-01-08
来源 ：前端进阶学习交流
阅读 630
评论 0
摘要：本文主要向大家介绍了web前端开发学习之JavaScript json 数组，通过具体的内容向大家展现，希望对大家web前端开发JavaScript的学习有所帮助。
本文主要向大家介绍了web前端开发学习之JavaScript json 数组，通过具体的内容向大家展现，希望对大家web前端开发JavaScript的学习有所帮助。
简单说，所谓对象，就是一种无序的数据集合，由若干个“键值对”(key-value)构成。
一、数组作为JSON对象
[ "Ford", "BMW", "Fiat" ]
在JSON中的数组，几乎和在JavaScript中数组相同。
在JSON中，数组的值必须是字符串，数字、对象、数组、布尔值或空.
JavaScript中，数组的值可以是以上所有，再加上其他任何有效的JavaScript表达式，包括函数、日期、和undefined。
二、JSON对象中的数组
数组可以是对象属性的值:
{
"name":"John",
"age":30,
"cars":[ "Ford", "BMW", "Fiat" ]
}
1. 访问数组的值
使用索引号访问数组值:
x = myObj.cars[0];
完整代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>项目</title>
</head>
<body style="background-color: aqua;">
<p id="demo"></p>
<script>
myObj = {
"name": "John",
"age": 30,
"cars": ["Ford", "BMW", "Fiat"]
}
x = myObj.cars[0];
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
2. 遍历数组
你可以使用for-in循环遍历数组:
for (i in myObj.cars) {
x += myObj.cars[i];
}
或者可以使用for循环:
for (i = 0; i < myObj.cars.length; i++) {
x += myObj.cars[i];
}
三、JSON对象中的嵌套数组
数组值也可以是另一个数组，甚至另一个JSON对象:
myObj = {
"name":"John",
"age":30,
"cars": [
{ "name":"Ford", "models":[ "Fiesta", "Focus", "Mustang" ] },
{ "name":"BMW", "models":[ "320", "X3", "X5" ] },
{ "name":"Fiat", "models":[ "500", "Panda" ] }
]
}
访问数组内部的数组, 使用for-in loop循环:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>项目</title>
</head>
<body style="background-color: aqua;">
<p>Looping through arrays inside arrays.</p>
<p id="demo"></p>
<script>
var myObj, i, j, x = "";
myObj = {
"name":"John",
"age":30,
"cars": [
{ "name":"Ford", "models":[ "Fiesta", "Focus", "Mustang" ] },
{ "name":"BMW", "models":[ "320", "X3", "X5" ] },
{ "name":"Fiat", "models":[ "500", "Panda" ] }
]
}
/*访问数组内部的数组, 使用for-in loop循环*/
for (i in myObj.cars) {
x += "<h1>" + myObj.cars[i].name + "</h1>";
for (j in myObj.cars[i].models) {
x += myObj.cars[i].models[j] + "<br>";
}
}
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
1. 修改数组值
使用索引号修改数组:
myObj.cars[1] = "Mercedes";
完整代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>项目</title>
</head>
<body>
<p id="demo"></p>
<script>
var myObj, i, x = "";
myObj = {
"name":"John",
"age":30,
"cars":[ "Ford", "BMW", "Fiat" ]
};
myObj.cars[1] = "Mercedes";
for (i in myObj.cars) {
x += myObj.cars[i] + "<br>";
}
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
2. 删除数组中的项目
使用delete关键字从数组中删除:
delete myObj.cars[1];
四、总结
本文基于JavaScript基础，讲解了JSON数组中，如何以数组作为JSON的对象 ，对象中如何去嵌套数组，常见的修改，删除数组，都做了详细的讲解。
希望大家可以根据文章的内容，积极尝试，有时候看到别人实现起来很简单。但是到自己动手实现的时候，总会有各种各样的问题，切勿眼高手低，勤动手，才可以理解的更加深刻。
代码很简单，希望能够帮助你。
喜欢 | 0
不喜欢 | 0
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了，明天再试试吧！
我们会在第一时间安排职业规划师联系您！
您也可以联系我们的职业规划师咨询：
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com，All Rights Reserved.
沪公网安备 31011502005948号
索取资料
答疑解惑
技术交流
职业测评
面试技巧
高薪秘笈
