高程3总结#第20章JSON

bangrenzhuce

2019-06-28

关注关注

JSON

语法

JSON语法可以表示三种类型的值
- 简单值：使用与 JavaScript 相同的语法，可以在 JSON 中表示字符串、数值、布尔值和 null 。但 JSON 不支持 JavaScript 中的特殊值 undefined 。
- 对象：对象作为一种复杂数据类型，表示的是一组无序的键值对儿。而每个键值对儿中的值可以是简单值，也可以是复杂数据类型的值。
- 数组：数组也是一种复杂数据类型，表示一组有序的值的列表，可以通过数值索引来访问其中的值。数组的值也可以是任意类型——简单值、对象或数组。

简单值

最简单的JSON数据形式，数值5，字符串“Hello world”
JavaScript字符串与JSON字符串最大区别在于，JSON字符串必须使用双引号
布尔值和null也是有效的JSON形式

对象

//JavaScript对象
var object = {
"name": "Nicholas",
"age": 29
};
//JSON对象
{
"name": "Nicholas",
  "age": 29
}
//JSON中对象嵌入对象
{
"name": "Nicholas",
  "age": 29,
    "school": {
      "name": "Merrimack College",
        "location": "North Andover, MA"
    }
}

数组

JSON数组没有变量和分号

[
  {
    "title": "Professional JavaScript",
    "authors": [
      "Nicholas C. Zakas"
    ],
    edition: 3,
    year: 2011
  },
  {
    "title": "Professional JavaScript",
    "authors": [
      "Nicholas C. Zakas"
    ],
    edition: 2,
    year: 2009
  },
  {
    "title": "Professional Ajax",
    "authors": [
      "Nicholas C. Zakas",
      "Jeremy McPeak",
      "Joe Fawcett"
    ],
    edition: 2,
    year: 2008
  },
  {
    "title": "Professional Ajax",
    "authors": [
      "Nicholas C. Zakas",
      "Jeremy McPeak",
      "Joe Fawcett"
    ],
    edition: 1,
    year: 2007
  },
  {
    "title": "Professional JavaScript",
    "authors": [
      "Nicholas C. Zakas"
    ],
    edition: 1,
    year: 2006
  }
]

解析与序列化

JSON对象

早期的JSON解析器基本上就是使用JavaScript的eval()函数

JSON对象有两个方法：stringify()和parse()，在最简单情况下，两个方法分别用于把JavaScript对象序列化为JSON字符串和把JSON字符串解析为原生JavaScript值

var book = {
  title: "Professional JavaScript",
  authors: [
    "Nicholas C. Zakas"
  ],
  edition: 3,
  year: 2011
};
var jsonText = JSON.stringify(book);
//得到的结果为
{"title":"Professional JavaScript","authors":["Nicholas C. Zakas"],"edition":3,
  "year":2011}
//反向操作
var bookCopy = JSON.parse(jsonText);

序列化选项

JSON.stringify() 除了要序列化的 JavaScript 对象外，还可以接收另外两个参数，这两个参数用于指定以不同的方式序列化 JavaScript 对象。第一个参数是个过滤器，可以是一个数组，也可以是一个函数；第二个参数是一个选项，表示是否在 JSON 字符串中保留缩进。

var book = {
  "title": "Professional JavaScript",
  "authors": [
    "Nicholas C. Zakas"
  ],
  edition: 3,
  year: 2011
};
var jsonText = JSON.stringify(book, ["title", "edition"]);
//结果为
{"title":"Professional JavaScript","edition":3}
//结果为undefined的例子
var book = {
  "title": "Professional JavaScript",
  "authors": [
    "Nicholas C. Zakas"
  ],
  edition: 3,
  year: 2011
};
var jsonText = JSON.stringify(book, function(key, value){
  switch(key){
    case "authors":
      return value.join(",")
    case "year":
      return 5000;
    case "edition":
      return undefined;
    default:
      return value;
  }
});
//结果为
{"title":"Professional JavaScript","authors":"Nicholas C. Zakas","year":5000}

JSON.stringify() 方法的第三个参数用于控制结果中的缩进和空白符。如果这个参数是一个数值，那它表示的是每个级别缩进的空格数

var book = {
  "title": "Professional JavaScript",
  "authors": [
    "Nicholas C. Zakas"
  ],
  edition: 3,
  year: 2011
};
var jsonText = JSON.stringify(book, null, 4);
//结果如下
{
  "title": "Professional JavaScript",
    "authors": [
      "Nicholas C. Zakas"
    ],
      "edition": 3,
        "year": 2011
}

如果缩进参数是一个字符串而非数值，则这个字符串将在 JSON 字符串中被用作缩进字符（不再使用空格）缩进字符串最长不能超过 10 个字符长。如果字符串长度超过了 10 个，结果中将只出现前 10 个字符。
```
var jsonText = JSON.stringify(book, null, " - -");
//结果如下
{
  --"title": "Professional JavaScript",
    --"authors": [
      ----"Nicholas C. Zakas"
      --],
      --"edition": 3,
        --"year": 2011
}
```

toJson()方法，返回其自身的JOSN数据格式

var book = {
  "title": "Professional JavaScript",
  "authors": [
    "Nicholas C. Zakas"
  ],
  edition: 3,
  year: 2011,
  toJSON: function(){
    return this.title;
  }
};
var jsonText = JSON.stringify(book)

解析选项

JSON.parse()方法也可以接收另一个参数，该参数是一个函数，将在每个键值对上调用

var book = {
  "title": "Professional JavaScript",
  "authors": [
    "Nicholas C. Zakas"
  ],
  edition: 3,
  year: 2011,
  releaseDate: new Date(2011, 11, 1)
};
var jsonText = JSON.stringify(book);
var bookCopy = JSON.parse(jsonText, function(key, value){
  if (key == "releaseDate"){
    return new Date(value);
  } else {
    return value;
  }
});
alert(bookCopy.releaseDate.getFullYear())

javascript