Javascript - 遍历对象并更新属性答案

【问题标题】：Javascript - traversing through object and updating propertyJavascript - 遍历对象并更新属性
【发布时间】：2016-12-19 18:49:36
【问题描述】：

我希望有人能指出我正确的方向。

我有一个 JavaScript 对象，如下所示...

var category = [{
    isExpanded: false,
    name: "Electricals",
    subcategories: [{
        isExpanded: false,
        name: "Audio",
        subcategories: null
    }, {
        isExpanded: false,
        name: "Photography",
        subcategories: null
    }]
}, {
    isExpanded: false,
    name: "Telecoms",
    subcategories: [{
        isExpanded: false,
        name: "Mobile",
        subcategories: null
    }, {
        isExpanded: false,
        name: "Sim-cards",
        subcategories: null
    }]
}, {
    isExpanded: false,
    name: "Entertainment",
    subcategories: [{
        isExpanded: false,
        name: "Gaming",
        subcategories: [{
            isExpanded: false,
            name: "Games",
            subcategories: null
        }]
    }, {
        isExpanded: false,
        name: "Sports",
        subcategories: null
    }]
}];

我的目标是遍历每个类别/子类别并根据我的逻辑设置“isExpandable”的值。有人可以建议我如何遍历对象的每个子类别，记住一个子类别并且还有一个子类别等等？

这是我目前的尝试......

function blah() {
  for (var i = 0; i < category.length; i++) {
    if (category[i].subcategories) {
      console.log(category[i]);
      traverseCategoryTree(category[i]);
    }
  }
}

function traverseCategoryTree(category) {
  //iterate each subcategory and update is Expanded. 
}

blah();

【问题讨论】：

使用递归函数

标签： javascript recursion iteration tree-traversal

【解决方案1】：

不要重新发明轮子。我们现在使用object-scan 进行大部分数据处理。一旦你把头绕在它周围，它就会很强大。以下是它对您的示例的工作方式：

// const objectScan = require('object-scan');

const modify = (data) => objectScan(['**[*]'], {
  rtn: 'count',
  filterFn: ({ value }) => {
    value.isExpandable = (
      Array.isArray(value.subcategories)
      && value.subcategories.length !== 0
    );
  }
})(data);

const category = [{ isExpanded: false, name: 'Electricals', subcategories: [{ isExpanded: false, name: 'Audio', subcategories: null }, { isExpanded: false, name: 'Photography', subcategories: null }] }, { isExpanded: false, name: 'Telecoms', subcategories: [{ isExpanded: false, name: 'Mobile', subcategories: null }, { isExpanded: false, name: 'Sim-cards', subcategories: null }] }, { isExpanded: false, name: 'Entertainment', subcategories: [{ isExpanded: false, name: 'Gaming', subcategories: [{ isExpanded: false, name: 'Games', subcategories: null }] }, { isExpanded: false, name: 'Sports', subcategories: null }] }];

console.log(modify(category)); // how many matched found
// => 10

console.log(category);
// => [ { isExpanded: false, name: 'Electricals', subcategories: [ { isExpanded: false, name: 'Audio', subcategories: null, isExpandable: false }, { isExpanded: false, name: 'Photography', subcategories: null, isExpandable: false } ], isExpandable: true }, { isExpanded: false, name: 'Telecoms', subcategories: [ { isExpanded: false, name: 'Mobile', subcategories: null, isExpandable: false }, { isExpanded: false, name: 'Sim-cards', subcategories: null, isExpandable: false } ], isExpandable: true }, { isExpanded: false, name: 'Entertainment', subcategories: [ { isExpanded: false, name: 'Gaming', subcategories: [ { isExpanded: false, name: 'Games', subcategories: null, isExpandable: false } ], isExpandable: true }, { isExpanded: false, name: 'Sports', subcategories: null, isExpandable: false } ], isExpandable: true } ]

.as-console-wrapper {max-height: 100% !important; top: 0}

&lt;script src="https://bundle.run/object-scan@13.8.0"&gt;&lt;/script&gt;

免责声明：我是object-scan的作者

【讨论】：

【解决方案2】：

function traverseCategoryTree(categories) {
  for (var i = 0, len = categories.length; i < len; i++) {
    console.log(categories[i]);
    if (categories[i].subcategories) {
      traverseCategoryTree(categories[i].subcategories);
    }
  }
}    

traverseCategoryTree(category);

【讨论】：