DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JSON基礎 >> Ajax中解析Json的兩種方法對比分析
Ajax中解析Json的兩種方法對比分析
編輯:JSON基礎     

eval();  //此方法不推薦

JSON.parse();  //推薦方法

一、兩種方法的區別

我們先初始化一個json格式的對象:

  var jsonDate = '{ "name":"周星馳","age":23 }'

  var jsonObj = eval( '(' + jsonDate + ')' ); // eval();方法

  var jsonObj = JSON.parse( jsonDate ); // JSON.parse(); 方法

然後在控制台調用:

  console.log( jsonObj.name );  // 兩種方法都可以正確輸入 周星馳

那麼問題來了 兩種方法有什麼區別呢?(下面我們稍微把代碼改動一下,藍色字體為修改部分)

  var jsonDate = '{ "name":alert("hello"),"age":23 }'

  var jsonObj = eval( '(' + jsonDate + ')' ); // eval();方法

  console.log( jsonObj.age ); //會先執行“alert”輸出“hello” 然後才輸出 23

換“JSON.parse();”方法:

  var jsonDate = '{ "name":alert("hello"),"age":23 }'

  var jsonObj = JSON.parse( jsonDate ); // JSON.parse(); 方法

  cosole.log( jsonobj.age ) // 報錯 這個錯誤告訴我們這個字符串是不合法的

小結:“eval();”方法解析的時候不會去判斷字符串是否合法,而且json對象中的js方法也會被執行,這是非常危險的;而“JSON.parse();”方法的優點就不用多說了,推薦此方法。(不明白的盆友可以自己在控制台測試一下)

二、擴展問題

復制代碼 代碼如下:
var jsonDate = '{ "name":"周星馳","age":23 }'

大家可以看到在上面測試時一直用紅色把包在花括號外面的引號標注了起來,這對引號是很關鍵卻又是常常被忽略的,因為 “eval();” 和 “JSON.parser();” 這兩個方法的參數只接受字符串,也就是說只能解析字符串!!

那我不經會有一個思考,我們在初始化的時候若不加引號對,那麼它本身就是對象,js可以直接獲取對象本身的屬性和方法;為什麼還要加引號將它變成字符串之後再用 “eval();” 或者 “JSON.parse();” 解析,這樣做不是既不環保又沒有效率嗎?

原因很簡單:前端提供給後台的只能是字符串數據格式,後台返回給前台的就看返回的是什麼數據格式,是字符串就必須解析之後再用。

(這個小問題一般大家都會忽略掉,不太關注。我之所以好奇的原因也是因為對後台了解的不夠,把這個問題拋出來希望對後台不熟的朋友有所幫助,知道是怎麼回事後自然而然會加深記憶,在開發過程中就不會漏掉了)

以上所述就是本文的全部內容了,希望大家能夠喜歡。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved