javascript成神之路(3):到底有没有json对象

简介:

前言:在我工作的过程中,很多小伙伴多会说:把字符串转化为JSON对象,把JSON对象转化成字符串等类似的话,前一段时间,我看了一篇关于JSON方面的文章,是一个外国大神写的,让我也深有体会,在这里我就谈一下我的感受。

很多的javascript开发人员都错误地把javascript对象字面量(Object Literals)称为JSON对象(JSON Objects),因为他的语法和JSON规范里描述的一样,但是该规范里也明确地说了JSON只是一个数据交换语言,只有我们将之用在string上下文的时候它才叫JSON。在这里我们在这里了解几个概念:

一、什么是字面量

  1. 他们是固定的值,不是变量,让你从“字面上”理解脚本。
  2. 字符串字面量是由双引号(")或单引号(')包围起来的零个或多个字符组成的。
  3. 对象字面量是由大括号({})括起来的零个或多个对象的属性名-值对。

二、序列化与反序列化

2个程序在交互通信的时候,他们倾向于使用string字符串因为string在很多语言里解析的方式都差不多。复杂的数据结构经常需要用到,并且通过各种各样的中括号{},小括号(),叫括号<>和空格来组成,这个字符串仅仅是按照要求规范好的字符。

为此,我们为了描述这些复杂的数据结构作为一个string字符串,制定了标准的规则和语法。JSON只是其中一种语法,它可以在string上下文里描述对象,数组,字符串,数字,布尔型和null,然后通过程序间传输,并且反序列化成所需要的格式。也是流行的数据交换格式,但是,我们喜欢JSON,谁叫我们是JavaScript开发人员呢!

三、什么时候是JSON,什么时候不是JSON?

JSON是设计成描述数据交换格式的,他也有自己的语法, 例如像这样申明{ "prop": "val" } 可能是JavaScript对象字面量也有可能是JSON字符串,取决于什么上下文使用它,如果是用在string上下文(用单引号或双引号引住,或者从text文件读取)的话,那它就是JSON字符串,如果是用在对象字面量上下文中,那它就是对象字面量。如果这样用,这是对象字面量 var bar = { "prop": "val" };

还需要我们特别注意的是,JSON有非常严格的语法,在string上下文里{ "prop": "val" } 是个合法的JSON,但{ prop: "val" }和{ 'prop': 'val' }确实不合法的。所有属性名称和它的值都必须用双引号引住,不能使用单引号。另外,即便你用了转义以后的单引号也是不合法的。

四、放到上下文里来看JSON是何方神圣

可能有人会问,难道JavaScript代码不是一个大的字符串?

当然是,所有的JavaScript代码和HTML(可能还有其他东西)都是字符串,直到浏览器对他们进行解析。这时候.jf文件或者inline的JavaScript代码已经不是字符串了,而是被当成真正的JavaScript源代码了,就像页面里的innterHTML一样,这时候也不是字符串了,而是被解析成DOM结构了。

所以说这一切都是取决于上下文,在string上下文里使用带有大括号的JavaScript对象,那它就是JSON字符串,而如果在对象字面量上下文里使用的话,那它就是对象字面量。如果你对上下文不了解,我后面会具体介绍。

五、真正的JSON对象(看到曙光了吧)

开头已经提到,对象字面量不是JSON对象,但是有真正的JSON对象。但是两者完全不一样概念,在新版的浏览器里JSON对象已经被原生的内置对象了,目前有2个静态方法:JSON.parse用来将JSON字符串反序列化成对象,JSON.stringify用来将对象序列化成JSON字符串。 如果还不理解,参考以下的例子你应该会明白的:

// 这是JSON字符串,比如从AJAX获取字符串信息 var my_json_string = '{ "prop": "val" }'; // 将字符串反序列化成对象 var my_obj = JSON.parse( my_json_string ); alert( my_obj.prop == 'val' ); // 提示 true, 和想象的一样!
// 将对象序列化成JSON字符串 var my_other_json_string = JSON.stringify( my_obj );

原文发布时间:2018年01月08日

作者:技术金三胖

本文来源:开源中国  如需转载请联系原作者

目录
相关文章
|
1天前
|
JavaScript 前端开发
技术经验分享:javaScript遍历对象、数组总结
技术经验分享:javaScript遍历对象、数组总结
技术经验分享:javaScript遍历对象、数组总结
|
1天前
|
XML JSON Java
老程序员分享:JAVA对象转换JSON
老程序员分享:JAVA对象转换JSON
|
2天前
|
前端开发 JavaScript 安全
解锁 JavaScript ES6:函数与对象的高级扩展功能
解锁 JavaScript ES6:函数与对象的高级扩展功能
|
2天前
|
JavaScript 前端开发 Java
遨游 JavaScript 对象星际:探索面向对象编程的深邃世界
遨游 JavaScript 对象星际:探索面向对象编程的深邃世界
|
2天前
|
前端开发 JavaScript 算法
JavaScript 中的数学与时光魔法:Math与Date对象大揭秘
JavaScript 中的数学与时光魔法:Math与Date对象大揭秘
|
2天前
|
存储 JSON JavaScript
JavaScript 魔法镜:透视对象Object与执行上下文的内在奥秘
JavaScript 魔法镜:透视对象Object与执行上下文的内在奥秘
|
2天前
|
存储 JavaScript 前端开发
JavaScript中的对象是数据结构,存储键值对,键为字符串,值可为任意类型,包括函数(作为方法)
【6月更文挑战第25天】JavaScript中的对象是数据结构,存储键值对,键为字符串,值可为任意类型,包括函数(作为方法)。
8 2
|
2天前
|
JavaScript 索引
Vue.js的`v-for`用于基于数组或对象渲染列表,如遍历数组生成`&lt;li&gt;`元素
【6月更文挑战第25天】Vue.js的`v-for`用于基于数组或对象渲染列表,如遍历数组生成`&lt;li&gt;`元素。基本语法是`v-for=&quot;(item, index) in items&quot;`,支持遍历对象的键值对。注意与`v-if`同用时应使用`&lt;template&gt;`,组件上使用`v-for`需设`key`属性以优化性能。
10 2
|
4天前
|
Web App开发 JSON JavaScript
JavaScript对象常用操作JSON总结
JavaScript对象常用操作JSON总结
17 8