一、前言

最近專案中，遇到需要將物件轉換成字串進行傳遞，上次寫過一篇文章關於json字串轉換成json物件，json物件轉換成字串，值轉換成字串，字串轉成值。當時主要是用在有時候處理字串和json物件之間的轉換，寫的主要是怎麼用，涉及到JSONstringify具體用法沒有涉及到，有時候對於一個JSON.stringify自帶的方法掌握一下，可能會對於一個問題有更快的解決方案。

文章同步的社群：http://www.mwcxs.top/page/426.html

二、用法例項

1、方法的定義

2、JSON.stringify提供了引數分離出自己需要的那部分資料

3、JSON.stringify提供了引數回撥函式做一個對映關係

4、JSON.stringify提供了引數格式化字串

用過JSON都知道，把一個物件通過stringify之後變成字串，再提交給後臺或者儲存在storage是很常用的手段（storage是存的key，value；value只能存字串，而不能是json物件）。

var data =[
{
    name: "程咬金",sex:"1",age:26    
},
{
    name: "程才",sex:"0",age:20
},
{
    name: "程新鬆",sex:"1",age:22    
},
{
    name: "程功",sex:"1",age:18    
}
];
console.log(data,'陣列');
var str_json = JSON.stringify(data);
console.log(str_json,'字串');

這個是日常的用法，非常簡單。

1、方法的定義

JSON.stringify ( value [, replacer] [ , space] )

引數：

（1）value：必選，要轉換的值（包括所有的資料型別，通常是物件或者陣列）

（2）replace：可選，用於要轉換結果的函式或者陣列；如果replace是陣列，僅僅是轉換具有該鍵值的成員，成員的轉換順序和鍵在陣列中的順序一致；如果replace是函式，會傳入每一個成員的鍵和值，使用的是返回值而不是原始值，如果函式返回的是undefined，則排除該成員。查看了JSON2的原始碼，

  rx_escapable.lastIndex = 0;
        return rx_escapable.test(string)
            ? "\"" + string.replace(rx_escapable, function (a) {
                var c = meta[a];
                return typeof c === "string"
                    ? c
                    : "\\u" + ("0000" + a.charCodeAt(0).toString(16)).slice(-4);
            }) + "\""
            : "\"" + string + "\"";
    }

確認並不會傳入每個成員的鍵和值，而僅僅以空字串形式呼叫replacer函式。該函式的實質是自定義的用於轉化為JSON字串的函式。

（3）space：可選， 向返回值JSON 文字新增縮排、空格和換行符以使其更易於讀取。

2、JSON.stringify提供了分離出自己需要的那部分資料

比如說這個場景，我們的資料非常的複雜，有類似頭像，暱稱，個人簽名等，可是我儲存在本地，只需要使用者名稱，性別，怎麼搞？

方法一：可以用遍歷陣列重新提取一下

var data =[
{
    name: "程咬金",sex:"1",age:26    
},
{
    name: "程才",sex:"0",age:20
},
{
    name: "程新鬆",sex:"1",age:22    
},
{
    name: "程功",sex:"1",age:18    
}
];
/*日常用法*/
//console.log(data,'陣列');
//var str_json = JSON.stringify(data);
//console.log(str_json,'字串');

/*提取使用者名稱和性別*/
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);

方法二：的確可以這麼幹，但是JSON.stringify提供了引數分離出自己需要的那部分資料

var data =[
{
    name: "程咬金",sex:"1",age:26    
},
{
    name: "程才",sex:"0",age:20
},
{
    name: "程新鬆",sex:"1",age:22    
},
{
    name: "程功",sex:"1",age:18    
}
];
/*日常用法*/
//console.log(data,'陣列');
//var str_json = JSON.stringify(data);
//console.log(str_json,'字串');

/*提取使用者名稱和性別-方法1*/
//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);
/*提取使用者名稱和性別-方法2*/
var str_json = JSON.stringify(data,["name","sex"]);
console.log(str_json);

第二個引數只要傳入需要的keys陣列，就非常輕鬆的處理這個

3、JSON.stringify提供了回撥函式做一個對映關係

比如說，我們把sex裡的1,0修改為男，女 ，那麼第二個引數可以通過回撥函式來處理這個對映關係。

var data =[
{
    name: "程咬金",sex:"1",age:26    
},
{
    name: "程才",sex:"0",age:20
},
{
    name: "程新鬆",sex:"1",age:22    
},
{
    name: "程功",sex:"1",age:18    
}
];
/*日常用法*/
//console.log(data,'陣列');
//var str_json = JSON.stringify(data);
//console.log(str_json,'字串');

/*提取使用者名稱和性別-方法1*/
//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);
/*提取使用者名稱和性別-方法2*/
//var str_json = JSON.stringify(data,["name","sex"]);
//console.log(str_json);

/*回撥函式做一個對映關係*/
var str_json = JSON.stringify(data,function(key,value){
    if(key == 'sex'){
        return ["女",'男'][value];
    }
    return value;
});
console.log(str_json);

第二個引數很厲害，省去了不少的麻煩

4、JSON.stringify提供了引數格式化字串

第三個引數，用於格式化字串

var data =[
{
    name: "程咬金",sex:"1",age:26    
},
{
    name: "程才",sex:"0",age:20
},
{
    name: "程新鬆",sex:"1",age:22    
},
{
    name: "程功",sex:"1",age:18    
}
];
/*日常用法*/
//console.log(data,'陣列');
//var str_json = JSON.stringify(data);
//console.log(str_json,'字串');

/*提取使用者名稱和性別-方法1*/
//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);
/*提取使用者名稱和性別-方法2*/
//var str_json = JSON.stringify(data,["name","sex"]);
//console.log(str_json);

/*回撥函式做一個對映關係*/
//var str_json = JSON.stringify(data,function(key,value){
//    if(key == 'sex'){
//        return ["女",'男'][value];
//    }
//    return value;
//});
//console.log(str_json);

/*格式化字串*/
var str_json = JSON.stringify(data,null,'\t');
console.log(str_json);
var str_json = JSON.stringify(data,['name','sex'],'\t');
console.log(str_json);

一般情況下用不上，除了可以用於匯出這些資料，儲存本地檢視方便。

最後附上js的程式碼，使用node就可以執行這個js

var data =[
{
    name: "程咬金",sex:"1",age:26    
},
{
    name: "程才",sex:"0",age:20
},
{
    name: "程新鬆",sex:"1",age:22    
},
{
    name: "程功",sex:"1",age:18    
}
];
/*日常用法*/
//console.log(data,'陣列');
//var str_json = JSON.stringify(data);
//console.log(str_json,'字串');

/*提取使用者名稱和性別-方法1*/
//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);
/*提取使用者名稱和性別-方法2*/
//var str_json = JSON.stringify(data,["name","sex"]);
//console.log(str_json);

/*回撥函式做一個對映關係*/
var str_json = JSON.stringify(data,function(key,value){
    if(key == 'sex'){
        return ['女','男'][value];
        /*該處註釋等價於return ['女','男'][value];*/
//        if(value == 0 ){
//            value = '女';
//        }else{
//            value = '男';
//        }
    }
    return value;
});
console.log(str_json);

/*格式化字串*/
//var str_json = JSON.stringify(data,null,'\t');
//console.log(str_json);
//var str_json = JSON.stringify(data,['name','sex'],'\t');
//console.log(str_json);

注意：

1、JSON.stringify會自動把所要轉換內容中的漢字轉換為Unicode編碼
2、瀏覽器間有差別，個別瀏覽器會把將要提交表單內容中的Unicode編碼自動轉為漢字（Chrome自動轉換，IE不轉）

本文轉自https://www.cnblogs.com/chengxs/p/8656723.html