codecamp

深入理解JavaScript系列(7)

大纲
  1. 1. 内容简要
  2. 2. BACKBONE
    1. 2.1. 数据类型的分类
    2. 2.2. JavaScript中字面量的含义
    3. 2.3. JSON字符串和JSON对象
    4. 2.4. 真正的JSON对象
  3. 3. 总结

本文是深入理解JavaScript系列的第篇读文笔记,博客原文在这里

内容简要

鉴于JSON数据格式的越来越流行,但是JSON对象JSON字符串这两种概念往往又会被人混淆。所以本篇文章就是对相关内容的阐述。

BACKBONE

数据类型的分类

现在比较流行的网络数据交换格式包括:JSONYAML以及日薄西山的XML

从结构上看,所有的数据最后都可以分解成三个基本类型,

  1. 标量(scalar),也就是一个单独的字符串(String)或者数字(Number)。比如”beijing”这个单独的词。
  2. 序列(sequence),也就是若干个相关的数据按照一定的顺序组合在一起。又叫做数组(Array)或者列表(List)。比如”beijing,shanghai”。
  3. 映射(mapping),也就是一个键值对(key:value),即数据有一个名称,还有一个与之对应的值。这个又称作散列(Hash)或者字段(Dictionary)。比如”首都:北京”。

此部分内容参考自数据类型和Json格式

可见数据构成的最小单位是非常简单的,而JSON正式完美的符合了这三种最基本的数据构成单元。

JavaScript中字面量的含义

在JavaScript中,我们经常会听到这样一个词,JSON字面量,对象字面量,字符串字面量等等,他们究竟是什么意思呢?

引用developer.mozilla.org中的说法,字面量就是

  1. 固定的值,让你从“字面上”理解其含义。
  2. 字符串字面量是由双引号("")或者单引号('')括起来的零个或多个字符。
  3. 对象字面量是由大括号({})括起来,拥有零个或多个键值对。

比如下面的代码,

// 这些都是字面量
var a = 1;
var name = 'puck';
var puck = {
    name: 'puck',
    age: 20
};

JSON字符串和JSON对象

首先,JSON有非常严格的语法,如下,

{
    "key": "value"
}

其中,键和值都必须要用双引号括起来,不用或者使用单引号都是不行滴。

从某种意义上说,JSON字符串终归是字符串,也就是说JSON字符串是字符串的子集,不过JSON字符串满足这样的条件: JSON字符串可以被正确的反序列化成JSON对象

而JSON对象与普通的JavaScript对象却不是那么好区分,要看对象所在的上下文场景。看下面的代码,

// JSON字符串
var puck = '{"name": "puck", "age": 20}';
// 字面量对象,这里我们可以简单将其看成是一个JSON对象
var puck2 = {
    "name": "puck2",
    "age": 20
};

真正的JSON对象

从严格意义上来说,满足JSON语法的普通JavaScript字面量对象并不是JSON对象。两者是完全不一样的概念。

在新版的浏览器里JSON对象已经被原生的内置对象了,目前有2个静态方法:JSON.parse用来将JSON字符串反序列化成对象,JSON.stringify用来将对象序列化成JSON字符串。老版本的浏览器不支持这个对象,但你可以通过json2.js来实现同样的功能。

总结

好吧,这篇其实算是一篇水文,讲述的内容比较简单,算是一篇科普文吧。

这里只想强调一条,JSON是一种对数据结构的简洁描述,然后还要知道现代浏览器中已经有JSON.parseJSON.stringify这两个方法就可以了。



深入理解JavaScript系列(6)
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }