时间戳

首页 > 解决方案 > 在数组中查找元素并返回父元素

javascript - 在数组中查找元素并返回父元素

问题描述

我在尝试获取数组中找到的元素的父元素时遇到问题。

这是我的数组，例如：

const arr = [
  {
    name: 'first level',
    selected: true,
    subItems: [
      {
        name: 'second level 1',
        selected: false,
        subItems: [],
      },
      {
        name: 'second level 2',
        selected: true,
        subItems: [
          {
            name: 'third level 1',
            selected: false,
            subItems: [],
          },
          {
            name: 'third level 2',
            selected: false,
            subItems: [],
          },
          {
            name: 'third level 3',
            selected: false,
            subItems: [],
          }
        ]
      },
      {
        name: 'second level 3',
        selected: false,
        subItems: [
          {
            name: 'third level 4',
            selected: false,
            subItems: []
          }
        ]
      }
    ]
  }
];

所以基本上如果选择的键是真的，我想返回它的父元素。现在我不知道这个数组有多深，所以我对这个问题采取了递归的方法。

const getParent = (items, parentCat = null) => {
    if (items && items.length > 0) {
        const selectedCat = items.find(item => item.selected === true);
        if (selectedCat && selectedCat.subItems.length > 0) {
          return getParent(selectedCat.subItems, selectedCat);
        }
        return parentCat;
    }
};

const parent = getParent(arr);

但是该代码仅在选定项目没有子项的某些情况下才有效。我想获得最深选定元素的父项。

编辑：如果任何元素选择了 true，它的父元素也将具有 true，每个级别也总是只有一个选定的元素。

标签： javascriptarrayssorting

解决方案

问题是在递归中，如果没有选择任何项，则必须返回父项的父项。您可以通过null在最深的递归中返回来实现这一点，并让调用者在堆栈展开时处理它。

const getParent = (items, parent = null) => {
    const selectedItem = items.find(item => item.selected === true);
    if (selectedItem) {
        // if there was a deeper parent, return that
        // otherwise return my own parent
        return getParent(selectedItem.subItems, selectedItem) || parent;
    } else {
        return null;
    }
};


const arr = [
  {
    name: 'first level',
    selected: true,
    subItems: [
      {
        name: 'second level 1',
        selected: false,
        subItems: [],
      },
      {
        name: 'second level 2',
        selected: true,
        subItems: [
          {
            name: 'third level 1',
            selected: false,
            subItems: [],
          },
          {
            name: 'third level 2',
            selected: false,
            subItems: [],
          },
          {
            name: 'third level 3',
            selected: false,
            subItems: [],
          }
        ]
      },
      {
        name: 'second level 3',
        selected: false,
        subItems: [
          {
            name: 'third level 4',
            selected: false,
            subItems: []
          }
        ]
      }
    ]
  }
];

const getParent = (items, parent = null) => {
    const selectedItem = items.find(item => item.selected === true);
    if (selectedItem) {
        return getParent(selectedItem.subItems, selectedItem) || parent;
    } else {
        return null;
    }
};

console.log(getParent(arr));

推荐阅读