引言：树是数据结构中必须学习的一个概念。树在操作中有哪些应用？本文从实际业务出发，在简单阐述树的定义后，对需求解析，最终抽象出满足业务的树结构。

表达式树介绍

我们来看看维基百科对于表达式树的定义：

A binary expression tree is a specific kind of a binary tree used to represent expressions. Two common types of expressions that a binary expression tree can represent are algebraic $1$ and boolean. These trees can represent expressions that contain both unary and binary operators. $1$ Like any binary tree, each node of a binary expression tree has zero, one, or two children. This restricted structure simplifies the processing of expression trees.

翻译一下：表达树是一种特殊的二叉树，它用来表示表达式，可以用来表示代数和布尔计算。表达树可以表示二元或多元操作。我们来看个图吧：

这是一个表达式的表达式树，中序遍历这个树可以得到表达式： ((5 + z)/-8) * 4^2

需求描述

在做查询的时候，经常会用到一些筛选条件之间的交并差结构。但是新的问题是，这个交并差的集合最后要转成sql。合理定义这个结构，才能通过函数来实现这个转化sql 的过程。我们先来看看这个筛选条件长什么样子：

先来描述下这个结构：组与组之间可以是交集、并集，组间的交并是一致的，点击任意切换即可切换。组内的交并是隔离的，组1的交并切换不会影响组2.

最后一个组是差集，排除以下标签。

需求抽象

我们首先明确的是，这个标签组合是一个嵌套结构，组间有交并，组内有交并。下面通过图片来抽象这个结构。

1、抽象组内关系

从图中我们可以知道，组内的交并关系可以通过节点来表示，每个标签都是一个叶子。

2、抽象组间关系

那么组与组之间的交并关系如下图所示。

3、抽象差集

排除的标签，标签之间是并集。

4、组合

把所有的标签交并差组合起来，交并集和差集之间的关系是并集关系。

我们就把标签组合的整体转化成了上图的树的样子。

代码实现

抽象成了表达式树，我们就要考虑，如何把上述树的样子转化为代码了。通过询问chatgpt 我们最常见的定义一棵树的结构是：

javascript 复制代码

class TreeNode { 
  value: any; 
  children: TreeNode[]; 
}

这里，为了操作和理解方便，我们将节点的值拆成两个，type和value，

type 表示节点的类型，value 表示节点的值。 type 可能的取值为 inter、union、diff、label；分别对应的 value 为 and、or、not、LabelNode 这里不展开说明 LabelNode 的内容。所以，我们可以用 ts 的 interface 得到如下接口：

typescript 复制代码

interface ExpressionNode {
    // 节点类型
    type: 'inter'| 'union' | 'diff' | 'label'
    // 节点的值
    value: 'and' | 'or' | 'not' | LabelNode,
    // 子节点，可选
    children?: ExpressionNode[]
}

总结

这样，我们就从实际的业务需求中抽象出了底层所使用的数据结构。接下来下一篇，我们来说说，基于此结构所涉及到的树的一些操作。

树在前端的应用 | 表达式树