乐趣区

关于前端:从-JSON-说起

规范 JSON 格局

js 中的 JSON

JavaScript Object Notation (JSON) 是一种数据交换格局。只管不是严格意义上的子集,JSON 十分靠近 JavaScript 语法的子集。

js 转换 JSON

json 更靠近是 js 反对的原生语法, 所以他也内置了解析 API:

JSON.stringify

此办法将一个 JavaScript 对象或值转换为 JSON 字符串,如果指定了一个 replacer 函数,则能够选择性地替换值,或者指定的 replacer 是数组,则可选择性地仅蕴含数组指定的属性。

第二个参数罕用来删除, 替换:

function replacer(key, value) {if (typeof value === "string") {return undefined;}
  return value;
}

var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
var jsonString = JSON.stringify(foo, replacer);
// {"week":45,"month":7}  打印后果  相似于 去除了 value 是字符串的类型

如果第二个参数是一个数组:

var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};

JSON.stringify(foo, ['week', 'month']);
// '{"week":45,"month":7}' 他将值保留这两数组对应的后果

第三个参数罕用来格式化 json:

JSON.stringify({a: 2}, null, " ");
// 打印后果: '{\n"a": 2\n}'

// 或者这样:
JSON.stringify({a: 2}, null, 2);

JSON.parse

办法用来解析 JSON 字符串,结构由字符串形容的 JavaScript 值或对象。提供可选的 reviver 函数用以在返回之前对所失去的对象执行变换(操作)。

const json = '{"result":true,"count":42}';
const obj = JSON.parse(json);

JSON.parse 解析常常会报错, 所以咱们也须要 try...catch 来包裹它

须要留神的是: JSON.parse() 不容许用逗号作为结尾
如: JSON.parse('{"foo": 1,}');

另外的计划

在 JS 中想要解析成 json 对象, 还能够应用另一种 hack 的计划:

var a = '{"foo": 1,}'
eval(`(${a})`)
//  {foo: 1}

能够看到它的转换是非常宽松的, 甚至他还反对, 但引号和无引号

其实他利用的就是 js 的解析能力, 然而 应用 eval 同样也会存在隐患(次要是在性能, 安全性上问题很大)

相干 JSON 库

这边就将一些 json 相干的, 可能会应用到的库介绍下

JSON-js
用来兼容 ie8, 相似于官网提供的 JSON API mock, 当初应该不罕用到

parse-json
解析 json 的时候, 会提供更有用的谬误, 这个库在搭建根底环境的时候更有作用

在某些业务场景下 (自定义字段, 自定义表单等等) 也能施展巨大作用

strip-json-comments

容许在 json 中应用正文, 在解析时删除, 在配置文件, 或者根底库中能够作为应用

JSONStream
一个解析库, 能够依据一些配置来解析 json

node 中操作 JSON

在 node 中因为要操作文件, 并且又要转换 json, 所以搞得很麻烦, 这里我会应用这个库:

jsonfile

在读取配置文件的时候也是异样好用

其余格局

既然聊到了 json, 咱们也须要理解下其余格局, 以及他的优缺点

CSV

其文件以纯文本模式存储表格数据(数字和文本)。纯文本意味着该文件是一个字符序列,不含必须像二进制数字那样被解读的数据。CSV 文件由任意数目的记录组成,记录间以某种换行符分隔;

Passenger,Id,Survived,Pclass,Name,Sex.Age
1,0,3 Braund, Mr. Owen Harris ,male, 22
2,1,1 Cumings, Mrs. John Bradley (Florence Briggs Thayer), female,38

看起来像是简洁版的 table 格局

papaparse: 这个库是能够应用 js 来解析 csv 格局的

YAML

领有简直所有 web 编程语言都可用的解析器。它还有一些额定的性能,如循环援用、软包装、多行键、类型转换标签、二进制数据、对象合并和汇合映射。它具备十分好的可读性和可写性,并且是 JSON 的超集,因而你能够在 YAML 中应用齐全合格的 JSON 语法并且一切正常工作。你简直不须要引号,它能够解释大多数根本数据类型(字符串、整数、浮点数、布尔值等)。

books:
  - id: bk102
  author: Crockford, Douglas
  title: 'JavaScript: The Good Parts'
  genre: Computer

在 js 中解析 YAML:

  • yaml
  • js-yaml

XML

XML 语言非常灵活且易于编写,但它的毛病是简短,人类难以浏览、计算机十分难以读取,并且有很多语法对于传播信息并不是完全必要的。

<book id="bk101">
<author>Gambardella, Matthew</author>
<title>XML Developer's Guide</title>
<genre>Computer</genre>

解析库: htmlparser2

TOML

容许以相当快捷、简洁的形式定义深层嵌套的数据结构。与 JSON 相比,语法有点难堪,更相似 ini 文件。这不是一个蹩脚的语法,然而须要一些工夫适应。

[a.b.c]
d = 'Hello'
e = 'World'

应用 TOML,你能够必定在工夫和文件长度上会节俭不少。很少有零碎应用它或十分相似的货色作为配置,这是它最大的毛病。基本没有很多语言或库能够用来解释 TOML。

toml 目前来看临时只反对 node

总结

目前看起来 json 是一种不错的替换, 传递信息的格局, 有挺多毛病(当然他也能被某些库解决)

然而集体来说 YAML, 是一个更加热门, 有将来倒退空间的格局, 心愿大家有空也学习一下

参考文档:

  • https://developer.mozilla.org…
  • https://zhuanlan.zhihu.com/p/…
退出移动版