JavaScript中Json的学习

最新推荐文章于 2024-10-02 05:39:15 发布
最新推荐文章于 2024-10-02 05:39:15 发布
阅读量325 收藏 1
点赞数
文章标签： javascript json
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lqb_zxs/article/details/112793305
版权

1 json数据格式

文章目录

1.1 什么是json

JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。它基于ECMAScript的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。

1.2 json的语法格式

json对象有三种数据格式，分别如下：

类型语法解释
对象类型{name:value,name:value…}其中name是字符串类型，而value是任意类型
数组/集合类型[value,value,value…]其中value是任意类型
混合类型[{},{}… …] 或 {name:[]… …}合理包裹嵌套对象类型和数组类型

JSON是存储和交换文本信息的语法，类似 XML。
JSON 比 XML 更小、更快，更易解析。

//如下java代码分别用xml、json传输
User user = new User();
user.setName("jack");
user.setAge(24);
user.setGender("男");

//xml格式
<user>
	<name>jack</name>
	<age>24<age>
	<gender>男</gender>
</user>
//json
{"name":"jack","age":24,"gender":"男"}
1.3 JavaScript中json格式和json解析练习
1.3.1 练习1
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		
		<script type="text/javascript">
			/**
			 * 案例一
			 * var person={key:value,key:value}
			 *
			 * class Person{
			 * String firstname = "张";
			 * String lastname = "三丰";
			 * Integer age = 100;
			 * }
			 *
			 * Person p = new Person();
			 * System.out.println(p.firstname);
			 */
			//json的定义
			var person = {
				"firstname": "张",
				"lastname": "三丰",
				"age": 100
			};
			//json解析
			alert(person.firstname);
			alert(person.lastname);
			alert(person.age);
		</script>
	</body>
</html>
1.3.2 练习2
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>

		<script type="text/javascript">
			/**
			 * 案例二
			 * [{key:value,key:value},{key:value,key:value}]
			 * *
			 */
			var json = [{
					"firstname": "张",
					"lastname": "三丰",
					"age": 100
				},
				{
					"firstname": "张",
					"lastname": "翠山",
					"age": 58
				},
				{
					"firstname": "张",
					"lastname": "无忌",
					"age": 23
				}
			];
			for (var i = 0; i < json.length; i++) {
				console.log(json[i].lastname);
			}
		</script>
	</body>
</html>
1.3.3 练习3
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>

		<script type="text/javascript">
			/**
			 * 案例三
			 * {
			 * "param":[{key:value,key:value},{key:value,key:value}]
			 * }
			 *
			 *
			 */
			var json = {
				"wife": [{
						"name": "小双",
						"age": 18,
						"addr": "扬州"
					},
					{
						"name": "建宁",
						"age": 18,
						"addr": "北京"
					},
					{
						"name": "龙儿",
						"age": 38,
						"addr": "岛国"
					},
					{
						"name": "阿珂",
						"age": 17,
						"addr": "中国台湾"
					}
				]
			}
			//全取
			for (var i = 0; i < json.wife.length; i++) {
				console.log(json.wife[i].name);
			}
		</script>
	</body>
</html>
1.3.4 练习4
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>

		<script type="text/javascript">
			/**
			 * 案例四
			 * {
			 * "param1":[{key:value,key:value},{key:value,key:value}],
			 * "param2":[{key:value,key:value},{key:value,key:value}],
			 * "param3":[{key:value,key:value},{key:value,key:value}]
			 * }
			 *
			 *
			 */
			var json = {
				"wife": [{
						"name": "双儿",
						"age": 18,
						"addr": "扬州"
					},
					{
						"name": "建宁",
						"age": 18,
						"addr": "北京"
					},
					{
						"name": "龙儿",
						"age": 38,
						"addr": "岛国"
					},
					{
						"name": "阿珂",
						"age": 17,
						"addr": "中国台湾"
					}
				],
				"lp": [{
						"name": "大双儿",
						"age": 18,
						"addr": "扬州"
					},
					{
						"name": "小双儿",
						"age": 18,
						"addr": "扬州"
					}
				]
			}

			console.log(json.wife[0].name);
		</script>
	</body>
</html>
1.3.5 JSON对象及JSON字符串转换
JSON.parse(jsonStr); // json字符串 --> json 对象
JSON.stringify(json); // json对象 --> json字符串
旧梦时节
关注
js中JSON学习笔记
weixin_43990363的博客
11-01 201
json学习笔记 前言： json是JavaScript的一个严格的子集，利用了JavaScript中的一些模式来表示数据结构化 语法 类似js， 但不支持undefined 对象，数组 json不支持变量，函数或对象实例 简单值 json的字符串与js的字符串的最大区别在于，json字符串必须使用双引号 对象 json的对象要求给属性名上面加上双引号 ...
JSON数据练习
m0_62181310的博客
09-22 457
test.js 中，调用函数，进行测试。test.js 中，调用函数，测试。test.js 中测试。
json与js练习
weixin_30699465的博客
06-24 119
SON类型数据在JSON数据里面，key和value是成对存在的，key和key之间用逗号分隔，key和value之间用冒号分隔，可以存储任何类型的数据 1 var js = { 2 "one":"11111", 3 "two":"22222", 4 "three":new Array(11111,22222,33333), 5 "four":{a:111,b:2222,c...
javascript基础练习——json格式
aigo_2021的博客
04-22 4017
json格式 在Javascript表示对象的简写，格式非常的轻量，因此将这个格式称为json格式，被用于传输数据使用的一种格式。 练习1.定义一个班级对象，班级编号101，班级名称“计算机1101”，该班级有两个学生，姓名和性别分别时tom，男和rose，女，页面提示框显示班级所有学生姓名和性别。（分别使用两种方式编写创建对象） <!doctype html> <html lang="en"> <head> <title>test1</ti
JS操作JSON常用方法
热门推荐
小妖的博客
10-28 16万+
工作中做了几款自动化测试工具都是跟日志读取相关，日志格式又大多数都是JSON，所以这里把常用的JS操作JSON的方法做了总结： 一、概念简介 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式，采用完全独立于语言的文本格式，是理想的数据交换格式。同时，JSON是 JavaScript 原生格式，这意味着在 JavaScript 中处理 JSON
26 JavaScript学习：JSON和void
百锦再的博客
05-03 9万+
在 JavaScript 中，JSON 格式是一种常见的数据交换格式，它与 JavaScript 对象有着相似的结构，但在一些细节上有所不同。在 JSON 中，每个键值对由一个名称和一个值组成，名称是一个字符串，值可以是字符串、数字、布尔值、Null、数组或嵌套对象等不同类型的数据。是一个特殊的表达式，通常用于在 href 属性中作为超链接的 URL，以防止页面跳转。在 JavaScript 中，可以使用内置的 JSON 对象提供的方法将 JSON 字符串转换为 JavaScript 对象。
JSON 学习之JSON in JavaScript详细使用说明
10-29
### JSON 学习之 JSON 在 JavaScript 中的详细使用说明 #### 一、引言 JSON (JavaScript Object Notation) 是一种轻量级的数据交换格式，易于人阅读和编写，同时也易于机器解析和生成。它基于JavaScript的一个子集...
JavaScript中json使用自己总结
10-27
在JavaScript中，JSON是一种轻量级的数据交换格式，广泛应用于网络数据传输、配置文件存储、数据缓存等多种场景。...以上就是JavaScript中JSON的基本使用方法和一些心得分享，希望对大家学习JSON有所帮助。
jsoneditor_javascript_JSON_jsoneditor9.1.4_json-editorjs_
10-04
JSONEditor是一款功能强大的基于JavaScript的JSON数据编辑器，它允许用户以可视化的形式创建、编辑和查看JSON数据。在Web应用程序中，它常用于...同时，深入学习和掌握JSON和JavaScript将有助于提升Web开发的专业技能。
javascript学习之json入门
10-20
在JavaScript中，可以使用`JSON.parse()`方法将JSON字符串解析为JavaScript对象，而`JSON.stringify()`方法则用于将JavaScript对象序列化为JSON字符串。例如： ```javascript var str = '[{"name":"james","height":...
js if 模糊判断_js基础教程json的练习，提取有用数据
weixin_30303839的博客
12-10 789
随便贴点数据开始今天的课程，对于常用数据的提取，大家自己理解用途。 这段返回消息怎么在js中获取他们的结构值。 我们复制他们到jsbox中，时间久了就知道了，但是刚开始我们只能这么动手入门。 新建脚本，利用变量处理，var str= 然后在用console.log(str)命令输出他们，jsbox会让我们新手理解他们的结构。 点运行，我们看到上面的结果 就了解了。一个个动手...
JSON练习
努力，追梦的博客
04-01 2601
JSON练习： var dataString='{"teachers":[{"name":"黄波","course":"网页高级设计"},{"name":"贺敏","course":"Java程序设计"},{"name":"毛丽娟","course":"JavaScript程序设计"}],"students":[{"name":"张三","age":20},{"name":"李四","age":
使用JS写一个随机中奖练习
Json的知识梦工厂
06-16 1295
Document 点开它有奖品 点开它奖更大 function add(){   document.write("恭喜"+parseInt(Math.random()*100)+"号观众");   document.write("");   var a=["恭喜你中个兰博基尼","恭喜你中个法拉利","恭喜你中个大众","恭喜你中个五菱之光","恭喜你中个自行车"];
Json小练习
a1976728010的博客
08-31 614
Json小练习 对象 var Dog = { name: 'nn', age: 8, chiledren: [ {'name': 'hh', 'age': 6}, {'name': 'pd', 'age': 6} ] } //相当于java中以下代码 class Dog{ private String name; private int age; private List<Dog> children; }
knowLedge-Vue I18n 是 Vue.js 的国际化插件
2301_76671906的博客
09-30 828
Vue 2 中使用 Vue I18n 插件实现中英文切换
JavaScript ArrayBuffer的读写与类型转换
白瑕 的博客
10-01 403
所有视图的基本单位是ArrayBuffer, ArrayBuffer中只存储二进制格式的数据.ArrayBuffer不可直接读写, 必须通过视图(比如DataView)暴露的API.
Vue实战教程：如何用JS封装一个可复用的Loading组件
Jiaberrr的博客
09-28 562
通过以上步骤，我们成功在Vue项目中封装了一个可复用的Loading组件。在实际开发中，我们可以根据项目需求对Loading组件进行样式和功能的扩展，使其更加完善。封装组件是提高代码复用性和维护性的有效手段，希望本文能对你有所帮助。
Web认识 -- 第一课
ZxVSaccount的博客
09-30 1150
这里是我们进入前端学习的开端,在本次更新之后我会陆续上传html,css,javaScript等相关语言的教程,有感兴趣的小伙伴们点点关注,未来我们一起学习!IE、火狐和谷歌是目前互联网上的三大浏览器，其他常用的浏览器还有苹果的Safari浏览器和欧朋浏览器等。对于一般的网站，只要兼容IE浏览器、火狐浏览器和谷歌浏览器，就能满足绝大多数用户的需求。本节主要简单介绍了一下关于HTML、CSS、JavaScript的一些基本概念,有感兴趣的朋友,点点关注我们一起学习,博主持续更新中!
如何使用Redisson的布隆过滤器？
最新发布
付聪
10-02 297
【代码】如何使用Redisson的布隆过滤器？
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

旧梦时节

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值