JSON.stringify的多種用法總結

Posted on by

前言

用過 json 的應該都知道，把一個對象通過 stringify 之後提交給後臺是很常用的手段。但是 IE6-7 下沒有 JSON 對象，所以要借助json2.js 來實現。

1.經典用法

 var data = [
     {name: "悟空", sex:1, age: 30},
     {name: "八戒", sex:0, age: 20},
     {name: "唐僧", sex:1, age: 30}
 ];//JavaScript數組中包含對象
//將JavaScript對象轉換為JSON格式的字符串
var str_json = JSON.stringify(data);
console.log(str_json);
//運行結果為:
//[{"name":"悟空","sex":1,"age":30},{"name":"八戒","sex":0,"age":20},{"name":"唐僧","sex":1,"age":30}]

So easy! 這個也是我們最常用的方式

2.復雜數據的提取

比如說，我們的數據非常復雜，還有類似頭像，昵稱，個人簽名之類的信息。可是我保存在本地，隻需要用戶名和性別,如果操作呢？我們可以通過提供的第二參數搞定,遍歷數據重新提取下即可。

a.傳統方式提取數據思路

var data = [
    {name: "悟空", sex:1, age: 30},
    {name: "八戒", sex:0, age: 20},
    {name: "唐僧", sex:1, age: 30}
];
//傳統方式提取數據
var new_data = [];
for (var i=0, new_data=[]; i<data.length; i++) {
    //構建行的數組
    new_data.push({
        name: data[i].name,
        sex:  data[i].age
    });
}
var str_json = JSON.stringify(new_data);
console.log(str_json);

b.使用stringify的第二參數搞定提取數據

var data = [
    {name: "悟空", sex:1, age: 30},
    {name: "八戒", sex:0, age: 20},
    {name: "唐僧", sex:1, age: 30}
];

var str_json = JSON.stringify(data,["name","age"]);
console.log(str_json);
//運行結果	
//[{"name":"悟空","age":30},{"name":"八戒","age":20},{"name":"唐僧","age":30}]

第二個參數隻要傳入需要的keys數組，就非常輕松的就完成這種處理瞭。

當然如果我們要更糾結的處理，比如要把 1,0 修改為男女，那麼第二個參數可以用回調函數來處理。

var data = [
    {name: "悟空", sex:1, age: 30},
    {name: "八戒", sex:0, age: 20},
    {name: "唐僧", sex:1, age: 30}
];

var str_json = JSON.stringify(data,function (key, value) {
    if(key==="sex"){
        return ["男生","女生"][value];
    }
    return value;
});
console.log(str_json);
// [{"name":"悟空","sex":"女生","age":30},{"name":"八戒","sex":"男生","age":20},{"name":"唐僧","sex":"女生","age":30}]

3.第三個參數”吳用”

非常雞肋的一個參數,基本沒有用過,看自己的情況!

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"],"\t");
console.log(str_json);
/*
[
	{
		"name": "悟空",
		"sex": 1
	},
	{
		"name": "八戒",
		"sex": 0
	},
	{
		"name": "唐僧",
		"sex": 1
	}
]
*/

不懂請查看api

developer.mozilla.org/en-US/docs/…

總結

到此這篇關於JSON.stringify用法的文章就介紹到這瞭,更多相關JSON.stringify用法內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet！

推薦閱讀：