JSON(JavaScript Object Notation) 是一種輕量級的資料交換格式。它基於ECMAScript的一個子集。

在AJAX實現前後臺數據互動的時候，通常使用JSON的資料格式，對於JSON來說，有嚴格的程式碼規範，一旦格式出問題，就無法顯示出相應效果，同時還不在控制檯報錯。

一、Json物件轉換為json字串

1）使用瀏覽器自帶的JSON物件：JSON.stringify(jsonObj)，缺點是相容性不好，對於ie8以下的版本不支援。

var jsonObj = {"id":1,"username":"admin","password":"admin123","state":1,"regDate":"2018-10-14","roles":[{"id":1,"roleName":"超級管理員","state":1}]};
var jsonStr = JSON.stringify(jsonObj);
alert(jsonStr);
 

2）引用 json2.js ,使用JSON物件轉換：JSON.stringify(jsonObj)，相容所有瀏覽器 

<script type="text/javascript" src="./static/js/json2.js"></script>

var jsonObj = {"id":1,"username":"admin","password":"admin123","state":1,"regDate":"2018-10-14","roles":[{"id":1,"roleName":"超級管理員","state":1}]};
var jsonStr = JSON.stringify(jsonObj);
alert(jsonStr);
 

注意：

$.ajax 傳到後臺的data資料型別string：基本簡單型別會自動處理成json物件，如果包含複雜型別（陣列，集合等）就必須轉為json物件，並宣告 contentType:"application/json;charset=utf-8",

contentType:"application/json;charset=utf-8", //傳過去的資料格式，從js物件格式轉化為jsonStr格式
data:JSON.stringify({	
    username: row.username,	
    password: row.password,	
    regDate: row.regDate,	
    roles: [{id:$("#roleValueId").val(),roleName:$("#roleTextName").val()}]    
}),    
 

二、json字串轉換為Json物件 

1）使用瀏覽器自帶的JSON物件：JSON.parse(jsonStr)，缺點是相容性不好，對於ie8以下的版本不支援。

var jsonStr = '{"id":1,"username":"admin","password":"admin123","state":1,"regDate":"2018-10-14","roles":[{"id":1,"roleName":"超級管理員","state":1}]}';
var jsonObj = JSON.parse(jsonStr);
alert(jsonObj);

2）引用 json2.js ,使用JSON物件轉換：JSON.parse(jsonStr)，相容所有瀏覽器

<script type="text/javascript" src="./static/js/json2.js"></script>

var jsonStr = '{"id":1,"username":"admin","password":"admin123","state":1,"regDate":"2018-10-14","roles":[{"id":1,"roleName":"超級管理員","state":1}]}';
var jsonObj = JSON.parse(jsonStr);
alert(jsonObj);

3）使用 Ajax 的轉換物件：$.parseJSON(jsonStr)

var jsonStr = '{"id":1,"username":"admin","password":"admin123","state":1,"regDate":"2018-10-14","roles":[{"id":1,"roleName":"超級管理員","state":1}]}';
var jsonObj = $.parseJSON(jsonStr);
alert(jsonObj);

4）使用 eval() 物件 注意：json字串的兩端需要加上一個括號（此方法不推薦）

var jsonStr = '{"id":1,"username":"admin","password":"admin123","state":1,"regDate":"2018-10-14","roles":[{"id":1,"roleName":"超級管理員","state":1}]}';
var jsonObj = eval("(" + jsonStr + ")");
alert(jsonObj);

提示：為什麼要 eval這裡要新增  ( "(" + jsonStr + ")" ); 呢？

　　原因在於：eval本身的問題。 由於json是以”{}”的方式來開始以及結束的，在JS中，它會被當成一個語句塊來處理，所以必須強制性的將它轉換成一種表示式。加上圓括號的目的是迫使eval函式在處理JavaScript程式碼的時候強制將括號內的表示式（expression）轉化為物件，而不是作為語句（statement）來執行。舉一個例子，例如物件字面量{}，如若不加外層的括號，那麼eval會將大括號識別為JavaScript程式碼塊的開始和結束標記，那麼{}將會被認為是執行了一句空語句。 

注意：

目前，Firefox、Opera、IE8以上版本也提供了本地JSON支援。其中，JSON直譯器提供的函式有：JSON.parse、JSON.stringify。 對於那些並不提供本地JSON支援的瀏覽器可以引入指令碼json2.js，來實現JSON轉換功能。

json2.js 指令碼下載 ：https://github.com/douglascrockford/JSON-js/blob/master/json2.js

三、$.ajax簡單例項

		 $.ajax({   
			type : "get",
			url : "/sshweb_ui/user/Userid",
			data : {id:1},
			dataType : "json",
			success : function(data){
				console.log(data);//後臺json資料物件
				console.log(data.username);
				console.log(data.roles[0].roleName);
				console.log(JSON.stringify(data)); //後臺json資料轉換為jsonStr
			},
			error: function (XMLHttpRequest, textStatus, errorThrown) {
			    alert(XMLHttpRequest.status);
			    alert(XMLHttpRequest.readyState);
			    alert(textStatus + "ajax出錯了");
			}

		});