js之遍歷嵌套數(shù)組對(duì)象方式
js遍歷嵌套數(shù)組對(duì)象
chuli(arr) { let kongarr = [] for (let i = 0; i < arr.length; i++) { console.log("arr[i]", arr[i]) let children1=[] let children2=[] let children3=[] let obj={} obj.id=arr[i].id obj.name=arr[i].name obj.children=children2 let two=arr[i].children for (let j=0;j<two.length;j++){ console.log("two",two[j]) let san=two[j].children console.log("san",san) children2.push({ id:two[j].id, name:two[j].name, children:children3 }) if (two[j].name=='市公司'&&two[j].children.length>=2){ let sum=0 for (let k=0;k<san.length;k++){ } children3.push({ age:"小計(jì)" }) }else { for (let k=0;k<san.length;k++){ children3.push({ bmdm:san[k].bmdm, xmlx:san[k].xmlx }) } } } kongarr.push(obj) } console.log("kongarr2", kongarr) return kongarr }
js中三種主要的遍歷對(duì)象的方法
for in
Object.keys
Object.getOwnProperty
對(duì)非Array對(duì)象類型的遍歷
1、for in
主要用于遍歷對(duì)象的可枚舉屬性,包括自有屬性、繼承自原型的屬性
var obj = {"name":"tom","sex":"male"}; Object.defineProperty(obj, "age", {value:"18", enumerable:false});//增加不可枚舉的屬性age Object.prototype.protoPer1 = function(){console.log("name is tom");};//通過(guò)原型鏈增加屬性,為一個(gè)函數(shù) Object.prototype.protoPer2 = 2;通過(guò)原型鏈增加屬性,為一個(gè)整型值2 console.log("For In : "); for(var a in obj) console.log(a);
輸出的截圖為:
總結(jié):for in 主要用于遍歷對(duì)象的可枚舉屬性,包括自有屬性、繼承自原型的屬性,示例中的屬性age為不可可枚舉,所以沒(méi)有輸出。
2、Object.keys
此方法返回一個(gè)數(shù)組,元素均為對(duì)象自有可枚舉的屬性
var obj = {"name":"tom","sex":"male"}; Object.defineProperty(obj, "age", {value:"18", enumerable:false});//增加不可枚舉的屬性age Object.prototype.protoPer1 = function(){console.log("name is tom");};//通過(guò)原型鏈增加屬性,為一個(gè)函數(shù) Object.prototype.protoPer2 = 2;通過(guò)原型鏈增加屬性,為一個(gè)整型值2 console.log("Object.keys:") console.log(Object.keys(obj));
輸出的截圖為:
總結(jié):Object.keys主要用于遍歷對(duì)象自有的可枚舉屬性,不包括繼承自原型的屬性和不可枚舉的屬性。
3、Object.getOwnProperty
此方法用于返回對(duì)象的自有屬性,包括可枚舉和不可枚舉的屬性
Object.defineProperty(obj, "age", {value:"18", enumerable:false});//增加不可枚舉的屬性age Object.prototype.protoPer1 = function(){console.log("name is tom");};//通過(guò)原型鏈增加屬性,為一個(gè)函數(shù) Object.prototype.protoPer2 = 2;通過(guò)原型鏈增加屬性,為一個(gè)整型值2 console.log("Object.getOwnPropertyNames: "); console.log(Object.getOwnPropertyNames(obj));
輸出的截圖為:
總結(jié):Object.getOwnProperty主要用于返回對(duì)象的自有屬性,包括可枚舉和不可枚舉的屬性,不包括繼承自原型的屬性。
對(duì)Array對(duì)象類型的遍歷
1、for in
var arr = [1,2,3,4,5,6]; for(var a in arr) console.log(a);
輸出的截圖為:
總結(jié):輸出為數(shù)組對(duì)象的index 值。
2、Object.keys
var arr = [1,2,3,4,5,6]; console.log(Object.keys(arr));
輸出的截圖為:
總結(jié):輸出為數(shù)組對(duì)象的index 值。
3、Object.getOwnProperty
var arr = [1,2,3,4,5,6]; console.log(Object.getOwnPropertyNames(arr));
輸出的截圖為:
總結(jié):輸出為數(shù)組對(duì)象的index 值和數(shù)組長(zhǎng)度的屬性值。
最后
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
JS實(shí)現(xiàn)橫向與豎向兩個(gè)選項(xiàng)卡Tab聯(lián)動(dòng)的方法
這篇文章主要介紹了JS實(shí)現(xiàn)橫向與豎向兩個(gè)選項(xiàng)卡Tab聯(lián)動(dòng)的方法,涉及JavaScript遍歷及動(dòng)態(tài)修改頁(yè)面元素屬性的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09js循環(huán)map 獲取所有的key和value的實(shí)現(xiàn)代碼(json)
這篇文章主要介紹了js循環(huán)map 獲取所有的key和value的實(shí)現(xiàn)代碼(json),需要的朋友可以參考下2018-05-05深入淺析javascript立即執(zhí)行函數(shù)
在Javascript中,任何function在執(zhí)行的時(shí)候都會(huì)創(chuàng)建一個(gè)執(zhí)行上下文,因?yàn)闉閒unction聲明的變量和function有可能只在該function內(nèi)部,這個(gè)上下文,在調(diào)用function的時(shí)候,提供了一種簡(jiǎn)單的方式來(lái)創(chuàng)建自由變量或私有子function。2015-10-10SlideView 圖片滑動(dòng)(擴(kuò)展/收縮)展示效果
滑動(dòng)展示效果主要用在圖片或信息的滑動(dòng)展示,也可以設(shè)置一下做成簡(jiǎn)單的口風(fēng)琴(Accordion)效果。2010-08-08怎樣用Javascript實(shí)現(xiàn)策略模式
這篇文章主要介紹了JavaScript設(shè)計(jì)模式之策略模式,想學(xué)習(xí)設(shè)計(jì)模式的同學(xué),一定要看一下2021-04-04js為鼠標(biāo)添加右擊事件防止默認(rèn)的右擊菜單彈出
本文為大家介紹下如何為使用js為鼠標(biāo)添加右擊事件防止默認(rèn)的右擊菜單彈出,感興趣的朋友可以參考下,希望對(duì)大家有所幫助2013-07-07JavaScript使用math.js進(jìn)行精確計(jì)算操作示例
這篇文章主要介紹了JavaScript使用math.js進(jìn)行精確計(jì)算操作,結(jié)合實(shí)例形式分析了開(kāi)源庫(kù)math.js進(jìn)行高精度數(shù)學(xué)運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下2018-06-06JS復(fù)制對(duì)應(yīng)id的內(nèi)容到粘貼板(Ctrl+C效果)
這篇文章主要給大家介紹了利用JS實(shí)現(xiàn)復(fù)制指定對(duì)應(yīng)id的內(nèi)容到粘貼板(Ctrl+C效果),文中給出了詳細(xì)的介紹和示例代碼,有需要的朋友可以參考借鑒,下面來(lái)一起看看吧。2017-01-01