js--数据结构--树

【经典回放】多种语言系列数据结构算法:树(C#、JavaScript、VB6版) 目 录 一、树的C#语言实现以及显示 二、树的JavaScript语言实现以及显示 三、树的VB6语言实现以及显示 一、树的C#语言实现以及显示 1树的存储结构设计 一旦一个工程选择了用C#来完成,那么肯定意味着这是一个真实的应用项目。在现实中的应用项目中,树的存储基本都是用双亲表示法。在我们的教材P142的图6.14里就显示了这样的存储,如图1。 2 树的存储结构设计 对这样的存储方式,则在C#中是用这样的类来完成的,就是: namespace Tree1 { cla... 阅读详情
1.树的构造函数
1.1 Node

属性:

data存储的值
parent指向节点的父节点
children指向许多孩子节点

Node构造函数:

function Node(data) {
    this.data = data;
    this.parent = null;
    this.children = [];
}
1.2Tree

属性和方法:

root:指向一棵树的根节点
deepTraversal(callback,node):遍历与DFS树的节点
widthTraversal(callback,node):遍历与BFS树的节点
contasins(data,traversal)搜索树中的节点
add(data,toData,traverse)将节点添加到一棵树
remove(child,parent)在一棵树中删除一个节点

Tree构造函数:

先创建一个新实例的Node,随后指派node作为树的根

function Tree (data) {
    var node = new Node(data);
    this._root = node;
}
1.3创建tree
var tree = new Tree('CEO');
tree._root;//{data:'CEO',parent:null,children:[]}
2.一个树的方法
2.1 traverseDF(callback)遍历与DFS树的节点
//深度遍历
Tree.prototype.deepTraversal =  function(callback,node){
    var nodes = [];
    if (node != null) {
        var stack = [];
        stack.push(node);
        while (stack.length != 0) {
            var item = stack.pop();
            callback(item);
            nodes.push(item);
            var children = item.children;
            for (var i = children.length - 1; i >= 0; i--)
                stack.push(children[i]);
        }
    }
    return nodes;
};

举例

var tree = new Tree('one');

tree._root.children.push(new Node('two'));
tree._root.children[0].parent = tree;

tree._root.children.push(new Node('three'));
tree._root.children[1].parent = tree;

tree._root.children.push(new Node('four'));
tree._root.children[2].parent = tree;

tree._root.children[0].children.push(new Node('five'));
tree._root.children[0].children[0].parent = tree._root.children[0];

tree._root.children[0].children.push(new Node('six'));
tree._root.children[0].children[1].parent = tree._root.children[0];

tree._root.children[2].children.push(newNode('seven'));
tree._root.children[2].children[0].parent = tree._root.children[2];
/*

creates this tree

 one
 ├── two
 │   ├── five
 │   └── six
 ├── three
 └── four
     └── seven

*/

tree.deepTraversal(function(node) {
    console.log(node.data)
},tree._root);

/*
logs the following strings to the console

'five'
'six'
'two'
'three'
'seven'
'four'
'one'

*/
2.2 traverseBF(callback)遍历与BFS树的节点
//广度搜索
Tree.prototype.wideTraversal = function(callback,node) {
    var nodes = [];
    if (node != null) {
        var queue = [];
        queue.unshift(node);
        while (queue.length != 0) {
            var item = queue.shift();
            callback(item);
            nodes.push(item);
            var children = item.children;
            for (var i = 0; i < children.length; i++)
                queue.push(children[i]);
        }
    }
    return nodes;
}
2.3 contains(data,traversal)搜索树中的节点
//接受两个参数 ︰ 搜索和遍历类型的数据。
Tree.prototype.contains = function(callback, traversal) {
    traversal.call(this, callback);
};

想象一下我们想要登录到控制台包含的数据具有奇数和遍历我们与 BFS 树中的每个节点的任何节点。这是我们要编写的代码 ︰

// tree is an example of a root node
tree.contains(function(node){
    if(node.data ===  'two') {
        console.log(node);
    }
}, tree.traverseBF);
2.4 add(child,parent)将节点添加到一棵树

第一个参数,data,用于创建新实例的Node。
第二个参数,toData,用来比较每一棵树中的节点。
第三个参数,traversal,是树遍历此方法中使用的类型。

Tree.prototype.add = function(data, toData, traversal) {
    var child = new Node(data),
        parent = null,
        callback = function(node) {
            if(node.data === toData) {
                parent = node;
            }
        };

    this.contains(callback, traversal);

    if(parent) {
        parent.children.push(child);
        child.parent = parent;
    } else {
        thrownewError('Cannot add node to a non-existent parent.');
    }
};

实例:

vartree = newTree('CEO');

tree.add( 'CEO''VP of Happiness', , tree.traverseBF);

/*

our tree

'CEO'
└── 'VP of Happiness'

*/

实例:

vartree = newTree('CEO');

tree.add( 'CEO''VP of Happiness', , tree.traverseBF);
tree.add( 'CEO''VP of Finance', , tree.traverseBF);
tree.add('VP of Sadness',  'CEO', tree.traverseBF);

tree.add( 'VP of Finance''Director of Puppies', , tree.traverseBF);
tree.add( 'Director of Puppies''Manager of Puppies', , tree.traverseBF);

/*

 tree

 'CEO'
 ├── 'VP of Happiness'
 ├── 'VP of Finance'
 │   ├── 'Director of Puppies'
 │   └── 'Manager of Puppies'
 └── 'VP of Sadness'

 */
2.5 remove(node,parent)在一棵树中删除一个节点
Tree.prototype.remove = function(data, fromData, traversal) {
    var tree = this,
        parent = null,
        childToRemove = null,
        index;

    var callback = function(node) {
        if(node.data === fromData) {
            parent = node;
        }
    };

    this.contains(callback, traversal);

    if(parent) {
        index = findIndex(parent.children, data);

        if(index === undefined) {
            thrownewError('Node to remove does not exist.');
        } else {
            childToRemove = parent.children.splice(index, 1);
        }
    } else {
        thrownewError('Parent does not exist.');
    }

    return childToRemove;
};
3.一棵树深度和广度的遍历
function Node(data) {
    this.data = data;
    this.parent = null;
    this.children = [];
}

function Tree(data) {
    var node = new Node(data);
    this._root = node;
}

//深度搜索
Tree.prototype.deepTraversal =  function(callback,node){
    var nodes = [];
    if (node != null) {
        var stack = [];
        stack.push(node);
        while (stack.length != 0) {
            var item = stack.pop();
            callback(item);
            nodes.push(item);
            var children = item.children;
            for (var i = children.length - 1; i >= 0; i--)
                stack.push(children[i]);
        }
    }
    return nodes;
};
//广度搜索
Tree.prototype.wideTraversal = function(callback,node) {
    var nodes = [];
    if (node != null) {
        var queue = [];
        queue.unshift(node);
        while (queue.length != 0) {
            var item = queue.shift();
            callback(item);
            nodes.push(item);
            var children = item.children;
            for (var i = 0; i < children.length; i++)
                queue.push(children[i]);
        }
    }
    return nodes;
}


var tree = new Tree('one');

tree._root.children.push(new Node('two'));
tree._root.children[0].parent = tree;

tree._root.children.push(new Node('three'));
tree._root.children[1].parent = tree;

tree._root.children.push(new Node('four'));
tree._root.children[2].parent = tree;

tree._root.children[0].children.push(new Node('five'));
tree._root.children[0].children[0].parent = tree._root.children[0];

tree._root.children[0].children.push(new Node('six'));
tree._root.children[0].children[1].parent = tree._root.children[0];

tree._root.children[2].children.push(new Node('seven'));
tree._root.children[2].children[0].parent = tree._root.chil

var arr = tree.deepTraversal(function(node) {
    console.log(node.data)
},tree._root);
console.log(arr);

var arr2 = tree.wideTraversal(function(node) {
    console.log(node.data)
},tree._root);
console.log(arr2);
JavaScript树数据结构实现与应用实战 树作为一种非线性数据结构,其核心构成单位是节点(Node)。在理解树结构的实现机制之前,我们首先需要明确节点的定义方式及其在程序中的表示方法。本章将围绕JavaScript语言,详细讲解树节点的基本构成、定义方式以及基础操作的实现逻辑,为后续章节中插入、删除、遍历等操作的展开提供坚实基础。除了使用类定义节点,我们也可以使用对象字面量方式来创建节点。这种方式适用于小型项目或快速原型开发。value: 20,value: 15,树的基本操作主要包括:插入(Insert) 阅读详情

相关推荐

ansys命令流力磁耦合仿真

文章目录前言一、力磁耦合仿真流程二、静力学仿真三、力磁耦合模型构建四、静磁学仿真总结 前言 一、力磁耦合仿真流程 力磁耦合有限元仿真流程中,首先进行静力学仿真,经过前处理模块、分析计算模块和后处理模块提取三维模型单元应力,然后根据力磁耦合方程中,通过matlab将单元应力导入到磁导率与应力的关系式中,得到单元的相对磁导率。最后采用载荷传递耦合方式,进行静磁学模拟仿真,分析计算得到该载荷下试件的磁场分布。,如下图所示为力磁耦合仿真流程图: 二、静力学仿真 下图为中心预制条形缺陷的Q235钢板试..

wsfwsf128的博客 2663

Js二叉树(数据结构)的前序遍历、中序遍历、后序遍历、移除节点

  树节点属性  Node    data:节点值    parent :指向节点的父节点    left:指向节点的左节点    right:指向节点的右节点 在移除节点的时候,要考虑到这几种情况: 1:移除忽地节点不存在 2:移除的是根节点 3:移除的不是根节点       3.1:这个节点比根节点大就要去根结点的右节点找              3.1.1节点的右节点存...

Drifterkiten的博客 2470

什么是Claude 的 Agent Skills?

摘要: Claude的Agent Skills功能支持通过结构化技能包(含指令、脚本、工具)实现任务自动化,如数据分析、文档生成等。核心能力包括:1)技能包管理(如Python脚本+模板);2)工具调用(API/数据库交互);3)子代理协作(拆分复杂任务)。快速上手步骤:创建技能包(如Excel报表生成)、配置工具权限、触发执行;支持多代理并行处理(如SQL查询+可视化)。关键技巧:工具需明确定义参数、利用子代理共享上下文、注重权限管控。官方文档与社区资源提供进阶指导,使Claude成为可编程的数字助手。

jobleap.cn求职助手首页 1730

JS tree树形结构父子操作

【代码】JS tree树形结构父子操作。

看陌生的风景的博客 706

CentOS7.9 安装 ImageMagick,图片转换为HEIC图像格式

由于ImageMagick7以下不支持heic等图片格式,所以重新安装了ImageMagick7.1版本支持heic格式,在网上找了很多资料,归纳总结并写此文章记录一下。在Linux(CentOS7.9)上安装ImageMagick7.1.1-38。

shmily_i的博客 1941

光学系统设计:波段、光源、光纤与探测器匹配指南

在光学测量和光纤通信系统中,波段、光源、光纤和探测器的匹配关系是系统设计的核心基础。波段指电磁波谱中的特定波长范围,光源负责产生特定波长的光信号,光纤作为传输介质需要与波长匹配以降低损耗,探测器则负责将光信号转换为电信号。理解各组件的光谱特性对于系统性能至关重要,例如在850nm短波长多模光纤系统中,VCSEL激光器与PIN光电二极管的组合能提供最佳性价比。典型应用场景包括生物医学成像、光纤通信和气体传感,其中光谱重叠优化、模场直径匹配和偏振特性协调是关键技术要点。通过实测数据对比不同组合的传输性能,可以为

weixin_33812433的博客 339

jsTree工作笔记001---jsTree的基本使用_js实现树形结构

技术交流QQ群【JAVA,C++,Python,.NET,BigData,AI】:170933152 判断用户有没有选中节点: var treeown = $('#tree_' + own).jstree(true);//获得整个树 if (treeown) { var selectednode = _getCurrNode(own); if (selectednode) ...

添柴程序猿的专栏 1217

多臂老虎机——入门强化学习

多臂老虎机(Multi-Armed Bandit,MAB)问题是强化学习的经典入门例子,也是理解探索与利用(exploration-exploitation)平衡的重要案例。

qq_56683019的博客 2460

jstree组件的使用详细教程,部分案例( PHP / fastAdmin )

jstree 插件的使用详细教程,加载树节点,右键菜单,添加编辑删除,。简介:JsTree是一个jquery的插件,它提交一个非常友好并且强大的交互性的树,并且是完全免费或开源的(MIT 许可)。Jstree技持Html 或 json格式的的数据, 或者是ajax方式的动态请求加载数据。

魍魉 1813

极简JEPA世界模型实战:低门槛复现LeWorldModel,CPU可跑

这次我们来看一个能让普通开发者真正上手跑起来的“世界模型”项目。如果你对Yann LeCun提出的JEPA(联合嵌入预测架构)框架感兴趣,但又苦于Meta官方实现过于庞大复杂,那么这个GitHub上4k star的项目就是为你准备的。它用极简的PyTorch代码(核心文件仅160-278行)完整复刻了包括LeWorldModel在内的五个JEPA核心变体,最大的亮点是: 门槛极低,普通笔记本甚至CPU就能跑,显存占用友好,非常适合学习和原理验证。 这个项目名为 keon/jepa ,完全开源。它剥离了工业级

weixin_29031161的博客 423

OSCP-Challenge 2 - Relia

使用andrea:PasswordPassword_6登录远程桌面,在c盘根目录下发现一个计划任务的ps,文件,修改执行的exe位木马,获取到milana用户的反弹shell。,发现开放了一个8000端口,但是我们外部是访问不到的,它对应的页面是/var/www/internal/,这个目录下的文件我们是可以访问的,把这个文件打个包放到本地分析下。其中数据的可以直接连接mssql,但是端口是49965,不过在数据库中没发现什么可用的信息,但是可以修改密码直接进后台,这个可以先放放。

羽的博客 7776

js(JavaScript)数据结构之树(Tree)

树(Tree)是一种常见的数据结构,由节点(Node)和边(Edge)组成。树的节点通过边连接,形成层次结构。树的一个节点可以有多个子节点,但只有一个父节点(除了根节点)。树的一个重要特点是没有环,即任意两个节点之间都有唯一的路径。

星辰迷上大海的博客 3574

LVGL嵌入式GUI工程化架构与多窗口实践

嵌入式GUI开发中,LVGL作为轻量级图形库,其核心价值在于高效渲染与事件驱动机制。理解LVGL的对象树模型、资源管理机制(如RAW图像、静态字体)和屏幕生命周期,是构建稳定界面的基础。结合FreeRTOS等实时操作系统,可实现低功耗、高响应的交互体验。典型应用场景包括智能电表、HMI人机界面、工业控制面板等对内存敏感、需长期运行的设备。本文以微信式多窗口架构为范例,深入解析LVGL工程化落地的关键路径:分层目录结构、窗口模块封装、状态机式登录逻辑、TabView多页导航及图表/仪表盘动态可视化,覆盖从资源

weixin_36001279的博客 91

JavaScript 数据结构(九): 树

JavaScript 数据结构系列目录 JavaScript 数据结构(一): 数组 JavaScript 数据结构(二): 栈 JavaScript 数据结构(三):队列 JavaScript 数据结构(四):双端队列 JavaScript 数据结构(五):链表 JavaScript 数据结构(六):集合 JavaScript 数据结构(七):字典 JavaScript 数据结构(八):散列表 文章目录JavaScript 数据结构系列目录一、树的概述 一、树的概述 树是一种由 n (n &gt

Amecai的学习博客 610

visio安装包

Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。

NTscan扫描工具

ntscan是一个扫描器,可以扫描没有密码和弱密码的共享,先到配置文件中填写猜测的用户名和密码,扫描过程中右侧出现的是扫描日志。

学习javascript数据结构(四)——树

前言总括: 本文讲解了数据结构中的[树]的概念,尽可能通俗易懂的解释树这种数据结构的概念,使用javascript实现了树,如有纰漏,欢迎批评指正。 原文博客地址:学习javascript数据结构(四)——树 知乎专栏&&简书专题:前端进击者(知乎)&&前端进击者(简书) 博主博客地址:Damonare的个人博客 人之所能,不能兼备,弃其所短,取其所长。正文树简介在上一篇学习javascript数据

前端小渣 892

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

JavaScript 中实现常见数据结构:栈、队列与树

理解并掌握这些基础数据结构就像是拥有了强大的工具箱,使我们在前端编程世界中游刃有余。让我们一起成长,就如同栈中的元素不断积累,如同队列中的任务逐个完成,如同树般枝繁叶茂,向着技术的高峰攀登!while (!"));// 输出:"developers!愿每位开发者都能在学习过程中收获满满的快乐!

球球不吃虾WHR2349博客 958

Data-Structures-and-Algorithm-Analysis-in-Java.pdf

作者: Weiss, Mark A. 出版社: Addison Wesley Data Structures and Algorithm Analysis in Java is an “advanced algorithms” book that fits between traditional CS2 and Algorithms Analysis courses. In the old ACM Curriculum Guidelines, this course was known as CS7. This text is for readers who want to learn good programming and algorithm analysis skills simultaneously so that they can develop such programs with the maximum amo...

JavaScript版数据结构与算法(一)栈、队列、链表、集合、树

为什么要学习数据结构与算法?最重要的就是面试要考算法,另外就是如果在实际工作当中,能够使用算法优化代码,会提升代码质量和运行效率,作为一名前端人员可能在实际中用的并不是特别多。数据结构与算法是分不开的,数据结构是,算法是,程序就是。算法刷题大家都知道,就是力扣。刷题顺序推荐按类型刷题,比如栈相关的题,一次刷好几道,巩固巩固。刷题过程中需要重点关注的是。其实这跟高中初中做数学题很像,有通用的套路可循,但是需要多复习,多看错题,做题的时候尽量把这道题考察的知识点都总结出来。

weixin_45855469的博客 1413

js实现数据结构--树

什么是树? 树是一种分层数据的抽象模型。现实生活中最常见的树的例子就是家谱,或是公司的组织架构。 树的结构图:如下图 树的相关术语: 一棵树包含一系列存在父子关系的节点。每个节点都有一个父节点(除了顶部的第一个节点)以及零个或多个子节点.下面介绍几个常见的树的术语。 根节点:位于树顶部的节点,它没有父节点 内部节点:至少有一个子节点的节点 外部节点:没有子节点的节点,也称为叶节点...

阳光下的冷静的博客 1279

JavaScript数据结构之树

JavaScript数据结构之树 树的相关术语 一个树结构包含一系列存在父子关系的节点。每个节点都有一个父节点(除了顶部的第一个节点)以及零个或多个子节点: 位于树顶部的节点叫作根节点(11)。它没有父节点。树中的每个元素都叫作节点,节点分为内部节点和外部节点。至少有一个子节点的节点称为内部节点(7、5、9、15、13和20是内部节点)。没有子元素的节点称为外部节点或叶节点(3、6、8、10、1...

low666的博客 428

JavaScript数据结构——树

JavaScript中的树 在使用数组存储时,根据下标值访问效率会很高,但是当想要使用元素来查找时,比较好的方法是对数组先排序,之后二分查找。 由此所带来的问题是查找时需要大量的操作,效率就比较低了 而链表对于插入与删除的操作效率虽然很高,但是查找效率依然很低,需要从头至尾访问一遍链表,直到找到。 而对于哈希表,一方面空间利用率不高,而且哈希表中的元素是无序的,不能按照固定的顺序来遍历哈希表中的元素 相比上面的结构,树结构的优点则更突出 树的定义: 树(Tree): n(n≥0)个结点构成的有限集合

403 Forbidden 583

JavaScript数据结构:树

本文译自Cho S. Kim的文章:Data Structures With JavaScript: Tree “树”,是web开发中最常用的数据结构之一。这句话对开发者和用户来讲,都适用:开发人员通过HTML创造了一个DOM,用户则通过DOM消费网络信息。 进一步讲,您正在阅读的本文也是以树的形式在浏览器中渲染的。文章中的段落由&...

weixin_33709364的博客 143

JavaScript 数据结构——树

概念 树是一种分层数据的抽象模型。 树的常用操作: 深度优先遍历 广度优先遍历 实现 JavaScript中没有树,但是可用Object和Array来构建树。 深度优先遍历 尽可能深地搜索树的分支。 步骤: 访问根节点 对根节点的子节点依次进行深度优先遍历 如上图所示,深度优先遍历这棵树,访问顺序为A - B - D - E -C - F - G。 JavaScript实现: const tree = { val: 'A', children: [{ val: 'B

火星基地 517

JavaScript数据结构——树的实现

  在计算机科学中,树是一种十分重要的数据结构。树被描述为一种分层数据抽象模型,常用来描述数据间的层级关系和组织结构。树也是一种非顺序的数据结构。下图展示了树的定义:   在介绍如何用JavaScript实现树之前,我们先介绍一些和树相关的术语。   如上图所示,一棵完整的树包含一个位于树顶部的节点,称之为根节点(11),它没有父节点。树中的每一个元素都叫做一个节点,节点分为内部...

ddjq1044的博客 273

高级数据结构探索:树、图、哈希表的JavaScript实现

高级数据结构探索:树、图、哈希表的JavaScript实现 本文深入探讨了JavaScript中三种核心高级数据结构的实现原理、性能特征和实际应用。首先详细分析了二叉树与平衡树结构,包括基础二叉树实现、二叉搜索树(BST)以及自平衡的AVL树,通过四种旋转操作维持树的平衡。接着阐述了图数据结构的基本概念与实现方式,重点讲解了广度优先搜索(BFS)和深度优先搜索(DFS)两种遍历算法及其应用场景。最...

gitblog_00645的博客 791
上一篇: 布局神器---flexbox
下一篇: html5
github_34514750
博客等级 码龄11年 44粉丝 198原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值