详解JavaScript中js对象与JSON格式字符串的相互转换


Posted in Javascript onFebruary 14, 2017

首先我们来看一下js中JSON格式的字符串

var JSONStr1 = "{\"name\" : \"张三\"}";

注意以下的写法不是js中JSON格式的字符串,它只是一个js的字符串。

var JSONStr2 = "{'name' : '张三'}";

我们看JSON语法中对于字符串的定义:是由双引号包围的任意数量Unicode字符的集合,使用反斜线转义。一个字符(character)即一个单独的字符串(character string)。

下面我们来看一下在js中怎么把JSON格式的字符串转换成一个JS对象。(

var jsObj3 = eval("(" + JSONStr1 + ")");
var jsObj4 = JSON.parse(JSONStr1);

推荐使用第二种方式具体原因请参看:http://www.json.org.cn/resource/json-in-javascript.htm

此外提一句使用这两种方式转换后的js对象,应该是“一个符合JSON数据格式的js对象”,也就是说它的属性是带着引号的,这只是我的一种猜测,因为如果JSON格式的字符串如下表示:

var JSONStr1 = "{\"f[name]\" : \"张三\"}";

那么转换后的JS对象的属性必定要加上引号,因为js对象的属性不加引号只能使用字母,数字,下划线和$符号表示,使用其它符号属性就要加上引号了,所以说JS对象字面量表示法中属性加上引号是不会错的。另外如果JSON格式的字符串如上所示,那么转换后的js对象对f[name]取值就不能使用 jsObj4.f[name] 要用 jsObj4['f[name]'] ,因为有特殊字符,这点要注意了。对于我的猜测,读者要有异议,可以提给我。

我们再来看看在js中js对象与JSON格式字符串的转换。下面我准备了几组js对象加以说明:

<input type="button" value="测试按钮1" onclick="testJson();"/>

<script type="text/javascript">
  //(1) 这是一个js对象
  var jsObj1 = {
    name : "张三"
  }
  //(2)这是一个内部带有方法js对象。
  var jsObj2 = {
    name : "张三",
    func : function(){
      alert("hello");
    }
  }
  //(3)这是一个符合JSON数据格式的js对象
  var jsonObj = {
    "name" : "张三",
    "age" : 10,
    "remark" : {"high" :170,"address" : "beijingshi"}
  }
  // js数组对象
  var jsArray = [
    {name : "张三"},
    {"age" : 10}
  ]

  function testJson(){

    var JSONstr1 = JSON.stringify(jsObj1);
    var JSONstr2 = JSON.stringify(jsObj2);
    var JSONstr3 = JSON.stringify(jsonObj);
    var JSONstr4 = JSON.stringify(jsArray);
    alert(JSONstr1);
    alert(JSONstr2);
    alert(JSONstr3);
    alert(JSONstr4);

  }

看一下弹框的内容:

               (1)

                                  (2)                                      

详解JavaScript中js对象与JSON格式字符串的相互转换                  详解JavaScript中js对象与JSON格式字符串的相互转换

                      (3)

                                                         

(4)

详解JavaScript中js对象与JSON格式字符串的相互转换详解JavaScript中js对象与JSON格式字符串的相互转换 

其中 (1)、(3)、(4)的执行结果说明,JSON解析器的stringify()函数对于js对象是fou符合JSON格式是不加限定,都可以把js对象转换成JSON格式字符串。

(2)的执行结果说明,js对象中如果没有JSON表示的值(比如函数和undefined)将会被排除。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
关于jquery ajax 调用带参数的webservice返回XML数据一个小细节
Jul 31 Javascript
Seajs的学习笔记
Mar 04 Javascript
Node.js实现批量去除BOM文件头
Dec 20 Javascript
总结Node.js中的一些错误类型
Aug 15 Javascript
JavaScript实现点击按钮复制指定区域文本(推荐)
Nov 25 Javascript
jQuery Password Validation密码验证
Dec 30 Javascript
BootStrap 模态框实现刷新网页并关闭功能
Jan 04 Javascript
JS组件系列之MVVM组件 vue 30分钟搞定前端增删改查
Apr 28 Javascript
SpringMVC+bootstrap table实例详解
Jun 02 Javascript
判断滚动条滑到底部触发事件(实例讲解)
Nov 15 Javascript
node错误处理与日志记录的实现
Dec 24 Javascript
判断文字超过2行添加展开按钮,未超过则不显示,溢出部分显示省略号
Apr 28 Javascript
微信小程序 Nginx环境配置详细介绍
Feb 14 #Javascript
用file标签实现多图文件上传预览
Feb 14 #Javascript
利用策略模式与装饰模式扩展JavaScript表单验证功能
Feb 14 #Javascript
javascript中BOM基础知识总结
Feb 14 #Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
Feb 14 #Javascript
浅谈js中用$(#ID)来作为选择器的问题(id重复的时候)
Feb 14 #Javascript
js 实现获取name 相同的页面元素并循环遍历的方法
Feb 14 #Javascript
You might like
PHP 已经成熟
2006/12/04 PHP
PHP操作xml代码
2010/06/17 PHP
js parentElement和offsetParent之间的区别
2010/03/23 Javascript
如何判断元素是否为HTMLElement元素
2013/12/06 Javascript
JavaScript面向对象编程入门教程
2014/04/16 Javascript
浅谈javascript中replace()方法
2015/11/10 Javascript
动态更新highcharts数据的实现方法
2016/05/28 Javascript
微信小程序开发入门基础教程
2017/04/19 Javascript
jQuery Jsonp跨域模拟搜索引擎
2017/06/17 jQuery
JS中的事件委托实例浅析
2018/03/22 Javascript
如何用JavaScript实现功能齐全的单链表详解
2019/02/11 Javascript
详解如何探测小程序返回到webview页面
2019/05/14 Javascript
Angular处理未可知异常错误的方法详解
2021/01/17 Javascript
Python Requests安装与简单运用
2016/04/07 Python
实例讲解Python的函数闭包使用中应注意的问题
2016/06/20 Python
对python模块中多个类的用法详解
2019/01/10 Python
python图像和办公文档处理总结
2019/05/28 Python
python 弹窗提示警告框MessageBox的实例
2019/06/18 Python
python使用paramiko模块通过ssh2协议对交换机进行配置的方法
2019/07/25 Python
Django框架表单操作实例分析
2019/11/04 Python
python matplotlib 绘图 和 dpi对应关系详解
2020/03/14 Python
如何使用python自带IDLE的几种方法
2020/10/10 Python
python Scrapy爬虫框架的使用
2021/01/21 Python
让IE6、IE7、IE8支持CSS3的脚本
2010/07/20 HTML / CSS
Boom手表官网:瑞典手表品牌,设计你的手表
2019/03/11 全球购物
出国导师推荐信
2014/01/16 职场文书
幸福家庭事迹材料
2014/02/03 职场文书
大四学生找工作的自荐信
2014/03/27 职场文书
我们的节日国庆活动方案
2014/08/19 职场文书
规范化管理年活动总结
2014/08/29 职场文书
2015年社区工作总结
2015/04/08 职场文书
幼儿园毕业致辞
2015/07/29 职场文书
python 爬取吉首大学网站成绩单
2021/06/02 Python
vue+iview实现手机号分段输入框
2022/03/25 Vue.js
mysql的Buffer Pool存储及原理
2022/04/02 MySQL
python使用shell脚本创建kafka连接器
2022/04/29 Python