Java Web——JS和JSON之间的数据转换

本文涉及的产品
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
云解析 DNS,旗舰版 1个月
全局流量管理 GTM,标准版 1个月
简介: Java Web——JS和JSON之间的数据转换

1.什么是JSON?


JSON是用于存储和传输数据的格式。

JSON通常用于服务端向网页传递数据

·       JSON 英文全称JavaScript Object Notation

·       JSON 是一种轻量级的数据交换格式。

·       JSON是独立的语言*

·       JSON 易于理解。

JSON格式在语法上与创建 JavaScript 对象代码是相同的。

由于它们很相似,所以 JavaScript 程序可以很容易的将 JSON 数据转换为 JavaScript 对象。

2.JSON的语法规则


·       数据为/对。

·       数据由逗号分隔。

·       大括号保存对象

·       方括号保存数组


JSON 数据 - 一个名称对应一个值

JSON数据格式为/对,就像 JavaScript 对象属性。

/值对包括字段名称(在双引号中),后面一个冒号,然后是值:

"name":"baidu"


JSON 对象

 

JSON对象保存在大括号内。

就像在 JavaScript , 对象可以保存多个/对:

{"name":"baidu", "url":"www.baidu.com"}

JSON 数组


JSON数组保存在中括号内。

就像在 JavaScript , 数组可以包含对象:

"sites":[ {"name":"baidu", "url":"www.baidu.com"}, {"name":"Google", "url":"www.google.com"}, {"name":"Taobao", "url":"www.taobao.com"} ]

在以上实例中,对象 "sites" 是一个数组,包含了三个对象。

每个对象为站点的信息(网站名和网站地址)。


相关函数

函数

描述

JSON.parse()

用于将一个 JSON 字符串转换为 JavaScript 对象。

JSON.stringify()

用于将 JavaScript 值转换为 JSON 字符串。

3.JS和JSON之间的数据转换


3.1 实例一 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Title</title>
  </head>
  <body>
    <script type="text/javascript">
      //定义一个js对象
      var obj={
        name: "宋子浩",
        age: 21,
        sex: "男"
      };
      console.log(obj);
      //把js对象转化为json串
      var json=JSON.stringify(obj);
      console.log(json);
      //把json串解析为js对象
      var str=JSON.parse(json);
      console.log(str);
      //定义一个json串,把json串解析为js对象
      var data='{"name":"宋子浩","age":21,"sex":"男"}';
      console.log(JSON.parse(data));
    </script>
  </body>
</html>


3.2 实例二

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Title</title>
  </head>
  <body>
    <script type="text/javascript">
      //定义一个js数组
      var obj=[{
        name: "小哥",
        age: 20,
        sex: "男"
      },{
        name: "张起灵",
        age: 20,
        sex: "男"
      }];
      console.log(obj);
      //把js数组转化为json串
      var json=JSON.stringify(obj);
      console.log(json);
      //把json串解析为js数组
      var str=JSON.parse(json);
      console.log(str);
      //定义一个json串,把json串解析为js数组
      var data='[{"name":"小哥","age":20,"sex":"男"},{"name":"张起灵","age":20,"sex":"男"}]';
      console.log(JSON.parse(data));
    </script>
  </body>
</html>

目录
打赏
0
0
0
0
86
分享
相关文章
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
用array.filter()来实现数据筛选、数据清洗和链式调用,相对于for循环更加清晰,语义化强,能显著提升代码的可读性和可维护性。博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
深潜数据海洋:Java文件读写全面解析与实战指南
通过本文的详细解析与实战示例,您可以系统地掌握Java中各种文件读写操作,从基本的读写到高效的NIO操作,再到文件复制、移动和删除。希望这些内容能够帮助您在实际项目中处理文件数据,提高开发效率和代码质量。
60 4
Java爬虫获取微店快递费用item_fee API接口数据实现
本文介绍如何使用Java开发爬虫程序,通过微店API接口获取商品快递费用(item_fee)数据。主要内容包括:微店API接口的使用方法、Java爬虫技术背景、需求分析和技术选型。具体实现步骤为:发送HTTP请求获取数据、解析JSON格式的响应并提取快递费用信息,最后将结果存储到本地文件中。文中还提供了完整的代码示例,并提醒开发者注意授权令牌、接口频率限制及数据合法性等问题。
java spring 项目若依框架启动失败,启动不了服务提示端口8080占用escription: Web server failed to start. Port 8080 was already in use. Action: Identify and stop the process that’s listening on port 8080 or configure this application to listen on another port-优雅草卓伊凡解决方案
java spring 项目若依框架启动失败,启动不了服务提示端口8080占用escription: Web server failed to start. Port 8080 was already in use. Action: Identify and stop the process that’s listening on port 8080 or configure this application to listen on another port-优雅草卓伊凡解决方案
114 7
|
3月前
|
使用Java和Spring Data构建数据访问层
本文介绍了如何使用 Java 和 Spring Data 构建数据访问层的完整过程。通过创建实体类、存储库接口、服务类和控制器类,实现了对数据库的基本操作。这种方法不仅简化了数据访问层的开发,还提高了代码的可维护性和可读性。通过合理使用 Spring Data 提供的功能,可以大幅提升开发效率。
102 21
【潜意识Java】深入理解MyBatis的Mapper层,以及让数据访问更高效的详细分析
深入理解MyBatis的Mapper层,以及让数据访问更高效的详细分析
201 1
基于Java的Hadoop文件处理系统:高效分布式数据解析与存储
本文介绍了如何借鉴Hadoop的设计思想,使用Java实现其核心功能MapReduce,解决海量数据处理问题。通过类比图书馆管理系统,详细解释了Hadoop的两大组件:HDFS(分布式文件系统)和MapReduce(分布式计算模型)。具体实现了单词统计任务,并扩展支持CSV和JSON格式的数据解析。为了提升性能,引入了Combiner减少中间数据传输,以及自定义Partitioner解决数据倾斜问题。最后总结了Hadoop在大数据处理中的重要性,鼓励Java开发者学习Hadoop以拓展技术边界。
115 7
小团队 CI/CD 实践:无需运维,Java Web应用的自动化部署
本文介绍如何使用GitHub Actions和阿里云Kubernetes(ACK)实现Java Web应用的自动化部署。通过CI/CD流程,开发人员无需手动处理复杂的运维任务,从而提高效率并减少错误。文中详细讲解了Docker与Kubernetes的概念,并演示了从创建Kubernetes集群、配置容器镜像服务到设置GitHub仓库Secrets及编写GitHub Actions工作流的具体步骤。最终实现了代码提交后自动构建、推送镜像并部署到Kubernetes集群的功能。整个过程不仅简化了部署流程,还确保了应用在不同环境中的稳定运行。
143 9
|
3月前
|
java怎么统计每个项目下的每个类别的数据
通过本文,我们详细介绍了如何在Java中统计每个项目下的每个类别的数据,包括数据模型设计、数据存储和统计方法。通过定义 `Category`和 `Project`类,并使用 `ProjectManager`类进行管理,可以轻松实现项目和类别的数据统计。希望本文能够帮助您理解和实现类似的统计需求。
151 17