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 相关文章推荐
运用Windows XP附带的Msicuu.exe、Msizap.exe来彻底卸载顽固程序
Apr 21 Javascript
jQuery建立一个按字母顺序排列的友好页面索引(兼容IE6/7/8)
Feb 26 Javascript
jquery each的几种常用的使用方法示例
Jan 21 Javascript
javascript怎么禁用浏览器后退按钮
Mar 27 Javascript
JavaScript实现简单图片滚动附源码下载
Jun 17 Javascript
node.js不得不说的12点内容
Jul 14 Javascript
js单独获取一个checkbox看其是否被选中
Sep 22 Javascript
JavaScript+canvas实现七色板效果实例
Feb 18 Javascript
Javascript缓存API
Jun 14 Javascript
使用vue框架 Ajax获取数据列表并用BootStrap显示出来
Apr 24 Javascript
js中arguments对象的深入理解
May 14 Javascript
vue.js中ref和$refs的使用及示例讲解
Aug 14 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
通过下拉框的值来确定输入框是否可以为空的代码
2011/10/18 Javascript
javascript中RegExp保留小数点后几位数的方法分享
2013/08/13 Javascript
javascript 按键事件(兼容各浏览器)
2013/12/20 Javascript
jQuery中操控hidden、disable等无值属性的方法
2014/01/06 Javascript
jQuery的animate函数实现图文切换动画效果
2015/05/03 Javascript
jQuery+jsp实现省市县三级联动效果(附源码)
2015/12/03 Javascript
JavaScript的Backbone.js框架入门学习指引
2016/05/07 Javascript
JS获取屏幕高度的简单实现代码
2016/05/24 Javascript
jQuery.ajax 跨域请求webapi设置headers的解决方案
2016/08/08 Javascript
详解使用Visual Studio Code对Node.js进行断点调试
2017/09/14 Javascript
解决Mac下安装nmp的淘宝镜像失败问题
2018/05/16 Javascript
JavaScript创建防篡改对象的方法分析
2018/12/30 Javascript
详解vue挂载到dom上会发生什么
2019/01/20 Javascript
15个简单的JS编码标准让你的代码更整洁(小结)
2020/07/16 Javascript
JS前端基于canvas给图片添加水印
2020/11/11 Javascript
python复制文件的方法实例详解
2015/05/22 Python
python 生成器生成杨辉三角的方法(必看)
2017/04/10 Python
python根据list重命名文件夹里的所有文件实例
2018/10/25 Python
基于h5py的使用及数据封装代码
2019/12/26 Python
tensorflow自定义激活函数实例
2020/02/04 Python
python 伯努利分布详解
2020/02/25 Python
Spring http服务远程调用实现过程解析
2020/06/11 Python
tensorflow下的图片标准化函数per_image_standardization用法
2020/06/30 Python
让IE可以变相支持CSS3选择器
2010/01/21 HTML / CSS
纯css3实现的动画按钮的实例教程
2014/11/17 HTML / CSS
CSS3实现线性渐变用法示例代码详解
2020/08/07 HTML / CSS
挪威户外活动服装和装备购物网站:Bergfreunde挪威
2016/10/20 全球购物
澳大利亚婴儿喂养品牌:Cherub Baby
2018/11/01 全球购物
投标人廉洁自律承诺书
2014/05/26 职场文书
团队拓展活动方案
2014/08/28 职场文书
2014年租房协议书范本
2014/10/30 职场文书
公务员政审材料
2014/12/23 职场文书
前台接待岗位职责
2015/02/03 职场文书
2015年世界环境日演讲稿
2015/03/18 职场文书
小学数学教师研修日志
2015/11/13 职场文书
JS实现刷新网页后之前浏览位置保持不变示例详解
2022/08/14 Javascript