JSON数据格式入门

在学习Echarts时,又遇到的JSON这种数据格式，发现自己有些忘记了，在这里复习一下。

JSON是JavaScript Object Notation的缩写，它是一种数据交换格式。

一，基本数据类型

1.number：

JavaScript不区分整数和浮点数，统一用Number表示，以下都是合法的Number类型：

123; // 整数123
0.456; // 浮点数0.456
1.2345e3; // 科学计数法表示1.2345x1000，等同于1234.5
-99; // 负数
NaN; // NaN表示Not a Number，当无法计算结果时用NaN表示
Infinity; // Infinity表示无限大，当数值超过了JavaScript的Number所能表示的最大值时，就表示为Infinity

2.boolean：

布尔值和布尔代数的表示完全一致，一个布尔值只有true、false两种值，要么是true，要么是false，可以直接用true、false表示布尔值，也可以通过布尔运算计算出来：

true; // 这是一个true值
false; // 这是一个false值
2 > 1; // 这是一个true值
2 >= 3; // 这是一个false值

3.string：

字符串是以单引号'或双引号"括起来的任意文本，比如'abc'，"xyz"等等。请注意，''或""本身只是一种表示方式，不是字符串的一部分，因此，字符串'abc'只有a，b，c这3个字符。

4.null：

null表示一个“空”的值，它和0以及空字符串''不同，0是一个数值，''表示长度为0的字符串，而null表示“空”。

5.array：

数组是一组按顺序排列的集合，集合的每个值称为元素。JavaScript的数组可以包括任意数据类型。例如：

[1, 2, 3.14, 'Hello', null, true];

6.object：

JavaScript的对象是一组由键-值组成的无序集合，例如：

var person = {
    name: 'Bob',
    age: 20,
    tags: ['js', 'web', 'mobile'],
    city: 'Beijing',
    hasCar: true,
    zipcode: null
};

JavaScript对象的键都是字符串类型，值可以是任意数据类型。上述person对象一共定义了6个键值对，其中每个键又称为对象的属性，例如，person的name属性为'Bob'，zipcode属性为null。

要获取一个对象的属性，我们用对象变量.属性名的方式：

person.name; // 'Bob'
person.zipcode; // null

Echarts入门实例里的JavaScript对象分析：

   // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));

    // 指定图表的配置项和数据
    var option = {
       //这个tiltle还是一个对象，里面有一个text键，其值为字符串
        title: {
            text: 'ECharts 入门示例'
        },
//一个对象，但是是空的
        tooltip: {},
//一个对象，里面有一个data键，其值为数组
        legend: {
            data:['销量']
        },
//对象，其有data键，值为数组
        xAxis: {
            data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
        },
        yAxis: {},
//这个是在数组里的0位置，放了一个对象，其又由三个键值对构成
        series: [{
            name: '销量',
            type: 'bar',
            data: [5, 20, 36, 10, 10, 20]
        }]
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);

二，序列化（就是将对象序列化成JSON格式的字符串）

如上面的 option,可以使用下面的代码进行序列化

var s = JSON.stringify(option,null,'  ');
console.log(s);

第一个参数是要序列化的对象
第二个是用于控制如何筛选对象的键值
第三个参数是用来控制缩进

//可以指定要序列化的键值
var s2 = JSON.stringify(option,['series','title'],'  ');
console.log(s2);


//也可以传入函数
function convert(key, value) {
    if (typeof value === 'string') {
        return value.toUpperCase();
    }
    return value;
}

var s3 =JSON.stringify(option, convert, '  ');
console.log(s3);

三，反序列化（就是将JSON字符串转化为对象）

var s = JSON.stringify(option,null,'  ');
console.log(s);

var a = JSON.parse(s);
console.log(a.title.text);