正则表达式

分组匹配

捕获性分组匹配

被正则表达式捕获(匹配)到的字符串会被暂存起来，其中，由分组捕获到的字符串会从1开始编号，于是我们可以引用这些字符串

var reg = /(\d{4})-(\d{2})-(\d{2})/;
var dateStr = '2018-04-18';
reg.test(dateStr);  //true
RegExp.$1   //2018
RegExp.$2   //04
RegExp.$3   //18

结合replace方法做字符串自定义替换String.prototype.replace方法的传参中可以直接引用被捕获的串，比如我们想开发中常见的日期格式替换,例如后台给你返回了一个2018/04/18,让你用正则替换为2018-04-18，就可以利用分组。

var dateStr = '2018/04/18';
var reg = /(\d{4})\/(\d{2})\/(\d{2})/;  // 需要注意的是/是需要用\转义的
dateStr = dateStr.replace(reg, '$1-$2-$3') //"2018-04-18"

非捕获性分组匹配

有的时候只是为了分组并不需要捕获的情况下就可以使用非捕获型分组(?:) ，例如

var reg = /(?:\d{4})-(\d{2})-(\d{2})/
var date = '2012-12-21'
reg.test(date)
RegExp.$1 // 12
RegExp.$2 // 21

前瞻匹配

正向前瞻匹配

注意：前瞻分组匹配(?=表达式) 后面一定要匹配有什么，会作为匹配内容，不会作为匹配结果返回。

//实例，提取以jpg类型的图片名称
var str2 = "ab.jpg,admin/12.gif,and.jpg";
var reg3 = /[^\\]\w+(?=\.jpg)/g;
console.log(str2.match(reg3));//["ab", ",and"]

反向前瞻匹配

(?!表达式) 后面一定不能要有什么。

 //示例：匹配 连续a字母三个以上，且后面不能有数字
var str3 = "aaa12345,aaaadmin,aaaaaadd,dlala";
var reg4 = /a{3,}(?!\d+)/g;
console.log(str3.match(reg4));//["aaaa","aaaaaa"]

案例

var arr = [
    {
        id:1,
        children:[...]|null
    },
    ...
]

变量arr是一个Object数组，数组元素为Object。有两个属性，id：数字类型，children：有两种类型，一种是数组，结构类似于变量arr；一种是null。请用代码实现从变量arr中提取子孙元素的id值组成一个一维数组，如[1,2,3,4,5]

解法1：使用正则分组全局匹配

var arr = [
    {
        id: 1,
        children: [
            {
                id: 2,
                children: null,
            },
            {
                id: 36,
                children: [
                    {
                        id: 4,
                        children: null,
                    },
                ],
            }
        ]
    },
    {
        id: 5,
        children: null
    }
]
var str = JSON.stringify(arr)
var result = str.match(/(\d+)/g) // 全局匹配
result = result.map(t => +t)
console.log(result)

解法2：递归解法

function getId(arr) {
    let ids = []
    function deepFind(arr) {
        arr.map(item => {
            ids.push(item.id)
            if (Array.isArray(item.children)) {
                deepFind(item.children)
            }
        })
    }
    deepFind(arr)
    return ids
}

console.log(getId(arr))