js数据库多级分类按树形结构打印

可以使用 JavaScript 来按层级打印 categories 数组。首先,需要将这个数组转换成一个树形结构,然后再进行递归或者迭代来打印每个层级的内容。

以下是一个示例代码,用来实现这个功能:

const categories = [
    { id: 2, name: "手机", parent: 1 },
    { id: 6, name: "电脑", parent: 1 },
    { id: 3, name: "苹果", parent: 2 },
    { id: 4, name: "小米", parent: 2 },
    { id: 5, name: "华为", parent: 2 },
    { id: 7, name: "笔记本", parent: 6 },
    { id: 8, name: "台式机", parent: 6 },
    { id: 11, name: "衬衫", parent: 10 },
    { id: 12, name: "裤子", parent: 10 },

    { id: 1, name: "电子产品", parent: 0 },
    { id: 9, name: "服装", parent: 0 },
    { id: 13, name: "女装", parent: 9 },
    { id: 10, name: "男装", parent: 9 },
    { id: 14, name: "裙子", parent: 13 },
    { id: 15, name: "上衣", parent: 13 },
    { id: 16, name: "萝莉", parent: 13 },
    { id: 17, name: "御姐", parent: 13 },
];

// 将数组转换为树形结构
function buildTree(categories, parent = 0) {
    let node = {};
    categories
        .filter(item => item.parent === parent)
        .forEach(item => {
            node[item.id] = {
                id: item.id,
                name: item.name,
                children: buildTree(categories, item.id)
            };
        });
    return node;
}

// 递归打印树形结构
function printTree(tree, level = 0) {
    Object.values(tree).forEach(node => {
        console.log("  ".repeat(level) + node.name);
        if (node.children) {
            printTree(node.children, level + 1);
        }
    });
}

// 构建树
const tree = buildTree(categories);

// 打印树形结构
printTree(tree);

这段代码首先定义了 buildTree 函数,它会根据 categories 数组构建一个树形结构。然后定义了 printTree 函数来递归打印这个树形结构,每一层使用两个空格缩进来表示层级关系。

你可以将这段代码复制粘贴到你的 JavaScript 环境中执行,就可以看到按层级打印出的结果了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/775163.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Java项目:基于SSM框架实现的中小企业人力资源管理系统【ssm+B/S架构+源码+数据库+开题报告+毕业论文】

一、项目简介 本项目是一套基于SSM框架实现的中小企业人力资源管理系统 包含:项目源码、数据库脚本等,该项目附带全部源码可作为毕设使用。 项目都经过严格调试,eclipse或者idea 确保可以运行! 该系统功能完善、界面美观、操作简…

matlab 绘制高等数学中的二维函数示例

matlab 绘制高等数学中的二维函数示例 绘制高等数学中的二维函数示例绘制结果 绘制高等数学中的二维函数示例 clc,clear,close all; % 定义方程 eqn (x, y) (x.^2 y.^2).^3 - y.^4;% 绘制方程曲线和坐标轴 ezplot(eqn, [-2, 2, -2, 2]) hold on % 在同一图形中保持绘图% 绘…

国际上备考所有云计算/IT证书的五大优质免费课程网站

最近越来越多的小伙伴来问小李哥,小李哥亚马逊云科技AWS认证大满贯是在哪里上课复习的呢?全部上付费课程那不是一笔巨款吗?小李哥这次来盘点备考国际上IT证书的5大优质免费课程网站(不只是亚马逊云科技AWS的课程,其他课程同样可以…

满足GMSL静电防护要求的方案

什么是GMSL?它是做什么用的?它有什么优点?设计GMSL防静电有啥难度? 带着这些疑问我们先了解下什么是GMSL。 一.简述 GMSL GMSL(Gigabit Multimedia Serial Link)即千兆多媒体串行链路&#xf…

odoo 物联网 设备数据采集方案

图一 架构手稿(许老师专属) 图二 架构简图 部署 方案一: odoo业务数据库与设备采集数据库使用一个instance。 缺点:重启pg服务相互影响。 方案二: odoo业务数据库与设备采集数据库独立部署,使用两个instance。 优点:…

一个使用率超高的大数据实验室是如何练成的?

厦门大学嘉庚学院“大数据应用实训中心”(以下简称“实训中心”)自2022年建成以来,已经成为支撑“大数据专业”复合型人才培养的重要支撑,目前实训中心在专业课程实验教学、项目实训、数据分析类双创比赛、毕业设计等方面都有深入…

CVPR2024自动驾驶轨迹预测方向的论文整理

2024年自动驾驶轨迹预测方向的论文汇总 1、Producing and Leveraging Online Map Uncertainty in Trajectory Prediction 论文地址:https://arxiv.org/pdf/2403.16439 提出针对在线地图不确定性带给轨迹预测的影响对应的解决方案。 在轨迹预测中,利用在…

vscode连接SSH——连接学校服务器,使用conda配置个人环境并使用

服务器的连接 在vscode远程资源管理中配置配置文件,如下图: 然后点击左下角进行连接: 点击需要连接的服务器,输入对应密码即可登录成功。 服务器上创建自己的环境 确保服务器上已安装anaconda。 先查看服务器上的conda信息&…

Linux_共享内存通信

目录 1、共享内存原理 2、申请共享内存 2.1 ftok 2.2 测试shmget、ftok 2.3 查看系统下的共享内存 3、关联共享内存 3.1 测试shmat 4、释放共享内存 4.1 测试shmctl 5、实现共享内存通信 6、共享内存的特性 结语 前言: 在Linux下,有一…

jenkins在使用pipeline时,为何没有方块形视图

项目场景: 安装完Jenkins时后,通过pipeline创建的项目任务。 问题描述 在立即构建后,没有显示每个阶段的视图。 原因分析: 原因是,刚安装的Jenkins,这个视图不是Jenkins自带的功能,而必须安装…

Cannot resolve symbol ‘log`

idea里的代码log变红色,是因为缺少Lombok插件。 安装lombok插件即可。安装完应用,重启软件就好了。 依次点击菜单栏中的 File → Settings(Windows/Linux) 或 IntelliJ IDEA → Preferences(macOS)。在设置…

设计模式探索:单例模式

1. 什么是单例模式? 定义: 单例模式是一种创建型设计模式,它确保一个类只有一个实例,并提供一种全局访问点以访问该实例。常见的场景包括身份证号码、政府等需要唯一实例的情况。 单例模式通常用于那些需要在应用程序中仅存在一个实例的情况,例如配置管理器、线程池、数据…

ret2syscall简单总结

主要是自己的简单的学习总结。 知识点 关于系统调用如何传递参数问题,即系统调用约定(syscall,int 80h,svc)_int 80h intel汇编用法-CSDN博客 ret2syscall的做题思路(以32位程序为例) - ZikH…

2024年【山东省安全员A证】考试试卷及山东省安全员A证考试试题

题库来源:安全生产模拟考试一点通公众号小程序 山东省安全员A证考试试卷根据新山东省安全员A证考试大纲要求,安全生产模拟考试一点通将山东省安全员A证模拟考试试题进行汇编,组成一套山东省安全员A证全真模拟考试试题,学员可通过…

react 项目中预防xss攻击的插件 dompurify

一、安装 $ yarn add dompurify $ yarn add --dev types/dompurify 二、使用 import DOMPurify from dompurify;// 1、处理: DOMPurify.sanitize(htmlContent)// 2、之后放进 dangerouslySetInnerHTML dangerouslySetInnerHTML{{ __html: cleanHTML }} 如&#…

Django自动生成Swagger接口文档 —— Python

1. 前言 当接口开发完成,紧接着需要编写接口文档。传统的接口文档通常都是使用Word或者一些接口文档管理平台进行编写,但此类接口文档维护更新比较麻烦,每次接口有变更,需要手动修改接口文档。在实际的工作中,经常会遇…

Docker:三、安装nginx与tomcat

🍁安装常见服务 🌲安装nginx 🧊1、搜索镜像 Ⅰ.hub docker上查询:https://hub.docker.com/_/nginx Ⅱ. 命令查询:docker search nginx 🧊2、下载镜像 命令:docker pull nginx &#x1f9c…

mmfewshot 框架概述、环境搭建与测试(一)

一、mmfewshot 框架概述 少样本学习的基本流程: 我们将为所有小样本学习任务引入一个简单的基线,以进一步说明小样本学习的工作原理。最明显的流程是微调。它通常包括两个步骤:在大规模数据集上训练模型,然后在小样本数据上进行微…

Matlab进阶绘图第62期—滑珠气泡图

在之前的文章中分享了滑珠散点图的绘制方法: 在此基础上,添加尺寸参数,通过散点的大小表示一个额外的特征,便是滑珠气泡图。 由于Matlab中没有现成的函数绘制滑珠气泡图,因此需要大家自行解决。 本文利用自己制作的B…