JSON定义及应用
1 什么是JSON?
JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation)
是轻量级的文本数据交换格式,JSON 比 XML 更小、更快,更易解析。
2 JSON 语法规则
JSON 语法是 JavaScript 对象表示语法的子集。
- 数据在名称/值对中
- 数据由逗号分隔
- 大括号保存对象
- 中括号保存数组
JSON 值可以是:字符串, 数字, 对象, 数组, 布尔值 或 null
JavaScript 的值可以是:JSON 数据类型,也可以是 JavaScript 的表达式,包括函数,日期,及 undefined
3 JSON和JavaScript对象之间的转换
(1)JSON.parse()
需求:JSON 通常用于与服务端交换数据,在接收服务器数据时一般是字符串
作用:将json格式的字符串转换为JavaScript对象
语法: JSON.parse(text[, reviver])
参数说明:
- text:必需, 一个有效的 JSON 字符串。
- reviver: 可选,一个转换结果的函数, 将为对象的每个成员调用此函数。
返回值:对象或数组
示例一:
var jsonStr = '{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }'; // json格式的字符串
var obj = JSON.parse(jsonStr); // JavaScript对象
document.write("name = " + obj.name);
document.write("name = " + obj[name]); // 第二种写法
示例二:
var text = '{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';
var obj = JSON.parse(text, function (key, value) { // 函数会遍历字符串中所有key和value,得到返回的value
if (key == "initDate") {
return new Date(value);
} else {
return value;
}});
document.write("创建日期:" + obj.initDate); // 输出,创建日期:Sat Dec 14 2013 08:00:00 GMT+0800 (中国标准时间)
(2)JSON.stringify()
需求:JSON 通常用于与服务端交换数据,在向服务器发送数据时一般是字符串
作用:将JavaScript对象转换为json格式的字符串
语法: JSON.stringify(value[, replacer[, space]])
参数说明:
- text:必需, JavaScript对象或数组。
- replacer: 可选。用于转换结果的函数或数组。
如果 replacer 是函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined,则排除成员。根对象的键是一个空字符串:""。
如果 replacer 是数组,则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时,将忽略 replacer 数组。(意思就是,对象或数组中key值如果在数组中存在,才保留。不存在的就去掉)
- space: 可选,文本添加缩进、空格和换行符,如果 space 是一个数字,则返回值文本在每个级别缩进指定数目的空格,如果 space 大于 10,则文本缩进 10 个空格。space 也可以使用非数字,如:\t。
返回值:json格式的字符串
示例一:
var obj = { "name":"runoob", "initDate":new Date(), "alexa":10000};
var jsonStr= JSON.stringify(obj);
document.write(jsonStr); // 输出,{"name":"runoob","initDate":"2019-04-04T08:56:59.679Z","alexa":10000}
实例二:
函数 var obj = { "name":"Runoob", "age":23, "site":"www.runoob.com"};
var jsonStr = JSON.stringify(obj, function(key,value){
if (key == "age") {
return 55;
}
return value;
}, '\t');
document.write(jsonStr); // 输出,{"name":"Runoob","age":55,"site":"www.runoob.com"} 数组 var obj = { "name":"Runoob", "age":23, "site":"www.runoob.com"};
var jsonStr = JSON.stringify(obj, [site,name], '\t'); // 保留数组中出现的对象的key值,按数组的顺序
document.write(jsonStr); // 输出,{"site":"www.runoob.com","name":"Runoob"}
(3)eval()
作用:使用的是 JavaScript 编译器,可解析 JSON 文本,然后生成 JavaScript 对象。必须把文本包围在括号中,这样才能避免语法错误
语法: var obj = eval ("(" + txt + ")");
参数说明:
- string:必需, 可以表示要计算的 JavaScript 表达式或要执行的语句。
返回值:返回计算string的值,如果有的话 (没有则不做任何改变返回)
示例一:
// 表达式
eval("x=10;y=20;document.write(x*y)"); //output为200
document.write(eval("2+2")); //output为4
var x=10;
document.write(eval(x+17)); //output为27 // json格式字符串
7 var json = '{"name":"GDT","age":23,"University":"GDUT"}';
8 var info = eval('(' + json + ')'); //解析为JSON对象
9 document.write(info); //output为[object Object]
3.1 为什么eval()要用一对圆括号将字符串包起来?
- 原因:归结于eval本身的问题,由于json是以”{}”的方式来开始以及结束的,在JS中,它会被当成一个语句块来处理,所以必须强制性的将它转换成一种表达式。
- 解决方法:加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将括号内的表达式(expression)转化为对象,而不是作为语句(statement)来执行。举一个例子,例如对象字面量{},如若不加外层的括号,那么eval会将大括号识别为JavaScript代码块的开始和结束标记,那么{}将会被认为是执行了一句空语句。请看下列例子的不同
alert(eval("{}")); // return undefined
alert(eval('('+'{}'+')')); // return object[Object]
另外,相对于写法格式严格的JSON.parse()来说,eval()可以解析任何字符串,eval是不安全的,因为eval比较宽松,会有潜在的安全性问题。比如以下代码:
var str1 = '{"a":"b"}';
document.write(eval("("+str1+")")); //正常解析为对象
var str2 = '{"a": (function(){alert("I can do something bad!");})()}';
eval('('+str2+')'); //可以用来执行木马脚本
总结:第一次写自己的技术博文,很多都是从其他地方借鉴的。毕竟是第一次写,有不对的地方也请见谅,也暴露了我自己的逻辑思维需要提升了,讲述一个问题的解答方法比理解一个问题更难,希望以后能靠自己就写出好的博文,坚持就是胜利。
加油 2019!
【参考】
- https://www.cnblogs.com/DTBelieve/p/5346603.html JSON.parse()、JSON.stringify()、eval()讲解
- http://www.runoob.com/json/json-tutorial.html JSON教程
JSON定义及应用的更多相关文章
- struts2 json 定义全局Date格式
使用struts2的json插件时,自己定义日期格式经常使用的方式是在get属性上加入@JSON注解,这个对于少量Date属性还能够,可是假设date字段多了,总不可能去给每一个date get方法加 ...
- 再谈JSON -json定义及数据类型
再谈json 近期在项目中使用到了highcharts ,highstock做了一些统计分析.使用jQuery ajax那就不得不使用json, 可是在使用过程中也出现了非常多的疑惑,比方说,什么情况 ...
- JSON语法及JSON定义规范化
版权声明:本文为博主原创文章,未经博主允许不得转载. https://www.cnblogs.com/zhuhui-site/p/10090541.html 一.前言 JSON(JavaScrip ...
- IOS下WEBVIEW 的javascript数组与json定义 及交互
最近在折腾IOS新闻浏览客户端,当中需要用到webview传递JSON数据到IOS上,然后在IOS上解析.刚入门IOS不久,看了不少的书,但都是囫囵吞枣.在开发过程中,遇到不少问题.开发环境mac m ...
- JSON定义
如果我们要在不同的编程语言之间传递对象,就必须把对象序列化为标准格式,比如xml,但更好的方法是序列化为JSON,因为JSON表示出来就是一个字符串,可以被所有语言读取,也可以方便地存储到磁盘或者通过 ...
- (The application/json Media Type for JavaScript Object Notation (JSON))RFC4627-JSON格式定义
原文 http://laichendong.com/rfc4627-zh_cn/ 摘要 JavaScript Object Notation (JSON)是一个轻量级的,基于文本的,跨语言的数据交换 ...
- 使用 Json Schema 定义 API
本文地址:使用 Json Schema 定义 API 前面我们介绍了 Json Schema 的基本内容,这篇文章我们结合 jsonschema2pojo 工具深入分析如何使用 Json Schema ...
- JSON与XML的区别比较
1.定义介绍 (1).XML定义扩展标记语言 (Extensible Markup Language, XML) ,用于标记电子文件使其具有结构性的标记语言,可以用来标记数据.定义数据类型,是一种允许 ...
- android 学习JSON
JSON的定义: 一种轻量级的数据交换格式,具有良好的可读和便于快速编写的特性.业内主流技术为其提供了完整的解决方案(有点类似于正则表达式 ,获得了当今大部分语言的支持),从而可以在不同平台间进行数据 ...
随机推荐
- Linux 添加yum命令
第一步,国内的yum仓库 http://mirrors.163.com/centos/7/os/x86_64/Packages/ http://mirrors.aliyun.com/centos/7/ ...
- JS读取本地IP地址信息
HTML <div> <p>点击下面的按钮,查看本地IP信息</p> <span class="span">点击查看</spa ...
- vs code上配置Scala
转自:https://www.cnblogs.com/steven-yang/p/5852988.html 百度的结果表达太奇怪,简单记一笔. 1.下载一个scala的压缩包,https://www. ...
- 新手,再来1个 vue2入门的教程,有源码参考
在这之前有入门的,作者写的不错的, 照着来一下,也收益颇多,上个例子是基于 "dependencies": { "vue": "^2.2.6&qu ...
- python学习笔记之——正则表达式
1.re模块 Python通过re模块提供对正则表达式的支持,re 模块使 Python 语言拥有全部的正则表达式功能.使用re的一般步骤是先将正则表达式的字符串形式编译为Pattern实例,然后使用 ...
- Android SDK开发与使用的那些事儿
前言 最近由于工作需要,将应用里的部分功能独立了出来,封装成 SDK 提供给合作伙伴使用.由于经验不足,网上也没多少写这方面内容的文章,遇到了不少的坑,决定记录下来. SDK 其实,刚说到要写SDK也 ...
- Java快速入门-03-小知识汇总篇(全)
Java快速入门-03-小知识汇总篇(全) 前两篇介绍了JAVA入门的一系小知识,本篇介绍一些比较偏的,说不定什么时候会用到,有用记得 Mark 一下 快键键 常用快捷键(熟记) 快捷键 快捷键作用 ...
- 【转】OmniGraffle (一)从工具栏开始
原文链接:http://www.jianshu.com/p/52f3ecbe8f2d OmniGraffle的软件布局和大多数图形类软件类似,中间是编辑区,左边是页面和对象组织的管理,右边是参数设置和 ...
- PG数据库空间大小及数据库对象占用空间大小
select pg_size_pretty(pg_database_size('lrisk')); --查询数据库剩余空间 select pg_database.datname,pg_size_pre ...
- java获取中文拼音首字母
import net.sourceforge.pinyin4j.PinyinHelper; public class PinyinHelperUtil { /** * 得到中文首字母(中国 -> ...