递归模糊查询所有字段树形数据
效果:
代码
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> var arr = [ { "name": "语法", "state": "", "family": [ { "name": "var patt=new RegExp(pattern,modifiers);或者var patt=/pattern/modifiers;", "state": "pattern(模式)描述了表达式的模式;modifiers(修饰符) 用于指定全局匹配、区分大小写的匹配和多行匹配 " } ] }, { "name": "RegExp 对象方法", "state": "", "family": [ { "name": "compile", "state": "在 1.5 版本中已废弃。 编译正则表达式。" }, { "name": "exec", "state": "索字符串中指定的值。返回找到的值,并确定其位置。" }, { "name": "test", "state": "执检索字符串中指定的值。返回 true 或 false。" }, { "name": "toString", "state": "返回正则表达式的字符串。" } ] }, { "name": "支持正则表达式的 String 对象的方法", "state": "", "family": [ { "name": "search", "state": "检索与正则表达式相匹配的值。" }, { "name": "match", "state": "找到一个或多个正则表达式的匹配。" }, { "name": "replace", "state": "替换与正则表达式匹配的子串。" }, { "name": "split", "state": "把字符串分割为字符串数组。" } ] }, { "name": "RegExp 对象属性", "state": "", "family": [ { "name": "constructor", "state": "返回一个函数,该函数是一个创建 RegExp 对象的原型。" }, { "name": "global", "state": "判断是否设置了 'g' 修饰符" }, { "name": "ignoreCase", "state": "判断是否设置了 'i' 修饰符。" }, { "name": "lastIndex", "state": "用于规定下次匹配的起始位置" }, { "name": "multiline", "state": "判断是否设置了 'm' 修饰符" }, { "name": "source", "state": "返回正则表达式的匹配模式" } ] }, { "name": "修饰符", "state": "修饰符用于执行区分大小写和全局匹配", "family": [ { "name": "i", "state": "执行对大小写不敏感的匹配。" }, { "name": "g", "state": "执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。" }, { "name": "m", "state": "执行多行匹配。" } ] }, { "name": "方括号", "state": "方括号用于查找某个范围内的字符", "family": [ { "name": "[abc]", "state": "查找方括号之间的任何字符。" }, { "name": "[^abc]", "state": "查找任何不在方括号之间的字符。" }, { "name": "[0-9]", "state": "查找任何从 0 至 9 的数字。" }, { "name": "[a-z]", "state": "查找任何从小写 a 到小写 z 的字符。" }, { "name": "[A-Z]", "state": "查找任何从大写 A 到大写 Z 的字符。" }, { "name": "[A-z]", "state": "查找任何从大写 A 到小写 z 的字符。" }, { "name": "[adgk]", "state": "查找给定集合内的任何字符。" }, { "name": "[^adgk]", "state": "查找给定集合外的任何字符。" }, { "name": "(red|blue|green)", "state": "查找任何指定的选项。" } ] }, { "name": "元字符", "state": "元字符是拥有特殊含义的字符", "family": [ { "name": ".", "state": "查找单个字符,除了换行和行结束符。" }, { "name": "\\w", "state": "查找数字、字母及下划线。" }, { "name": "\\W", "state": "查找非单词字符。" }, { "name": "\\d", "state": "查找数字。" }, { "name": "\\D", "state": "查找非数字字符。" }, { "name": "\\s", "state": "查找空白字符。" }, { "name": "\\S", "state": "查找非空白字符。" }, { "name": "\\b", "state": "匹配单词边界。" }, { "name": "\\B", "state": "匹配非单词边界。" }, { "name": "\\0", "state": "查找 NULL 字符。" }, { "name": "\\n", "state": "查找换行符。" }, { "name": "\\f", "state": "查找换页符。" }, { "name": "\\r", "state": "查找制表符." }, { "name": "\\v", "state": "查找垂直制表符。" }, { "name": "\\xxx", "state": "查找以八进制数 xxx 规定的字符。" }, { "name": "\\xdd", "state": "查找以十六进制数 dd 规定的字符。" }, { "name": "\\uxxxx", "state": "查找以十六进制数 xxxx 规定的 Unicode 字符。" } ] }, { "name": "量词", "state": "", "family": [ { "name": "n+", "state": "匹配任何包含至少一个 n 的字符串。例如,/a+/ 匹配 'candy'中的 'a','caaaaaaandy'中所有的 'a'。" }, { "name": "n*", "state": "匹配任何包含零个或多个 n 的字符串。例如,/bo*/ 匹配 'A ghost booooed' 中的 'boooo','A bird warbled' 中的 'b',但是不匹配 'A goat grunted'。" }, { "name": "n?", "state": "匹配任何包含零个或一个 n 的字符串。例如,/e?le?/ 匹配 'angel' 中的 'el','angle' 中的 'le'。" }, { "name": "n{X}", "state": "X 是一个正整数。前面的模式 n 连续出现至少 X 次时匹配。例如,/a{2,}/ 不匹配 'candy' 中的 'a',但是匹配 'caandy' 和 'caaaaaaandy.' 中所有的 'a'。" }, { "name": "n{X,Y}", "state": "X 和 Y 为正整数。前面的模式 n 连续出现至少 X 次,至多 Y 次时匹配。例如,/a{1,3}/ 不匹配 'cndy',匹配 'candy,' 中的 'a','caandy,' 中的两个 'a',匹配 'caaaaaaandy' 中的前面三个 'a'。注意,当匹配 'caaaaaaandy' 时,即使原始字符串拥有更多的 'a',匹配项也是 'aaa'。" }, { "name": "n$", "state": "匹配任何结尾为 n 的字符串。" }, { "name": "^n", "state": "匹配任何开头为 n 的字符串。" }, { "name": "?=n", "state": "匹配任何其后紧接指定字符串 n 的字符串。" }, { "name": "?!n", "state": "匹配任何其后没有紧接指定字符串 n 的字符串。", "family": [ { "name": "i", "state": "执行对大小写不敏感的匹配。" }, { "name": "g", "state": "执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。" }, { "name": "m", "state": "执行多行匹配。" } ] } ] }]// console.log(arr)// 递归模糊查询/** * @description: 模糊查询所有字段 * @param {[object]} list 需要处理的对象数组 * @param {string} zd 查询参数 */function cx(value,list){ let newarr = []; // 1.检测数组是否存在是否为空 if( list && list.length){ // 直接遍历 list.filter(v =>{ if(v.family && v.family.length){ let ab = cx(value,v.family); // 递归查询 if(ab && ab.length){ newarr.push({...v}); } }else{ // 全部拆封为一维数组 let a = Object.values(Object.fromEntries(Object.entries(v).filter(item => true))) // 循环判断数组与判断查询值是否匹配 a.some((item) => { // 存在添加到新的数据组 if (item.includes(value)) { newarr.push(v); } }); } }) } return newarr;} console.log(cx('exec',arr)) </script></body></html>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 使用C#创建一个MCP客户端
· ollama系列1:轻松3步本地部署deepseek,普通电脑可用
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 按钮权限的设计及实现