简单易学正则之实例篇

1. 敏感词替换

function $(id) {
    return typeof id === 'string' ? document.getElementById(id) : null;
}
$('btn').onclick = function() {
    var val1 = $('content1').value;
    var reg = /傻|笨/gi; // | 表示或
    var newString = val1.replace(reg, function($0) {
        return '*'.repeat($0.length); // 这里的话不能单纯的用*代替，因为还需要考虑长度
    });
    $('content2').value = newString
} 

2. 横线命名转驼峰命名

先说明一下，这个是借鉴了B站一个视频的案例

var string = 'border-bottom-color'; // --> borderBottomColor
// way1  -->  一般js逻辑实现
var arr = string.split('-');
// console.log(arr);

for(var i = 1; i < arr.length; i ++) {
    arr[i] = arr[i][0].toUpperCase() + arr[i].substring(1);
    //将元素内的元素拼接
    console.log(arr[i].substring(1));
}

console.log(arr.join(''))
// way2  -->  正则实现
var reg = /(-)([a-z])/gi; // 加括号代表分组-->子项  
var newString = string.replace(reg, function($0, $1, $2) {
    // $0代表整体，$1代表第一组 
    console.log($0);
    console.log($1);
    console.log($2);
    
    
    return $2.toUpperCase();
})
console.log(newString);

3. 用户名正则

var reg = /^[a-zA-Z0-9]{4,8}$/;

4. 邮箱正则

这里水了一下，只判断了QQ邮箱

var reg = /(?=.{10,20})\d+\@(qq.com)/gi;

5. 密码正则

var reg = /^.*(?=.{6,12})(?=.*[a-zA-Z]\d)(?=.*[!@#$%^&*? ]).*$/;

这里是我在学习过程中写的代码，需要的可以看看
https://download.csdn.net/download/weixin_47547625/12439411

原来那个博客基本已经废弃掉了（太不稳定了），如果之前那些资源需要的话，可以私聊我

总结

到这里，正则的学习基本告一段落了，希望我的学习笔记什么的可以帮助到那些跟我一样初学的小伙伴