JSON.stringify的多種用法總結(jié)
前言
用過 json 的應(yīng)該都知道,把一個對象通過 stringify 之后提交給后臺是很常用的手段。但是 IE6-7 下沒有 JSON 對象,所以要借助json2.js 來實現(xiàn)。
1.經(jīng)典用法
var data = [ {name: "悟空", sex:1, age: 30}, {name: "八戒", sex:0, age: 20}, {name: "唐僧", sex:1, age: 30} ];//JavaScript數(shù)組中包含對象 //將JavaScript對象轉(zhuǎn)換為JSON格式的字符串 var str_json = JSON.stringify(data); console.log(str_json); //運行結(jié)果為: //[{"name":"悟空","sex":1,"age":30},{"name":"八戒","sex":0,"age":20},{"name":"唐僧","sex":1,"age":30}]
So easy! 這個也是我們最常用的方式
2.復(fù)雜數(shù)據(jù)的提取
比如說,我們的數(shù)據(jù)非常復(fù)雜,還有類似頭像,昵稱,個人簽名之類的信息。可是我保存在本地,只需要用戶名和性別,如果操作呢?我們可以通過提供的第二參數(shù)搞定,遍歷數(shù)據(jù)重新提取下即可。
a.傳統(tǒng)方式提取數(shù)據(jù)思路
var data = [ {name: "悟空", sex:1, age: 30}, {name: "八戒", sex:0, age: 20}, {name: "唐僧", sex:1, age: 30} ]; //傳統(tǒng)方式提取數(shù)據(jù) var new_data = []; for (var i=0, new_data=[]; i<data.length; i++) { //構(gòu)建行的數(shù)組 new_data.push({ name: data[i].name, sex: data[i].age }); } var str_json = JSON.stringify(new_data); console.log(str_json);
b.使用stringify的第二參數(shù)搞定提取數(shù)據(jù)
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); //運行結(jié)果 //[{"name":"悟空","age":30},{"name":"八戒","age":20},{"name":"唐僧","age":30}]
第二個參數(shù)只要傳入需要的keys數(shù)組,就非常輕松的就完成這種處理了。
當(dāng)然如果我們要更糾結(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 (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.第三個參數(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,["name","sex"],"\t"); console.log(str_json); /* [ { "name": "悟空", "sex": 1 }, { "name": "八戒", "sex": 0 }, { "name": "唐僧", "sex": 1 } ] */
不懂請查看api
developer.mozilla.org/en-US/docs/…
總結(jié)
到此這篇關(guān)于JSON.stringify用法的文章就介紹到這了,更多相關(guān)JSON.stringify用法內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- JS中JSON.parse(JSON.stringify())實現(xiàn)深拷貝
- JavaScript語法 JSON序列化之stringify實例詳解
- JS中的Error對象及使用JSON.stringify()序列化Error問題
- JSON stringify及parse方法實現(xiàn)數(shù)據(jù)深拷貝
- JavaScript對象與JSON格式的轉(zhuǎn)換及JSON.stringify和JSON.parse的使用方法
- 前端使用JSON.stringify實現(xiàn)深拷貝的巨坑詳解
- 學(xué)習(xí)JSON.stringify的9大特性和轉(zhuǎn)換規(guī)則
- 詳解JSON.parse和JSON.stringify用法
- 簡易版本JSON.stringify的實現(xiàn)及其六大特性詳解
- 使用 JSON.stringify() 列化一個Error
相關(guān)文章
bootstrap時間插件daterangepicker使用詳解
這篇文章主要為大家詳細介紹了bootstrap時間插件daterangepicker使用,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-10-10淺談js中用$(#ID)來作為選擇器的問題(id重復(fù)的時候)
下面小編就為大家?guī)硪黄獪\談js中用$(#ID)來作為選擇器的問題(id重復(fù)的時候)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-02-02使用自定義setTimeout和setInterval使之可以傳遞參數(shù)和對象參數(shù)
該函數(shù)兼容ie,firefox。并且可以使用clearSetTimeOut和clearInterval清除,比原setTimeout,setInterval方便很多,并且參數(shù)可以是object。2009-04-04bootstrap datetimepicker2.3.11時間插件使用
這篇文章主要為大家詳細介紹了bootstrap datetimepicker2.3.11時間插件使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-11-11