鍍金池/ 問答/網(wǎng)絡安全  HTML/ 數(shù)組es6遍歷取值問題

數(shù)組es6遍歷取值問題

有沒有什么快捷一點的方法去遍歷樹形結構的數(shù)組,取出需要的值呢?

var arr = [
        {
            title: '書籍',
            id: 1,
            select: false,
            children: [
                {
                    title: '語文',
                    id: 11,
                    select: false
                },
                {
                    title: '數(shù)學',
                    id: 12,
                    select: false
                }
            ]
        },
        {
            title: '文具',
            id: 2,
            select: true,
            children: [
                {
                    title: '鉛筆',
                    id: 21,
                    select: false
                },
                {
                    title: '尺子',
                    id: 12,
                    select: false
                }
            ]
        },
        {
            title: '水果',
            id: 3,
            select: false,
            children: [
                {
                    title: '蘋果',
                    id: 31,
                    select: true
                },
                {
                    title: '香蕉',
                    id: 32,
                    select: false
                }
            ]
        }
    ];

取出select為true的值

回答
編輯回答
好難瘦

如果數(shù)據(jù)是傳輸過來的,則只有遍歷一種方法,而且沒有多少取巧的地方。
如果數(shù)據(jù)是在一個系統(tǒng)內產(chǎn)生的,則可能結合一些處理進行綜合考慮。

2017年5月21日 03:57
編輯回答
使勁操

怎樣算快捷…

基礎的方法是遞歸:

var results = [];
function findTrue(nodes) {
  nodes.forEach(function (node) {
    if (node.select) results.push(node);
    if (node.children) findTrue(node.children)
  });
}

findTrue(arr);

別忘了加上符合實際業(yè)務的判斷條件

2017年7月26日 02:18
編輯回答
神經(jīng)質

獻丑了,基本和快是無緣了,不過順帶把數(shù)據(jù)壓平了23333

arr.map(function func(el) {
     return el.children ?
       [el, ...el.children.map(func)] :
       el;
   })
   .reduce(function reducer(na, next) {
     if (next instanceof Array) {
       return [...na, ...next.reduce(reducer, [])];
     }
     return [...na, next];
   }, []);
   .filter(el => el.select)
2018年6月21日 14:31
編輯回答
墨沫
arr.filter(function(item){return item.select});

單層可以這樣

2018年9月19日 18:23
編輯回答
墨沫
let temp = [...arr]
while (temp.length) {
    let item = temp.shift()
    if (item.select === true) {
        // do something
    }
    if (item.children) {
        temp.push(...item.children)
    }
}

這是比較好寫的一種遍歷方式,就是效率不咋地。

2018年5月18日 18:31
編輯回答
朽鹿
var res = []
var len = arr.length;
for (let i = 0; i < len; i++){
    if (arr[i].select) res.push(arr[i])
    var childLen = arr[i].children.length
    for (let j = 0; j < childLen; j++) {
        if (arr[i].children[j].select) res.push(arr[i].children[j])
    }
}

獻丑了

2018年6月1日 17:33