怎么利用 js 在树上交互

[hd7771]

比如我有一棵树，树上有些节点是让用户决定的变量。 如果没有限制就是一路 dfs 执行到底。 但是有时候根据用户决定的值一些子树不能进去。 最蛋疼的来了，用户点一下鼠标，往下执行一下，由于是前端，要考虑交互，鼠标点击是与函数绑定的，处理一句就要跳出函数，然后递归往前进一步还是什么。总是感觉好蛋疼。

[hd7771]

@zwhu 而且它也是用一个叫做 webGL 的东西弄得，我不明白原理还是调用它的 api 比较好吧。

[mjhlybmwq]

返回一个函数就可以了

[hd7771]

@zwhu 其实这种翻译成 html 再用 js 去控制好很多，，，就是不知道不调用图形库就靠 css 能不能做出游戏的效果。。

[zwhu]

@hd7771 - -。我说的 dom 树，是一种数据结构，不是真实的渲染出来的节点。

因为我没学过数据结构这门课，不懂怎么表达。其实按照你的需求...回溯而已，给子节点上加上一个反向的父节点再加一个 nextsiblings 就完了。 start 的时候就是从 root 节点找第一个子节点，每次经过的时候标记当前节点
1. 子节点都判断自己是不是叶子节点，如果是，就找 nextsiblings ，再回到 1
2. 如果不是，就找子节点，如子节点已经被标记了就找 nextsiblings
3. nextsiblings 被找完了，就找上层父节点的 nextsiblings ， 再回到 1 开始

直到找完

[zwhu]

同样暂停再开始就是重复上面的步骤而已

[hd7771]

@mjhlybmwq 您的意思是监听用的函数返回搜索的函数？

[zwhu]

简化的数据结构就是

node : {
parent: node,
nextsiblings: node,
children: [node.......],
marked: true
}

[fds]

要跳出函数并且保持运行状态自然是用 generator 和 yield 咯，用户点一下再继续回到函数里运行就好，不用自己记状态，方便得很

[mjhlybmwq]

@hd7771 对啊对啊 但是如果环境支持 generator 的话 generator 是不错的选择

[arzusyume]

把 .next() 写成 await .next()不就好了...

[hd7771]

@chengluyu
@mjhlybmwq
@fds
@arzusyume
感谢大佬们，这东西用起来爽到不能自己。