1. 程式人生 > >js 解析json 常用方法 --前端與後端的互動(前端)

js 解析json 常用方法 --前端與後端的互動(前端)

(1)前端js解析前端json資料:

one:

javascript定義json物件變數:

var jsonobject={};//可以不使用宣告,推薦宣告一下,嚴格一些,最好使用嚴格模式

賦值json物件的key-value值:

jsonobject[key]=value;//不嚴格的話就直接,var jsonobject={'key':'value',...}

 可以先判斷json中是否存在某個key(可以忽略):

if(jsonobject.hasOwnProperty("key")){
   //判斷存在之後執行的動作
}

遍歷json物件1:

var jsonobject={"name":"張三","sex":"女",..}

//1.獲取key-value方法(不知道key值的情況):

for(var key in jsonobject){

alert(key);//獲取json物件的key

alert(jsonobject[key]);//獲取json物件key對應的value值

}

//2.獲取value方法(知道key值的情況):

alert(jsonobject.name);

alert(jsonobject.sex);

遍歷json物件2:

var jsonobject={

"0":{"name":"2","sex":"1"},

"1":{"name":"3","sex":"7"}

};

for(var key in jsonobject){

alert(key);//獲取key

for(var subkey in jsonobject[key]){

alert(jsonobject[key].name)//獲取具體key的value值

alert(subkey);//獲取子key

//獲取subkey的value值(方法行不通:jsonobject[key][subkey],返回的是undefined)

//正確獲取subkey的value值

alert(eval("jsonobject[key]."+subkey));

}

}

two:

定義json陣列變數:

var jsonarray=[];//跟上面一樣,可以不嚴格

賦值json陣列值:  推薦使用jsonarray.push()方法賦值,其他變數,如jsonarray,push(jsonObject)等;

var json={

"name":"1",

"sex":"3"

};

var json2={

"name":"5",

"sex":"7"

};

jsonarray.push(json);

jsonarray.push(json2);

遍歷json陣列:

for(var i=0;i<jsonarray.length;i++){//或者使用for(var subkey in jsonarray)

alert(jsonarray[i].name)//獲取json陣列key對應的value

for(var key in jsonarray[i]){

alert(key);//獲取json物件key

alert(jsonarray[i][key])//獲取json物件value

//不能使用jsonarray[i].key來獲取value值,因為它會把key識別成它的屬性,變成key值為"key"

}

}

(2) 前端js解析後端json資料字串

後端傳來的json字串:

jsonstr=[{"RES":"OK","MSG":"success"}]//或jsonstr=[{..},{..},[{..},{..}]]

解析:

var jsonArray=JSON.parse(jsonstr);//一般使用這種方法,將資料轉換成JavaScript物件

/*
或var jsonArray=eval('('+jsonstr+')');//此方法不建議用來轉json

或var jsonArray=jsonstr.parseJSON();//此方法容易拋語法上的異常,不建議使用

或var jsonobj=jsonArray[i]//賦值給jsonobj變數,對應的是第i個jsonArray值(可以是jsonarray或者jsonobject)
*/

遍歷解析同(1)前端js解析前端json資料;

(3)javascript json物件轉為json字串

toJSONString()或者 JSON.stringify(),如由前端請求後端傳送ajax請求data引數,

PS:

下面data資料是前端請求給後端的資料,async是否需要同步,success接收請求成功後的資料,存放data中

dataType是後端返回的資料格式:當JSON的話 解析的時候就不用特意轉成json物件了,直接使用var xxx=data.xxx接收就可以了,如果是Text的話,需要轉成json物件如使用JSON.parse(data)轉化一下;剩下的就是自己慢慢參考上面解析了。

$.ajax({

type: "POST",//請求方式

url: '/PostServlet',//指定的連結

data: JSON.stringify({//請求後端的引數

                 tokenID: Token,

                 schema: Schema,

                 funData: JSON.stringify({

                  func: 'doFunc',

                  params: param

             })

           }),

dataType: "JSON",//或"TEXT" //請求返回的資料型別
 async: false,  //是否需要同步
 success: function (data) { //請求返回成功後執行的function
     //後端返回json資料可以在這裡,應用上面所說的解析json方法解析
    }

})