具有层次结构的深度搜索对象列表

Question

我有这样的对象数组：

let items: MenuPath[] = [
            { title: "Archive", path: 'archive' },
            { title: "About", path: 'about' },
            { title: "Programs", path: 'programs', children: [{ title: 'Line with...', path: 'program-line' }] },
            {
                title: "Blog",
                path: 'blog',
                children: [
                    {
                        title: "Cars",
                        path: 'cars',
                        children: [
                            { title: 'Something about cars', path: 'smt-cars' },
                            {
                                title: 'Cars library',
                                path: 'cars-library',
                                children:  [
                                            { title: 'Line of horizon', path: 'line-horizon', children: [{ title: 'Something', path: 'smt-last' }] },
                                            { title: 'Lineup', path: 'lineup' },
                                        ]
                            }
                        ]
                    }
                ]
            }
        ];

我需要一个函数来查找标题包含“line”且具有完整层次结构的所有对象

function searchAll(items, title){
 // ...
}

let result = [
   [ {title: "Programs", path: "programs"}, {title: "Line with...", path: 'program-line'} ], // path: /programs/program-line
   [ {title: "Blog", path: "blog"}, { title: "Cars", path: "cars" }, {title:"Cars library", path: "cars-library"}, {title: 'Line of horizon', path: 'line-horizon'} ], // path: /blog/cars/cars-library/line-horizon
   [ {title: "Blog", path: "blog"}, { title: "Cars", path: "cars" }, {title:"Cars library", path: "cars-library"}, {title: 'Lineup', path: 'lineup'} ], // path: /blog/cars/cars-library/lineup
];

这怎么办？

Answer 1

您可以在此处使用递归和堆栈来跟踪层次结构。

我还使用正则表达式进行搜索，因为这非常适合进行搜索，例如。只需将

/i

放在末尾即可进行不区分大小写的搜索。

ps：我在这里使用 StructuredClone 只是为了让代码片段控制台看起来更好，否则它会为重复项创建#refrences。

const items = [
    { title: "Archive", path: 'archive' },
    { title: "About", path: 'about' },
    { title: "Programs", path: 'programs', children: [{ title: 'Line with...', path: 'program-line' }] },
    {
        title: "Blog",
        path: 'blog',
        children: [
            {
                title: "Cars",
                path: 'cars',
                children: [
                    { title: 'Something about cars', path: 'smt-cars' },
                    {
                        title: 'Cars library',
                        path: 'cars-library',
                        children: [
                            { title: 'Line of horizon', path: 'line-horizon', children: [{ title: 'Something', path: 'smt-last' }] },
                            { title: 'Lineup', path: 'lineup' },
                        ]
                    }
                ]
            }
        ]
    }
];

function searchAll(items, search){
    const stack = [];
    const results = [];
    function inner(items) {
        for (const i of items) {
            const {title, path} = i;
            stack.push({title,path})
            if (search.test(i.title)) results.push([structuredClone(stack)]);
            if (i.children) inner(i.children);
            stack.pop();
        }
    }
    inner(items);
    return results;
}
   
console.log(searchAll(items, /line/i))

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