JS对象和字符串之间互换操作实例分析


Posted in Javascript onFebruary 02, 2019

本文实例讲述了JS对象和字符串之间互换操作。分享给大家供大家参考,具体如下:

平时在工作中大家一定也有过这样的需求,就是有时候需要把一个json对象转换为字符串,有时候要把一个类似json对象的字符串转换为json对象,那么今天就来总结一下,js的方法

1. json对象转字符串

这个API很简单就是 JSON.stringify() ,只需要把你要转换的对象写到括号里就行了,下面有一个小demo

let json = {
  msg:"json转字符串",
  name:"前端林三哥",
  skill:"handsome"
}
let str = JSON.stringify(json);
console.log(str);

结果如下:

JS对象和字符串之间互换操作实例分析

很简单!

2. 字符串转json对象

有两种情况

① 规范的json转对象
② 不规范的json转对象

举个例子,怎么算规范的json呢,就是任何变量都用双引号

let json2 = '{"msg":"json转字符串","name":"前端林三哥","skill":"handsome"}'

这样,单引号里面全都是双引号,可以用 JSON.parse() 把要转的字符串放入括号里就ok了,小demo

let json2 = '{"msg":"json转字符串","name":"前端林三哥","skill":"handsome"}'
json2 = JSON.parse(json2);
console.log(json2);

结果如下

JS对象和字符串之间互换操作实例分析

再有一种不是很规范的json对象,因为我们有时候开发,js是弱类型的语言,也有不规范的时候,比如有些人就喜欢用单引号(有什么办法),比如下面的

let arr = "[{'name': '\u53d6\u6d88\u8ba2\u5355\u91cf', 'type': '1', 'value1': '<', 'value2': '100'}]";

如果我们用 JSON.parse() 的话,让我们来试试

结果如下:

JS对象和字符串之间互换操作实例分析

为什么会出现这个结果,因为我们的字符串里面并不是一个规范的json,因为规范的json,全都是用的双引号,而我们都是用的单引号,所以,我们只能用另一种办法 eval('('+ str +')')
让我们来试试

let arr = "[{'name': '\u53d6\u6d88\u8ba2\u5355\u91cf', 'type': '1', 'value1': '<', 'value2': '100'}]";
let obj = eval('('+arr+')');
console.log(obj);

结果如下:

JS对象和字符串之间互换操作实例分析

我们发现成功了,好了,今天就写到这里吧,我说了这么多,其实我在记笔记,哈哈!

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js loading加载效果实现代码
Nov 24 Javascript
可以将word转成html的js代码
Apr 11 Javascript
屏蔽script注入小例子
Nov 12 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
Mar 14 Javascript
JavaScript Sort 的一个错误用法示例
Mar 20 Javascript
js实现类似MSN提示的页面效果代码分享
Aug 24 Javascript
Angular4 ElementRef的应用
Feb 26 Javascript
在iFrame子页面里实现模态框的方法
Aug 17 Javascript
js实现随机div颜色位置 类似满天星效果
Oct 24 Javascript
jQuery Datatables 动态列+跨列合并实现代码
Jan 30 jQuery
Vue单文件组件开发实现过程详解
Jul 30 Javascript
如何通过简单的代码描述Angular父组件、子组件传值
Apr 07 Javascript
Vue+Element UI+Lumen实现通用表格分页功能
Feb 02 #Javascript
JS基于ES6新特性async await进行异步处理操作示例
Feb 02 #Javascript
JS使用canvas中的measureText方法测量字体宽度示例
Feb 02 #Javascript
JS使用对象的defineProperty进行变量监控操作示例
Feb 02 #Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
Feb 02 #Javascript
通过cordova将vue项目打包为webapp的方法
Feb 02 #Javascript
用Cordova打包Vue项目的方法步骤
Feb 02 #Javascript
You might like
ajax实现无刷新分页(php)
2010/07/18 PHP
Thinkphp中的volist标签用法简介
2014/06/18 PHP
PHP基于ip2long实现IP转换整形
2020/12/11 PHP
[原创]站长必须要知道的javascript广告代码
2007/05/30 Javascript
js removeChild 障眼法 可能出现的错误
2009/10/06 Javascript
Jquery显示、隐藏元素以及添加删除样式
2013/08/09 Javascript
jquery更换文章内容与改变字体大小代码
2013/09/30 Javascript
JS获取select的value和text值的简单实例
2014/02/26 Javascript
js实现div弹出层的方法
2014/11/20 Javascript
kindeditor修复会替换script内容的问题
2015/04/03 Javascript
JavaScript中的setUTCDate()方法使用详解
2015/06/11 Javascript
js实现select下拉框菜单
2015/12/08 Javascript
html5+canvas实现支持触屏的签名插件教程
2017/05/08 Javascript
vue项目中应用ueditor自定义上传按钮功能
2018/04/27 Javascript
快速解决brew安装特定版本flow的问题
2018/05/17 Javascript
vue mounted组件的使用
2018/06/18 Javascript
在vue项目中引入高德地图及其UI组件的方法
2018/09/04 Javascript
原生JS实现逼真的图片3D旋转效果详解
2019/02/16 Javascript
如何实现小程序tab栏下划线动画效果
2019/05/18 Javascript
elementUI select组件使用及注意事项详解
2019/05/29 Javascript
vue下axios拦截器token刷新机制的实例代码
2020/01/17 Javascript
[15:09]DOTA2国际邀请赛采访专栏:Loda
2013/08/06 DOTA
Python设计模式之状态模式原理与用法详解
2019/01/15 Python
python3 使用Opencv打开USB摄像头,配置1080P分辨率的操作
2019/12/11 Python
乐天旅游台湾网站:Rakuten Travel TW
2017/06/01 全球购物
美国领先的在线邮轮旅游公司:CruiseDirect
2018/06/07 全球购物
全球领先的在线cosplay服装商店:RoleCosplay
2020/01/18 全球购物
PHP解析URL是哪个函数?怎么用?
2013/05/09 面试题
员工三分钟演讲稿
2014/08/19 职场文书
领导四风问题整改措施思想汇报
2014/10/13 职场文书
党员组织生活会发言材料
2014/10/17 职场文书
感谢信怎么写
2015/01/21 职场文书
2015年团支部工作总结
2015/04/03 职场文书
CocosCreator入门教程之网络通信
2021/04/16 Javascript
改造DE1103三步曲
2022/04/07 无线电
Zabbix对Kafka topic积压数据监控的问题(bug优化)
2022/07/07 Servers