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 相关文章推荐
this[] 指的是什么内容 讨论
Mar 24 Javascript
原生Js与jquery的多组处理, 仅展开一个区块的折叠效果
Jan 09 Javascript
用JS做的简单的可折叠的两级树形菜单
Sep 21 Javascript
JavaScript删除指定子元素代码实例
Jan 13 Javascript
Jquery 实现table样式的设定
Jan 28 Javascript
JavaScript中的标签语句用法分析
Feb 10 Javascript
简单理解js的prototype属性及使用
Dec 07 Javascript
jQuery插件HighCharts绘制2D圆环图效果示例【附demo源码下载】
Mar 09 Javascript
Node.js+Express+MySql实现用户登录注册功能
Jul 10 Javascript
解决vuex数据异步造成初始化的时候没值报错问题
Nov 13 Javascript
javascript的hashCode函数实现代码小结
Aug 11 Javascript
Ajax实现异步加载数据
Nov 17 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函数
2008/10/03 PHP
PHP实现提取一个图像文件并在浏览器上显示的代码
2012/10/06 PHP
基于PHP读取csv文件内容的详解
2013/06/18 PHP
PHP根据两点间的经纬度计算距离
2014/10/31 PHP
PHP中file_exists()判断中文文件名无效的解决方法
2014/11/12 PHP
Yii2使用dropdownlist实现地区三级联动功能的方法
2016/07/18 PHP
PHP有序表查找之二分查找(折半查找)算法示例
2018/02/09 PHP
jquery提示 &quot;object expected&quot;的解决方法
2009/12/13 Javascript
jquery.bgiframe.js在IE9下提示INVALID_CHARACTER_ERR错误
2013/01/11 Javascript
hover的用法及live的用法介绍(鼠标悬停效果)
2013/03/29 Javascript
js实现带搜索功能的下拉框实时搜索实时匹配
2013/11/05 Javascript
你可能不知道的JavaScript的new Function()方法
2014/04/17 Javascript
20分钟轻松创建自己的Bootstrap站点
2016/05/12 Javascript
浅析javascript异步执行函数导致的变量变化问题解决思路
2016/05/13 Javascript
jQuery实现ajax的叠加和停止(终止ajax请求)
2016/08/08 Javascript
HTML5基于Tomcat 7.0实现WebSocket连接并实现简单的实时聊天
2016/10/31 Javascript
angular2模块和共享模块详解
2018/04/08 Javascript
深入解析ES6中的promise
2018/11/08 Javascript
nodejs同步调用获取mysql数据时遇到的大坑
2019/03/02 NodeJs
详解JS实现简单的时分秒倒计时代码
2019/04/25 Javascript
[02:25]DOTA2英雄基础教程 熊战士
2014/01/03 DOTA
[46:20]CHAOS vs Alliacne 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
[45:18]完美世界DOTA2联赛循环赛 PXG vs IO 第二场 11.06
2020/11/09 DOTA
介绍Python的Django框架中的QuerySets
2015/04/20 Python
Python实例一个类背后发生了什么
2016/02/09 Python
Python数组定义方法
2016/04/13 Python
查看django执行的sql语句及消耗时间的两种方法
2018/05/29 Python
快速解决vue.js 模板和jinja 模板冲突的问题
2019/07/26 Python
使用python快速在局域网内搭建http传输文件服务的方法
2019/11/14 Python
python 实现将list转成字符串,中间用空格隔开
2019/12/25 Python
将pymysql获取到的数据类型是tuple转化为pandas方式
2020/05/15 Python
HTML5 常用语法一览(列举不支持的属性)
2010/01/26 HTML / CSS
美国最大网上鞋店:Zappos
2016/07/25 全球购物
美国球鞋寄卖网站:Stadium Goods
2018/05/09 全球购物
意大利在线购买隐形眼镜网站:VisionDirect.it
2019/03/18 全球购物
工程质检员岗位职责
2015/04/08 职场文书