首頁 > web前端 > js教程 > 主體

深入淺析JSON.parse()、JSON.stringify()和eval()的作用詳解_javascript技巧

WBOY
發布: 2016-05-16 15:06:47
原創
1956 人瀏覽過

「JSON(JavaScript Object Notation) 是一種輕量級的資料交換格式。它是基於ECMAScript的子集。因為採用獨立於語言的文字格式,也使用了類似於C語言家族的習慣,擁有了這些特性使JSON成為理想的資料交換語言,作用是易於人閱讀和編寫,同時也易於機器解析和生成(一般用於提升網絡傳輸速率)。

  今天在這裡筆者想簡單談談jquery裡面的JSON.parse()和JSON.stringify()函數,順便還會提一下原生JS裡面的eval()函數

(1)JSON.parse 函數

作用:將 JavaScript 物件表示法 (JSON) 字串轉換為物件。  

語法:JSON.parse(text [, reviver])

參數:

text  必需。 一個有效的 JSON 字串。


reviver  可選。 一個轉換結果的函數。 將為物件的每個成員呼叫此函數。

傳回值:一個物件或陣列

example:

var json = '{"name":"GDT","age":,"University":"GDUT"}';
var info = JSON.parse(json);  //解析为JSON对象
document.write(info.name + ' is a student of ' + info.University + ' and he is ' + info.age + " years old."); /info为Object对象
登入後複製

(2)JSON.stringify()函數

作用:將 JavaScript 值轉換為 JavaScript 物件表示法 (JSON) 字串

文法:JSON.stringify( value [, replacer] [, space])

參數:

value  必需,通常為需要轉換的JavaScript值(通常為物件或陣列)


replacer  可選,用於轉換結果的函數或陣列


space  可選。在返回值 JSON 文字中新增縮排、空格和換行符以使其更易於讀取。


傳回值:一個包含JSON文字的字串

example:

var info = {name:"GDT",age:,University:"GDUT"};
var json = JSON.stringify(info); //转换为JSON字符串
document.write(json); //output为{"name":"GDT","age":23,"University":"GDUT"}
登入後複製

(3)eval()函數

作用:eval() 函數可計算某個字串,並執行其中的 JavaScript 程式碼。

語法:eval(string)

參數:

string  必需,要計算的字串,其中含有要計算的 JavaScript 表達式或要執行的語句。


傳回值:傳回計算string的值,如果有的話 (沒有則不做任何改變回傳)

example:

eval("x=;y=;document.write(x*y)"); //output为
document.write(eval("+"));  //output为
var x=;
document.write(eval(x+));  //output为

登入後複製
  使用eval()函數也可以將JSON字串解析為對象,這個功能能完成JSON.parse()的功能,但是有不一樣的地方,請看下面程式碼

// JSON.parse()
var json = '{"name":"GDT","age":,"University":"GDUT"}';
var info = JSON.parse(json);    //解析为JSON对象
document.write(info); //output为[object Object]
//eval()
var json = '{"name":"GDT","age":,"University":"GDUT"}';
var info = eval('(' + json + ')'); //解析为JSON对象
document.write(info); //output为[object Object]
登入後複製
  不知道大家有木有註意到eval()還要用一對圓括號將字串包起來,對此我尋找到比較好的解釋就是:

原因:歸結於eval本身的問題,由於json是以”{}”的方式來開始以及結束的,在JS中,它會被當成一個語句塊來處理,所以必須強制性的將它轉換成一種表達式。


解決方法:加上圓括號的目的是迫使eval函數在處理JavaScript程式碼的時候強制將括號內的表達式(expression)轉換為對象,而不是作為語句(statement)來執行。舉一個例子,例如物件字面量{},如若不加外層的括號,那麼eval會將大括號識別為JavaScript程式碼區塊的開始和結束標記,那麼{}將會被認為是執行了一句空語句。請看下列例子的不同

alert(eval("{}")); // return undefined
alert(eval('('+'{}'+')')); // return object[Object] 
登入後複製
  另外,相對於寫法格式嚴格的JSON.parse()來說,eval()可以解析任何字串,eval是不安全的,因為eval比較寬鬆,會有潛在的安全性問題。例如以下程式碼:

var str = '{"a":"b"}';
document.write(eval("("+str+")")); //正常解析为对象
var str = '{"a": (function(){alert("I can do something bad!");})()}';
eval('('+str+')'); //可以用来执行木马脚本 
登入後複製
  如果用惡意使用者在json字串中註入了向頁面插入木馬連結的腳本,用eval也是可以操作的,而用JSON.parse()則不必擔心這個問題,可見,雖然eval()功能很強大,但是實際用到的機會不多。

  個人總結的時候到了,這是我人生第一篇的博客,在4月1號Fool's Day誕生,寫得不好的地方還希望各位多多見諒,現在技術非常渣,我很希望現在能夠一點一滴去累積知識,為日後的成功奠定好基礎,fighting~

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板