js實(shí)現(xiàn)json數(shù)組分組合并操作示例
本文實(shí)例講述了js實(shí)現(xiàn)json數(shù)組分組合并操作。分享給大家供大家參考,具體如下:
<script> var arr = [ {"id":"1001","name":"值1","value":"111"}, {"id":"1001","name":"值1","value":"11111"}, {"id":"1002","name":"值2","value":"25462"}, {"id":"1002","name":"值2","value":"23131"}, {"id":"1002","name":"值2","value":"2315432"}, {"id":"1003","name":"值3","value":"333333"} ]; var map = {}, dest = []; for(var i = 0; i < arr.length; i++){ var ai = arr[i]; if(!map[ai.id]){ dest.push({ id: ai.id, name: ai.name, data: [ai] }); map[ai.id] = ai; }else{ for(var j = 0; j < dest.length; j++){ var dj = dest[j]; if(dj.id == ai.id){ dj.data.push(ai); break; } } } } console.log(dest); /* //運(yùn)行結(jié)果: [ { "id": "1001", "name": "值1", "data": [ {"id": "1001", "name": "值1", "value": "111"}, { "id": "1001", "name": "值1", "value": "11111"} ] }, { "id": "1002", "name": "值2", "data": [ { "id": "1002", "name": "值2", "value": "25462" }, { "id": "1002", "name": "值2", "value": "23131"}, {"id": "1002", "name": "值2","value": "2315432" } ] }, { "id": "1003", "name": "值3", "data": [ {"id": "1003", "name": "值3", "value": "333333" } ] } ] */ </script>
使用在線HTML/CSS/JavaScript代碼運(yùn)行工具:http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼,可得如下運(yùn)行結(jié)果:
PS:關(guān)于json操作,這里再為大家推薦幾款比較實(shí)用的json在線工具供大家參考使用:
在線JSON代碼檢驗(yàn)、檢驗(yàn)、美化、格式化工具:
http://tools.jb51.net/code/json
JSON在線格式化工具:
http://tools.jb51.net/code/jsonformat
在線XML/JSON互相轉(zhuǎn)換工具:
http://tools.jb51.net/code/xmljson
json代碼在線格式化/美化/壓縮/編輯/轉(zhuǎn)換工具:
http://tools.jb51.net/code/jsoncodeformat
在線json壓縮/轉(zhuǎn)義工具:
http://tools.jb51.net/code/json_yasuo_trans
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題:《JavaScript中json操作技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
微信小程序點(diǎn)擊按鈕動(dòng)態(tài)切換input的disabled禁用/啟用狀態(tài)功能
這篇文章主要介紹了微信小程序點(diǎn)擊按鈕動(dòng)態(tài)切換input的disabled禁用/啟用狀態(tài)功能,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03js獲取當(dāng)前日期時(shí)間及其它日期操作匯總
這篇文章主要介紹了js獲取當(dāng)前日期時(shí)間及其它日期操作匯總,感興趣的小伙伴們可以參考一下2016-03-03微信小程序有旋轉(zhuǎn)動(dòng)畫效果的音樂組件實(shí)例代碼
這篇文章主要介紹了微信小程序有旋轉(zhuǎn)動(dòng)畫效果的音樂組件,需要的朋友可以參考下2018-08-08js實(shí)現(xiàn)的捐贈(zèng)管理完整實(shí)例
這篇文章主要介紹了js實(shí)現(xiàn)的捐贈(zèng)管理完整實(shí)例,包括了html頁(yè)面、js腳本及css樣式的完整實(shí)現(xiàn)代碼,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01IE autocomplete internet explorer''s autocomplete
IE autocomplete internet explorer''s autocomplete...2007-06-06超全面的JavaScript開發(fā)規(guī)范(推薦)
作為一名開發(fā)人員(WEB前端JavaScript開發(fā)),不規(guī)范的開發(fā)不僅使日后代碼維護(hù)變的困難,同時(shí)也不利于團(tuán)隊(duì)的合作,通常還會(huì)帶來代碼安全以及執(zhí)行效率上的問題。本文就主要介紹了關(guān)于Javascript的命名規(guī)范、注釋規(guī)范以及框架開發(fā)的一些問題,需要的朋友可以參考學(xué)習(xí)。2017-01-01基于Web?Components實(shí)現(xiàn)一個(gè)日歷原生組件
這篇文章主要為大家詳細(xì)介紹了如何利用Web?Components實(shí)現(xiàn)一個(gè)簡(jiǎn)單的日歷原生組件,文中的示例代碼講解詳細(xì),需要的小伙伴可以了解一下2023-07-07