今天给大家介绍一下如何通过js来格式化json。

假设json字符串是:

{"name":"刘德华","age":25.2,"birthday":"1990-01-01"}

我们使用的是Js的JSON方法

先把json字符串转为json对象,方法如下:

var jsonString = '{"name":"刘德华","age":35.2,"birthday":"1966-01-01"}'    //普通json字符串
var jsonObj = JSON.parse(jsonString) //把json字符串转为json对象

这样我们就把json字符串转为json对象了

然后,我们再把json对象转为json字符串,这样,就可以实现json格式化了

JSON.stringify(jsonObj, null, 4)

转换结果如下

{
"name": "刘德华",
"age": 25.2,
"birthday": "1990-01-01"
}

上面JSON.stringify里面的4指的是代码缩进量,你也可以设置为2或者1等等

这样就单间的实现了json格式化功能

demo预览

写了一个小demo,可以试用。json格式化

json格式化原理

JSON 可以将程序语言对象中表示的一组数据转换为字符串,然后就可以在网络或者程序之间轻松地传递这个字符串,并在需要的时候将它还原为各编程语言所支持的数据格式,例如在 PHP 中,可以将 JSON还原为数组或者一个基本对象。在用到AJAX时,如果需要用到数组传值,这时就需要用JSON将数组转化为字符串。JSON在线解析功能的原理主要是将输入的 JSON 文本转换为内存中的数据结构,然后对其进行解析并转换为可操作的 JavaScript 对象。 在实现 JSON 解析功能时,可以选择使用递归下降解析器或状态机解析器。递归下降解析器使用递归函数来处理每种类型的 Token,而状态机解析器则将解析过程看作一系列状态转换。此外,还需要注意处理 JSON 文本中的特殊字符、数字溢出等细节问题,并确保安全性,避免恶意输入导致的安全漏洞。

开发了一个json格式化工具,使用js格式化json的代码分享的更多相关文章

  1. js格式化JSON数据

    前言: 最近做的项目中遇到个需要在前端页面中将某个设备需要的数据格式展示出来,方便用户配置.一开始单纯的将数据格式写入到pre标签中, 但是通过pre标签写入的数据格式在代码可视化上不是很优雅.由于上 ...

  2. 原生js格式化json和格式化xml的方法

    在工作中一直看各位前辈的博客解决各种问题,对我的帮助很大,非常感谢! 之前一直比较忙没有写博客,终于过年有了点空闲时间,可以把自己积累的东西分享下,笔记中的部分函数不是自己写的,都是工作中一点点积累的 ...

  3. 原生js格式化json工具

    json格式化小工具,原生js编写,直接上代码: <!DOCTYPE html> <html lang="en"> <head> <met ...

  4. 原生js格式化json的方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. js 格式化 json 字符串

    1.JSON.stringify的三个参数 var json = {"@odata.context":"$metadata#AddTableOne_466281s&quo ...

  6. js格式化json字符串和json对象

    1,格式化json对象 var json = {"@odata.context":"$metadata#AddTableOne_466281s","v ...

  7. (转)JSON数据格式和js操作json总结

    原:http://niutuku.com/tech/javaScript/273643.shtml JSON数据格式和js操作json总结 来源:niutuku.com |         vince ...

  8. arguments.callee 调用函数自身用法----JSON.parse()和JSON.stringify()前端js数据转换json格式

    arguments.callee 调用函数自身用法 arguments.callee 在哪一个函数中运行,它就代表哪个函数. 一般用在匿名函数中. 在匿名函数中有时会需要自己调用自己,但是由于是匿名函 ...

  9. JavaScript中使用JSON,即JS操作JSON总结

    JSON(JavaScript Object Notation 对象标记) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生 ...

  10. json树递归js查询json父子节点

    上代码,直接另存为html打开,看console控制台就可以看到效果了 <!DOCTYPE html> <html lang="en"> <head& ...

随机推荐

  1. finally中的代码一定会执行吗?

    通常在面试中,只要是疑问句一般答案都是"否定"的,因为如果是"确定"和"正常"的,那面试官就没有必要再问了嘛,而今天这道题的答案也是符合这个 ...

  2. 【2016】CloneCD和IsoBuster配合使用以提取VCD中的文件

    **笔记记录于:2016-11-24 ** 本文章仅供用于技术研究用途,请勿利用文章内容操作用于违反法律的事情. 起因: 公司老总让我提取下VCD中的文件以备份下,但是把光碟放进DVD光驱中发现只有几 ...

  3. 浅谈android的activity

    说道activity,大家可以说是熟悉的不能再熟悉,首先,先来个镇楼图, 个人觉得谷歌的这张图,比别的什么生命周期图都好;说下各个生命周期注意的: 1:onstart()时,activity可见; 2 ...

  4. Spring 七种事务传播性介绍

    作者:vivo 互联网服务器团队 - Zhou Shaobin 本文主要介绍了Spring事务传播性的相关知识. Spring中定义了7种事务传播性: PROPAGATION_REQUIRED PRO ...

  5. 关于helloworld

    我们的helloworld是从一个源程序开始的,该源程序由程序员通过编译器创建并保存的文件,文件名就是hello.c.这个hello.c的源程序,实际上是有0和1组成的序列.每一个0和1都成为一位,这 ...

  6. 斯坦福 UE4 C++ ActionRoguelike游戏实例教程 14. 使用GameplayTag实现防守反击技能

    斯坦福课程 UE4 C++ ActionRoguelike游戏实例教程 0.绪论 概述 本篇文章对应Lecture 17 - GameplayTags, 70节.本文将会结合前几节课使用的能力系统和G ...

  7. 异步、多线程、Await/Async、Task

    异步多线程经常被拿来说事,网上文章也是多如牛毛,我也是停留在很菜的水平,痛下决心好好"恶补"一下这块知识. 还是先放两个官方文档压压惊:使用 Async 和 Await 的异步编程 ...

  8. 详解驱动开发中内核PE结构VA与FOA转换

    摘要:本文将探索内核中解析PE文件的相关内容. 本文分享自华为云社区<驱动开发:内核PE结构VA与FOA转换>,作者: LyShark . 本章将探索内核中解析PE文件的相关内容,PE文件 ...

  9. 带你梳理Roach全量恢复的整体流程

    摘要:本文将梳理Roach全量恢复的整体流程,描述Roach集群全量备份场景的运转机制. 数据备份恢复是保护数据安全的重要手段之一.Roach工具支持多种备份恢复类型,例如集群级的物理备份,表级备份的 ...

  10. SimpleDateFormat线程不安全了?这里有5种解决方案

    摘要:我们知道SimpleDateFormat是线程不安全,本文会介绍多种解决方案来保证线程安全. 本文分享自华为云社区<java的SimpleDateFormat线程不安全出问题了,虚竹教你多 ...