今日はこの数学に本当に耐えられません

心を変えてフロントエンドを書いてみましょう
今日は JSON について少し知識を書いてみましょう

昔、インターネット上でデータを送信するための標準は XML でした
しかし、一般に、XML は煩雑すぎると誰もが考えています
その後、Web の発展に伴い、人々は JSON が JavaScript 構文のサブセットとして使用するのがより便利であることに気付きました
それで、JSON が標準になりました
今では、誰もがデータ形式として JSON を使用しています通信

JSON構文は大きく3種類の値に分かれます

• 単純な型の値: 文字列、数値、ブール値を表現可能値と null

• オブジェクト: 順序のないキーと値のペアを表す複合データ型

• 配列: 順序付きの値のリストを表す複合データ型

構文は JavaScript と同じです
注意すべき点が 1 つだけあります
JavaScript では、文字列は二重引用符または一重引用符で表現できます
ただし、JSON の文字列形式では二重引用符を使用する必要があります

のサブセットであるため、主に違いについて説明します
まず、見てみましょう一般的に使用されるオブジェクト リテラル宣言形式です

var man = {
    name: 'payen',
    sex: 'male',
    age: 19};

(通常のオブジェクトと JSON オブジェクトを区別するために、通常は引用符は追加されません)
しかし、JSON では、オブジェクトは (double) を必要とします属性の引用符
上記のオブジェクトは JavaScript で次のように記述することもできます。これは完全に同等です

var man = {    "name": "payen",    "sex": "male",    "age": 19};

{
    "name": "payen",
    "sex": "male",
    "age": 19}

Ofもちろん、JSON 内のオブジェクトの値もオブジェクトにすることができます
JSON がどれほど複雑であっても、オブジェクトのキー (属性) を追加する必要があります (二重) 引用符

が、通常は別の方法で扱います
配列リテラルを宣言する一般的な方法

var value = [123, 'abc', true];

[123, "abc", true]

配列、オブジェクト、単純な型の値を通じてさまざまな JSON データ形式を構築できます

、有用なオブジェクトに解析するのが簡単であることです

しかし危険です、悪意のあるコードが実行される可能性があります
ES5 は JSON を解析する動作を標準化します
グローバル オブジェクト JSON を定義します
2 つのメソッドがあります

• stringify()

  JavaScriptオブジェクト –> JSON 文字列
  

• parse()

  JSON 文字列 –> JavaScript オブジェクト
  

変換する変数をパラメータとして渡します
例 (この例は常にused)

var man = {    &#39;name&#39;: "payen", <--
    sex: "male", <--
    "age": 19,    "school": {        "name": &#39;HUST&#39;,        "sex": undefined, <--
        "location": function(){} <--
    }
}
var str = JSON.stringify(man);
console.log(str);
console.log(typeof str);

引用符で囲まれていない属性と一重引用符で囲まれた属性は、JSON 文字列内では二重引用符になっています
そして属性値は次のとおりです未定義または関数の属性は自動的に無視されます
(プロトタイプのメンバーも無視されます)

しかし、配列は異なります
配列にはオブジェクトがありませんそして彼らは容赦なく扱われるでしょう それを蹴飛ばしますが、nullを返します

console.log(JSON.stringify([123, undefined, null, function(){}]));

console.log(JSON.parse(str));

1 つ目はフィルターであり、配列または関数にすることができます
2 つ目は JSON 文字列のインデントです指定できます

引き続き上記の例です

var str = JSON.stringify(man,['name','sex']);
console.log(str);

返される値は、対応するキーの値です
関数が未定義を返した場合、属性は無視されます

var str = JSON.stringify(man, function(key, value){
    if(key == 'name'){        return 'abc';
    }    if(key == 'sex'){        return;
    }    return value;
});
console.log(str);

注意这里最后一定要写return value; 才能正常显示其他值
如果使用了switch语句就写default: return value;

缩进

空格填充

另一个参数可以填写数字指定缩进的空格数（最大缩进10）

var str = JSON.stringify(man, null, 4);
console.log(str);

字符填充

我们也可以指定缩进字符

var str = JSON.stringify(man, null, "- - ");
console.log(str);

toJSON()方法

可能有些时候stringify不够满足我们的需求
这时我们可以给对象定义toJSON()方法
（但仍然是调用stringify()方法）
返回自身的JSON的数据格式
原生Date对象有默认toJSON()返回日期字符串（同Date中方法toISOString()结果相同）

我们可以给我们的对象添加一个toJSON属性

var man = {    ...,
    toJSON: function(){        return this.school;
    }
}
var str = JSON.stringify(man);
console.log(str);

这里再多说一句
很多同学误认为toJSON()返回的是JSON字符串
其实不是的
toJSON()返回的应该是一个适当的值，然后由JSON.stringify()对其进行序列化
所以toJSON()是返回一个能够被字符串化的安全JSON值
下面我们来看看调用JSON.stringify()发生了什么

序列化对象顺序

• 如果对象有toJSON()并且能获得有效值，优先调用，否则返回对象本身

• 若有第二个参数，对上一步返回的对象应用过滤器

• 对上一步返回的每个值进行相应序列化

• 若有第三个参数，执行序列化

parse解析

JSON.parse也可以接受另一个参数，它是一个函数
类似于上面序列化中过滤器的过滤函数
它被称作还原函数，同样接受键和值作为参数
首先我现在我们例子中的对象添加一个方法

var man = {    ...,
    releaseDate: new Date(2016,11,11)
}
var str = JSON.stringify(man);
console.log(str);

我们看到，由于Date对象存在toJSON()
序列化之后调用了toJSON()
我们看到了这样的字符串

console.log(JSON.parse(str));

这样的数据不是我们想要的
这样的情况我们怎么处理呢？
答案是使用还原函数

可以这样做

var msg = JSON.parse(str,function(key, value){
    if(key == 'releaseDate'){        return new Date(value);
    }else{        return value;
    }
})
console.log(msg.releaseDate.getFullYear(),
            msg.releaseDate.getMonth(),
            msg.releaseDate.getDate());

这样我们就可以使用得到的时间数据了

小结

没想到写了这么多
JSON其实很简单
就是一个轻量级的数据格式
可以简化表示复杂数据结构的工作量
主要要掌握ES5的全局对象JSON中的两个方法JSON.stringify()和JSON.parse()
总结几个要记住的重点

• JSON.stringify()
  用于把JavaScript对象转换为JSON字符串
  可填写额外两个参数-筛选数组/替换函数和指定缩进
  

• 对象遇到undefined、function、symbol（ES6）会忽略

• 数组遇到undefined、function、symbol（ES6）会返回null

• JSON.parse()
  用于把JSON字符串转换为JavaScript对象
  可填写额外一个参数-还原函数

 以上就是轻量级数据格式——JSON的内容，更多相关内容请关注PHP中文网（m.sbmmt.com）！