JSON stringify方法原理及實例解析
JSON.stringify() 方法用于將 JavaScript 值轉(zhuǎn)換為 JSON 字符串。
語法
JSON.stringify(value[, replacer[, space]])
參數(shù)說明:
value:
必需, 要轉(zhuǎn)換的 JavaScript 值(通常為對象或數(shù)組)。
replacer:
可選。用于轉(zhuǎn)換結(jié)果的函數(shù)或數(shù)組。
如果 replacer 為函數(shù),則 JSON.stringify 將調(diào)用該函數(shù),并傳入每個成員的鍵和值。使用返回值而不是原始值。如果此函數(shù)返回 undefined,則排除成員。根對象的鍵是一個空字符串:""。
如果 replacer 是一個數(shù)組,則僅轉(zhuǎn)換該數(shù)組中具有鍵值的成員。成員的轉(zhuǎn)換順序與鍵在數(shù)組中的順序一樣。
space:
可選,文本添加縮進、空格和換行符,如果 space 是一個數(shù)字,則返回值文本在每個級別縮進指定數(shù)目的空格,如果 space 大于 10,則文本縮進 10 個空格。space 也可以使用非數(shù)字,如:\t。
返回值:
返回包含 JSON 文本的字符串。
實例
var str = {"name":"菜鳥教程", "site":"http://www.runoob.com"}
str_pretty1 = JSON.stringify(str)
document.write( "只有一個參數(shù)情況:" );
document.write( "<br>" );
document.write("<pre>" + str_pretty1 + "</pre>" );
document.write( "<br>" );
str_pretty2 = JSON.stringify(str, null, 4) //使用四個空格縮進
document.write( "使用參數(shù)情況:" );
document.write( "<br>" );
document.write("<pre>" + str_pretty2 + "</pre>" ); // pre 用于格式化輸出
但是 IE6-7 下沒有 JSON 對象,所以要借助json2.js來實現(xiàn)。
今天我們來簡單介紹下stringify方法的一些正確使用姿勢吧。
當然,讓高手們賤笑了,本文只是分享一些方法給新手朋友們。
var data = [
{name: "王尼瑪", sex:1, age: 30},
{name: "王尼美", sex:0, age: 20},
{name: "王大錘", sex:1, age: 30}
];
var str_json = JSON.stringify(data);
console.log(str_json);
這個是我們?nèi)粘S梅?,非常簡單,對吧?/p>
比如說,我們的數(shù)據(jù)非常復(fù)雜,還有類似頭像,昵稱,個人簽名之類的信息。
可是我保存在本地,只需要用戶名,和性別,腫么破呢?
也許你會說 so easy, 遍歷數(shù)據(jù)重新提取下即可。
例如:
var data = [
{name: "王尼瑪", sex:1, age: 30},
{name: "王尼美", sex:0, age: 20},
{name: "王大錘", sex:1, age: 30}
];
for (var i=0, new_data=[]; i<data.length; i++) {
new_data.push({
name: data[i].name,
sex: data[i].sex
});
}
var str_json = JSON.stringify(new_data);
console.log(str_json);
確實分分鐘搞定。
其實我們只需要用stringify第二個參數(shù)即可簡單處理這種問題。
var data = [
{name: "王尼瑪", sex:1, age: 30},
{name: "王尼美", sex:0, age: 20},
{name: "王大錘", sex:1, age: 30}
];
var str_json = JSON.stringify(data, ["name", "sex"]);
console.log(str_json);
第二個參數(shù)只要傳入需要的keys數(shù)組,就非常輕松的就完成這種處理了。
當然如果我們要更糾結(jié)的處理,比如要把 1,0 修改為男女,那么第二個參數(shù)可以用回調(diào)函數(shù)來處理。
var data = [
{name: "王尼瑪", sex:1, age: 30},
{name: "王尼美", sex:0, age: 20},
{name: "王大錘", sex:1, age: 30}
];
var str_json = JSON.stringify(data, function (k, v) {
if (k === "sex") {
return ["女", "男"][v];
}
return v;
});
console.log(str_json);
第二個參數(shù)如此強悍,為我們省去了不少麻煩。
還有第三個參數(shù),用于格式化字符串用的。
var data = [
{name: "王尼瑪", sex:1, age: 30},
{name: "王尼美", sex:0, age: 20},
{name: "王大錘", sex:1, age: 30}
];
var str_json = JSON.stringify(data, null, "\t");
console.log(str_json);
str_json = JSON.stringify(data, ["name", "sex"], "\t");
console.log(str_json);
其實,我覺得這是個非常雞肋的功能,,一般情況下卻是沒啥用。
好了,今天的分享就這些了,希望對新手朋友有所幫助。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
getAsDataURL在Firefox7.0下無法預(yù)覽本地圖片的解決方法
本文是對getAsDataURL在Firefox7.0下無法預(yù)覽本地圖片的解決方法。進行了分析介紹,需要的朋友可以過來參考下,希望對大家有所幫助2013-11-11
JavaScript中常見的字符串操作函數(shù)及用法匯總
這篇文章主要介紹了JavaScript中常見的字符串操作函數(shù)及用法,實例匯總了javascript常見的字符串轉(zhuǎn)換、分割、查詢、替換等技巧,非常具有實用價值,需要的朋友可以參考下2015-05-05
原生JavaScrpit中異步請求Ajax實現(xiàn)方法
這篇文章主要介紹了原生JavaScrpit中異步請求Ajax實現(xiàn)方法,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-11-11
權(quán)威JavaScript 中的內(nèi)存泄露模式
權(quán)威JavaScript 中的內(nèi)存泄露模式...2007-08-08

