js中json对象和字符串的理解及相互转化操作实现方法


Posted in Javascript onSeptember 22, 2017

本文实例讲述了js中json对象和字符串的理解及相互转化操作实现方法。分享给大家供大家参考,具体如下:

<script>
 var str="{'strv':["+
       "{'a':'a11'},"+
       " {'a':'b222'}"+
     " ]}";
 //如果放在一行更清楚:var str="{'strv':[{'a':'a11'}, {'a':'b222'} ]}";
 var str2=eval('('+str+')');
// alert(str2.strv[1].a);
 var jsonob={'jsonv':[
         {'j':'j111'},
         {'j':'j222'}
       ]};
//如果放在一行更清楚:var jsonob={'jsonv':[ {'j':'j111'}, {'j':'j222'} ]};
// alert(jsonob.jsonv[1].j);
 /*
var  str="{'strv':[{'a':'a11'}, {'a':'b222'} ]}";
var jsonob={'jsonv':[ {'j':'j111'}, {'j':'j222'} ]};
这样我们可以看出json对象和字符串是不一样的!
字符串就是字符串,json对象是一个对象。
虽然其内容都是我们看到的json格式,但是两者是有区别的。
我们想取出其中某个属性的值,其实是对json对象操作的(你能取出对象的属性值,但不能取出字符串的属性值,字符串没属性。)。
所以如果你拿到的是对象,那你就直接可以取值了,
例如jsonob.jsonv[1].j。
如果你拿到的是字符串,那你必须先转化成对象才可以取值,
字符串转对象有几种方法,js本身自带的是var str2=eval('('+str+')');
这里的str2就是对象了。如果你引入了json.js文件,还可以使用其中的
方法,这些都已经封装好了。
总结:json只是一种格式。符合这种格式的可以是json对象,也可以是字符串。
要取属性值只能从对象里取。所以需要两者的转化。
js自带的转化方法:
 字符串转成json对象:
   var str="{'strv':[{'a':'a11'}, {'a':'b222'} ]}";//字符串
   var jsonObject=eval('('+str+')');//json对象
 json对象转成字符串:
   js本身没有这样的方法,你需要自己写这样的方法,才能转化。
从上可知,js本身只可以将字符串转成json对象,
但不可以将json对象转成字符串。其实我们可以用
json.js里的方法,而且更简单。这时你要引入json.js文件。
json.js里的方法:
 字符串转成json对象:
     var str="{'strv':[{'a':'a11'}, {'a':'b222'} ]}";//字符串
  转成json对象方法1: var myJSONObject1=str.parseJSON();
  转成json对象方法2: var myJSONObject2=JSON.parse(str);
 json对象转成字符串:
     var jsonob={'jsonv':[ {'j':'j111'}, {'j':'j222'} ]};//json对象
  转成字符串方法1:var mystr1=jsonob.toJSONString();
  转成字符串方法2: var mystr2=JSON.stringify(jsonob);
 */
</script>

通过实验,我们应该明白,json其实是一种格式,js本身支持这种格式,

所以你不需要引入json.js就可以使用json对象。我们一般会引入json.js因为这里面封装了json对象和字符串转化的方法,方便我们使用(当然还有其他方法)。

通过本例我们更好地理解json对象和字符串之间的区别。

Javascript 相关文章推荐
基于jquery实现的上传图片及图片大小验证、图片预览效果代码
Apr 12 Javascript
javascript结合canvas实现图片旋转效果
May 03 Javascript
利用jQuery及AJAX技术定时更新GridView的某一列数据
Dec 04 Javascript
JavaScript弹出对话框的三种方式
Mar 23 Javascript
javascript中apply、call和bind的使用区别
Apr 05 Javascript
一种基于浏览器的自动小票机打印实现方案(js版)
Jul 26 Javascript
JavaScript仿聊天室聊天记录
Dec 27 Javascript
react实现pure render时bind(this)隐患需注意!
Mar 09 Javascript
基于 Vue.js 之 iView UI 框架非工程化实践记录(推荐)
Nov 21 Javascript
基于JavaScript实现幸运抽奖页面
Jul 05 Javascript
《javascript少儿编程》location术语总结
May 27 Javascript
Element中的Cascader(级联列表)动态加载省\市\区数据的方法
Mar 27 Javascript
利用javascript如何随机生成一定位数的密码
Sep 22 #Javascript
ES6中新增的Object.assign()方法详解
Sep 22 #Javascript
Vee-Validate的使用方法详解
Sep 22 #Javascript
Js中async/await的执行顺序详解
Sep 22 #Javascript
Node.js自定义实现文件路由功能
Sep 22 #Javascript
详解bootstrap用dropdown-menu实现上下文菜单
Sep 22 #Javascript
javascript计算渐变颜色的实例
Sep 22 #Javascript
You might like
PHP校验15位和18位身份证号的类封装
2018/11/07 PHP
StringTemplate遇见jQuery冲突的解决方法
2011/09/22 Javascript
js转义字符介绍
2013/11/05 Javascript
javascript验证身份证完全方法具体实现
2013/11/18 Javascript
利用JavaScript实现新闻滚动效果(实例代码)
2013/11/27 Javascript
php和js对数据库图片进行等比缩放示例
2014/04/28 Javascript
jquery如何判断表格同一列不同行input数据是否重复
2014/05/14 Javascript
jQuery中click事件的定义和用法
2014/12/20 Javascript
javascript设置和获取cookie的方法实例详解
2016/01/05 Javascript
jQuery 限制输入字符串长度
2016/06/20 Javascript
全面了解javascript中的错误处理机制
2016/07/18 Javascript
Vue.js 2.0 和 React、Augular等其他前端框架大比拼
2016/10/08 Javascript
js实现HashTable(哈希表)的实例分析
2016/11/21 Javascript
关于Vue.js 2.0的Vuex 2.0 你需要更新的知识库
2016/11/30 Javascript
简单几步实现返回顶部效果
2016/12/05 Javascript
jQuery实现上传图片前预览效果功能
2017/08/03 jQuery
原生js中ajax访问的实例详解
2017/09/19 Javascript
vue单页应用加百度统计代码(亲测有效)
2018/01/31 Javascript
Vue2.0用户权限控制解决方案的示例
2018/02/10 Javascript
Vue中的slot使用插槽分发内容的方法
2018/03/01 Javascript
jQuery中实现text()的方法
2019/04/04 jQuery
vue常用高阶函数及综合实例
2021/02/25 Vue.js
[23:18]Spirit vs Liquid Supermajor小组赛A组 BO3 第二场 6.2
2018/06/03 DOTA
Python中的Classes和Metaclasses详解
2015/04/02 Python
Windows安装Python、pip、easy_install的方法
2017/03/05 Python
利用python和百度地图API实现数据地图标注的方法
2019/05/13 Python
python创建文本文件的简单方法
2020/08/30 Python
HTML实现代码雨源码及效果示例
2020/02/25 HTML / CSS
决心书标准格式
2014/03/11 职场文书
初一新生军训方案
2014/05/22 职场文书
大专学生求职信
2014/07/04 职场文书
2015年评职称工作总结范文
2015/04/20 职场文书
困难补助申请报告
2015/05/19 职场文书
行政处罚告知书
2015/07/01 职场文书
Python使用sql语句对mysql数据库多条件模糊查询的思路详解
2021/04/12 Python
Python 详解通过Scrapy框架实现爬取百度新冠疫情数据流程
2021/11/11 Python