JavaScript前后端JSON使用方法教程

 更新时间:2020年11月23日 12:11:28   作者:陈文管  
这篇文章主要给大家介绍了关于JavaScript前后端JSON使用方法的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

汇总整理下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使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 移动端横屏的JS代码(beta)

    移动端横屏的JS代码(beta)

    这篇文章主要介绍了移动端横屏的JS代码(beta) 的相关资料,需要的朋友可以参考下
    2016-05-05
  • javascript 面向对象实战思想分享

    javascript 面向对象实战思想分享

    万物皆对象,所以,任何事物都是有特征(属性)和动作(方法)的,一般拿到一份需求分档,或者你浏览一个网页看到一个画面的时候,脑子里就要有提炼出来的属性和方法的能力,那你才是合格的
    2017-09-09
  • javascript中的正则表达式使用指南

    javascript中的正则表达式使用指南

    这篇文章主要给大家介绍了Javascript中的正则表达式的使用方式,非常的详细,并附上简单示例,这里推荐给大家。
    2015-03-03
  • js基于cookie方式记住返回页面用法示例

    js基于cookie方式记住返回页面用法示例

    这篇文章主要介绍了js基于cookie方式记住返回页面的用法,涉及javascript操作cookie及php针对cookie的判断技巧,需要的朋友可以参考下
    2016-05-05
  • js中符号转意问题示例探讨

    js中符号转意问题示例探讨

    符号转意,大家或许有所了解,知识在使用中或许不是那么的在意,其实这个问题很重要,下面为大家讲解下js符号转意问题相关知识,感兴趣的朋友可以参考下
    2013-08-08
  • 很棒的一组js图片轮播特效

    很棒的一组js图片轮播特效

    这篇文章主要为大家分享了一款很棒的js组轮播特效,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • 微信小程序实现购物车页面

    微信小程序实现购物车页面

    这篇文章主要为大家详细介绍了微信小程序实现购物车页面,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • JavaScript进制数之间的互相转换

    JavaScript进制数之间的互相转换

    这篇文章主要介绍了JavaScript进制数之间的互相转换,进制转换是人们利用符号来计数的方法,下文基于JavaScript实现进制数之间的转换,有一定的知识性参考价值,需要的小伙伴可以参考一下
    2022-05-05
  • JavaScript TWaver使用中间点画折线的方法

    JavaScript TWaver使用中间点画折线的方法

    这篇文章主要介绍了JavaScript TWaver使用中间点画折线的方法,TWaver的图形组件库中提供了拓扑组件、地图组件、设备图组件,以及表格、树图、属性表、图表等丰富的通用图形界面组件
    2022-07-07
  • javascript使用递归算法求两个数字组合功能示例

    javascript使用递归算法求两个数字组合功能示例

    这篇文章主要介绍了javascript使用递归算法求两个数字组合功能,结合实例形式分析了JS基于递归算法的数组遍历、判断、转换等相关操作技巧,需要的朋友可以参考下
    2017-01-01

最新评论