JOSN学习笔记

本文深入探讨了JSON数据交互的轻量化特性及其在JavaScript中的应用。从JSON语法规则到基本结构,再到如何在JavaScript中处理JSON数据,文章详细介绍了JSON在数据交换领域的优势与实践方法。

JSON

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它基于JavaScript的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。这些特性使JSON成为理想的数据交换语言。易于人阅读和编写,同时也易于机器解析和生成。

JSON语法规则

JSON语法是JavaScript对象表示语法的子集,

  • 数据在名称/值对中
  • 数据由逗号分隔
  • 花括号保存对象
  • 方括号保存数组

JSON书写格式:名称/值对

{
"scores":[
 {"Chinese":"A","English":"B"},
 {"Chinese":"A","English":"B"},
 {"Chinese":"A","English":"B"}
 ]
}

 

JSON值类型:

  • 数字(整数或浮点数)
  • 字符串(在双引号中)
  • 逻辑值(true或false)
  • 数组(在方括号中)
  • 对象(在花括号中)
  • null

JSON的两种基本结构:

1、对象:“{}”,数据结构为{key:value,key:value,...}
取值方法:对象.key=?
2、数组“[]”,数据结构为["chinese","english","math",...]
取之方法:使用索引获取

基础示例:

名称/值对
{"chinese":"A"}
表示数组
{
"scores":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	]
}
{
"scores1":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	],
"scores2":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	],
"scores3":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	]
}

JavaScript中应用格式

JSON是JavaScript原生格式,所以在JavaScript中处理JSON数据不需要任何特殊的API或工具包。

var scores={
"scores":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	]
}

{
"scores1":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	],
"scores2":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	],
"scores3":[
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"},
	{"chinese":"A","english":"B"}
	]
}
访问数据:
var var1=scores.scores1[0].chinese

修改数据:
scores.scores1[0].chinese="A"

修改数据时需要把数据转换到文本格式
var newJSONtext=scores.toJSONString();
该文本字符串可以在任何地方使用,如Ajax中的请求字符串,可以将JavaScript对象转换为JSON文本,方式相同。

使用JSON只需调用一个简单的函数就可以获得经过格式化的数据,可以直接使用了。

JSON与XML比较

可读性:

JSON和XML不相上下,简易语法和规范的标签形式。

可扩展性:

都具有良好的可扩展性,但是在Javascript中JSON还是比较占优势,因为它可以存储Javascript符合对象。

 编码的可读性:

xml比较容易读懂
json读起来费解但是适合机器阅读。

编码的手写难度:

xml会好写一些,但是标记繁琐。
json写出来内容比xml简单。

### JSON数组的结构 JSON数组是一种有序的数据结构,用于存储多个值,这些值可以是不同的数据类型,如数字、字符串、布尔值、对象、数组等。JSON数组使用方括号`[]`来表示,并且每个元素之间用逗号`,`分隔。例如: ```json [ { "name": "Alice", "age": 30 }, { "name": "Bob", "age": 25 } ] ``` 在这个例子中,JSON数组包含了两个对象,每个对象都有`name`和`age`两个键值对。 ### JSON数组的使用方法 在JavaScript中,处理JSON数组通常涉及以下几个操作: - **创建JSON数组**:可以直接定义一个JSON数组,也可以从服务器端接收JSON数据。 ```javascript const jsonArray = [ { name: 'Alice', age: 30 }, { name: 'Bob', age: 25 } ]; ``` - **解析JSON字符串**:如果接收到的是JSON字符串,可以使用`JSON.parse()`方法将其转换为JSON数组。 ```javascript const jsonString = '[{"name":"Alice","age":30},{"name":"Bob","age":25}]'; const jsonArray = JSON.parse(jsonString); ``` - **序列化JSON数组**:当需要发送JSON数组到服务器时,可以使用`JSON.stringify()`方法将其转换为字符串。 ```javascript const jsonString = JSON.stringify(jsonArray); ``` - **访问JSON数组中的元素**:可以通过索引来访问数组中的特定元素。 ```javascript console.log(jsonArray[0].name); // 输出 "Alice" ``` - **遍历JSON数组**:可以使用循环来遍历数组中的每一个对象。 ```javascript jsonArray.forEach(person => { console.log(`Name: ${person.name}, Age: ${person.age}`); }); ``` - **修改JSON数组**:可以添加、删除或更新数组中的元素。 ```javascript // 添加元素 jsonArray.push({ name: 'Charlie', age: 35 }); // 删除元素 jsonArray.splice(1, 1); // 删除索引为1的一个元素 // 更新元素 jsonArray[0].age = 31; ``` - **过滤和查找**:可以使用数组的`filter()`和`find()`方法来查找特定的元素。 ```javascript // 过滤年龄大于30的人员 const filteredArray = jsonArray.filter(person => person.age > 30); // 查找名字为Bob的人员 const foundPerson = jsonArray.find(person => person.name === 'Bob'); ``` 以上就是JSON数组的基本结构和常用操作方法。JSON数组因其简洁性和易读性,在Web开发中被广泛采用,特别是在前后端数据交互过程中。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值