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 面向对象全新理练之数据的封装
Dec 03 Javascript
获取服务器传来的数据 用JS去空格的正则表达式
Mar 26 Javascript
JavaScript 图像动画的小demo
May 23 Javascript
通过Javascript创建一个选择文件的对话框代码
Jun 16 Javascript
jQuery 1.9移除了$.browser可以使用$.support来替代
Sep 03 Javascript
JS命令模式例子之菜单程序
Oct 10 Javascript
有关文件上传 非ajax提交 得到后台数据问题
Oct 12 Javascript
详解jQuery选择器
Dec 21 Javascript
JavaScript获取ul中li个数的方法
Feb 13 Javascript
jQuery实现select下拉框获取当前选中文本、值、索引
May 08 jQuery
Vue.js列表渲染绑定jQuery插件的正确姿势
Jun 29 jQuery
ES6下子组件调用父组件的方法(推荐)
Feb 23 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
IIS7.X配置PHP运行环境小结
2011/06/09 PHP
8个必备的PHP功能实例代码
2013/10/27 PHP
WordPress中用于创建以及获取侧边栏的PHP函数讲解
2015/12/29 PHP
PHP处理Ajax请求与Ajax跨域问题
2017/02/13 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例
2020/03/02 PHP
jQuery 隔行换色 支持键盘上下键,按Enter选定值
2009/08/02 Javascript
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
2011/04/07 Javascript
jquery插件制作 图片走廊 gallery
2012/08/17 Javascript
js左右弹性滚动对联广告代码分享
2014/02/19 Javascript
浅析javascript中的DOM
2015/03/01 Javascript
JavaScript获得url查询参数的方法
2015/07/02 Javascript
js实现根据身份证号自动生成出生日期
2015/12/15 Javascript
JavaScript基础知识点归纳(推荐)
2016/07/09 Javascript
Vue简单封装axios之解决post请求后端接收不到参数问题
2020/02/16 Javascript
Nuxt的路由配置和参数传递方式
2020/11/06 Javascript
python基础教程之popen函数操作其它程序的输入和输出示例
2014/02/10 Python
简单上手Python中装饰器的使用
2015/07/12 Python
Python设计模式之命令模式简单示例
2018/01/10 Python
python中datetime模块中strftime/strptime函数的使用
2018/07/03 Python
Python实现对文件进行单词划分并去重排序操作示例
2018/07/10 Python
python获取磁盘号下盘符步骤详解
2019/06/19 Python
python实现在函数中修改变量值的方法
2019/07/16 Python
浅谈Django QuerySet对象(模型.objects)的常用方法
2020/03/28 Python
Python实例方法、类方法、静态方法区别详解
2020/09/05 Python
Html5跳转到APP指定页面的实现
2020/01/14 HTML / CSS
阿联酋彩妆品牌:OUD MILANO
2019/10/06 全球购物
Python面试题:Python是如何进行内存管理的
2014/08/04 面试题
学校班班通实施方案
2014/06/11 职场文书
社团活动总结模板
2014/06/30 职场文书
领导干部“四风”问题批评与自我批评材料
2014/09/24 职场文书
派出所班子党的群众路线对照检查材料思想汇报
2014/10/01 职场文书
求职信:会计求职的写作技巧
2019/04/24 职场文书
宪法宣传标语100条
2019/10/15 职场文书
python树莓派通过队列实现进程交互的程序分析
2021/07/04 Python
Go语言入门exec的基本使用
2022/05/20 Golang