如何在JavaScript中遍历嵌套rules并检查值与空规则数组

问题描述 #

我有一个由react-query-builder生成的输入数组，结构如下：

const x = [
    {
        "id": "neha-1g5te3",
        "value": "",
    },
    {
        "rules": [
            {
                "rules": [
                    {
                        "id": "neha-1xer23",
                        "value": "",
                    },
                    {
                        "rules": [],
                        "combinator": "AND"
                    }
                ],
                "combinator": "AND"
            }
        ],
        "combinator": "AND"
    },
    {
        "rules": [],
        "combinator": "AND"
    }
]

需要对所有嵌套的rules执行以下检查，只要任一条件满足，就将flag设为false：

• 存在长度为0的rules数组
• 存在节点的value为空字符串

尝试过x?.rules?.every((e) => e.value !== '')，但无法处理多层嵌套结构；也写过递归函数，但只能提取外层rules，无法深入检查内部嵌套的rules：

function getValue(o, findKey) {
  const output = []
  
  for (const k in o) {
    if (k === findKey)
      output.push(o[findKey])
    else if (typeof o[k] === 'object')
      output.push(...getValue(o[k], findKey))
  }
  
  return output;
}
console.log(getValue(x, 'rules'))

// 输出: [ [ { rules: [Array], combinator: 'AND' } ], [] ]

解决方案 #

可以编写一个递归遍历函数，逐个检查每个节点的条件，一旦发现不符合要求的情况立即返回false，所有节点检查通过才返回true：

function validateRules(arr) {
  for (const item of arr) {
    // 检查当前节点的value是否为空字符串
    if (item.value === '') {
      return false;
    }
    // 处理嵌套的rules数组
    if (item.rules) {
      // 检查rules数组是否为空
      if (item.rules.length === 0) {
        return false;
      }
      // 递归验证嵌套的rules，只要有一层不通过就返回false
      if (!validateRules(item.rules)) {
        return false;
      }
    }
  }
  return true;
}

// 使用示例
const flag = validateRules(x);
console.log(flag); // 针对给定的x，输出false

逻辑说明 #

• 遍历输入数组的每个元素，优先检查value是否为空，为空则直接返回false
• 若元素包含rules数组：
  • 先判断数组长度是否为0，是则返回false
  • 递归调用函数验证嵌套的rules数组，递归结果为false时向上传递该结果
• 所有元素及嵌套节点均通过检查后，返回true

这样就能完整覆盖所有层级的嵌套rules，满足两个条件的检查需求。

内容的提问来源于stack exchange，提问作者Neha Chaudhary