JavaScript前后端JSON使用方法教程


Posted in Javascript onNovember 23, 2020

汇总整理下JSON在JavaScript前后端中的使用方法,包括字符串和JSON对象的互转,JSON数组的遍历,JSON对象key值的获取,JSON内容格式化输出到文件,读取JSON内容文件转化为JSON对象等。

一、JavaScript后端JSON操作方法

1、JavaScript JSON字符串转JSON对象

var testStr = '{"name":"will","age":18,"hobby":"football"}'
var jsonObj = JSON.parse(testStr)

2、JS JSON对象转字符串

var testObj = {
 "name": 'will',
 "age": '18',
 "hobby": 'football'
}
var jsonStr = JSON.stringify(testObj)

3、JavaScript JSON数组的遍历

一种是for循环遍历:

for (var l = 0; l < jsonArray.length; l++) {
 var jsonItem = jsonArray[l]
}

一种是键值遍历:

var testJSArray = [
 {"number": 'one'},
 {"number": "two"},
 {"number": "three"},
 {"number": "four"},
 {"number": "five"},
 {"number": "six"},
]
for(index in testJSArray){
 console.log("index:" + index + "; name:" + testJSArray[index].number)
}

输出内容如下:

index:0; number:one
index:1; number:two
index:2; number:three
index:3; number:four
index:4; number:five
index:5; number:six

4、JS JSON数组合并

数组合并连接用concat方法,前端和后端都是用concat。

var testJSArray01 = [
 {"name": 'one'},
 {"name": "two"},
 {"name": "three"},
]
var testJSArray02 = [
 {"name": "four"},
 {"name": "five"},
 {"name": "six"},
]
var testJSONMerge = testJSArray01.concat(testJSArray02)

5、JavaScript获取JSON对象key值

var testObj = {
 "name": 'will',
 "age": '18',
 "hobby": 'football'
}
for (var key in testObj){
 console.log("key:" + key + ", value:" + testObj[key])
}

输出内容如下:

key:name, value:will
key:age, value:18
key:hobby, value:football

6. JS格式化输出JSON内容到文件

var writeStream = fs.createWriteStream(filePath);

return new Promise(function(resolve, reject) {
 writeStream.write("写入你需要的字符串内容");
 // 换行,如果是字符串中包含换行的字符,写入到.txt文件的时候并不能换行,需要输出换行符才行。
 writeStream.write("\n");
 // 格式化输出JSON字符串内容, JSONObj是要输出的JSON数据对象
 writeStream.write(JSON.stringify(JSONObj, null, "\t") + "\n");

 writeStream.end();
 writeStream.on('finish', () => {
 resolve(filePath);
 });
});

7、JavaScript读取JSON文件内容

不管内容是保存成.json还是.txt,只要是合法的JSON字符串内容都可以。

var filePath = 'xxx/xxx/test.json'
var fileContent = fs.readFileSync(filePath).toString();
var fileJson = JSON.parse(fileContent);

二、JavaScript前端JSON操作方法

1、字符串转JSON,angular.fromJson() 等价于JSON.parse()

var processInfo = angular.fromJson('{"process":[]}');

2、JSON转字符串,angular.toJson() 等价于JSON.stringify()

var out = angular.toJson(jsonObj, true);

3、JSON数组遍历

angular.forEach(jsonArray, function(jsonItem) {

});

4、判断JSON对象是否含有某个Key值

比如判断jsonObj这个对象是否含有“samples”这个key值

jsonObj.hasOwnProperty("samples")

总结

到此这篇关于JavaScript前后端JSON使用方法教程的文章就介绍到这了,更多相关JS前后端JSON使用内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
国外的为初学者写的JavaScript教程
Jun 09 Javascript
Aptana调试javascript图解教程
Nov 30 Javascript
Javascript生成json的函数代码(可以用php的json_decode解码)
Jun 11 Javascript
js css后面所带参数含义介绍
Aug 18 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
Nov 16 Javascript
基于javascript实现图片懒加载
Jan 05 Javascript
JavaScript  cookie 跨域访问之广告推广
Apr 20 Javascript
js 博客内容进度插件详解
Feb 19 Javascript
jquery中each循环的简单回滚操作
May 05 jQuery
vue 项目如何引入微信sdk接口的方法
Dec 18 Javascript
js中arguments对象的深入理解
May 14 Javascript
js字符串类型String常用操作实例总结
Jul 05 Javascript
微信小程序实现简单的select下拉框
Nov 23 #Javascript
记录一次websocket封装的过程
Nov 23 #Javascript
一篇文章让你搞懂JavaScript 原型和原型链
Nov 23 #Javascript
微信小程序实现锚点跳转
Nov 23 #Javascript
javascript实现电商放大镜效果
Nov 23 #Javascript
用webAPI实现图片放大镜效果
Nov 23 #Javascript
Vue 的 v-model用法实例
Nov 23 #Vue.js
You might like
php+jquery编码方面的一些心得(utf-8 gb2312)
2010/10/12 PHP
php5.3后静态绑定用法详解
2016/11/11 PHP
PHP微信模板消息操作示例
2017/06/29 PHP
php中get_object_vars()在数组的实例用法
2021/02/22 PHP
JQuery 确定css方框模型(盒模型Box Model)
2010/01/22 Javascript
基于jquery.Jcrop的头像编辑器
2010/03/01 Javascript
EXTJS FORM HIDDEN TEXTFIELD 赋值 使用value不好用的问题
2011/04/16 Javascript
JS TextArea字符串长度限制代码集合
2012/10/31 Javascript
JavaScript设计模式之外观模式介绍
2014/12/28 Javascript
javascript实现倒计时并弹窗提示特效
2015/06/05 Javascript
遮罩层点击按钮弹出并且具有拖动和关闭效果(两种方法)
2015/08/20 Javascript
dedecms页面如何获取会员状态的实例代码
2016/03/15 Javascript
JS实现弹出居中的模式窗口示例
2016/06/20 Javascript
jQuery深拷贝Json对象简单示例
2016/07/06 Javascript
JQuery和HTML5 Canvas实现弹幕效果
2017/01/04 Javascript
微信小程序动态生成二维码的实现代码
2018/07/25 Javascript
ES6学习教程之Promise用法详解
2020/11/22 Javascript
简单介绍Python中利用生成器实现的并发编程
2015/05/04 Python
PyQT实现多窗口切换
2018/04/20 Python
使用pip发布Python程序的方法步骤
2018/10/11 Python
python实现一个简单的ping工具方法
2019/01/31 Python
python读取图像矩阵文件并转换为向量实例
2020/06/18 Python
python利用platform模块获取系统信息
2020/10/09 Python
CSS3对背景图片的裁剪及尺寸和位置的设定方法
2016/03/07 HTML / CSS
详解html5 shiv.js和respond.min.js
2018/01/24 HTML / CSS
欧洲有机婴儿食品最大的市场:Organic Baby Food(供美国和加拿大)
2018/03/28 全球购物
英国工作场所设备购买网站:Slingsby
2019/05/03 全球购物
介绍一下Linux中的链接
2016/05/28 面试题
社区学雷锋活动策划方案
2014/01/30 职场文书
关于感恩的演讲稿400字
2014/08/26 职场文书
辞职信范文大全
2015/03/02 职场文书
普通员工辞职信范文
2015/05/12 职场文书
python使用XPath解析数据爬取起点小说网数据
2021/04/22 Python
python turtle绘制多边形和跳跃和改变速度特效
2022/03/16 Python
Python之Matplotlib绘制热力图和面积图
2022/04/13 Python
python读取并查看npz/npy文件数据以及数据显示方法
2022/04/14 Python