1

该文章记录日常工作中用到的正则表达式

1.非CSSmodule转成CSSmodule类型

image.png
(className='([^']+?)')

  • 查找文件中所有的className部分

image.png
className={styles.$2}

  • 将匹配到的内容换成styles.格式

image.png
(styles.((\w+)-(\w+)))

  • 查找到所有的使用-命名的样式

image.png
~~~~styles.$3$4

  • 替换所有的使用-命名的样式

image.png

2.将所有使用的moment方法统一管理做判空

场景:项目需求有大量使用antd的DatePiker的使用,当后台传参为空的时候显示invaliddate就很丑
所以一般需要对参数进行判空,数量多起来就要进行抽成统一方法,一个个改的话就很累
统一放在常用方法文件中
image.png

moment\((.*)\).format\((.*)\)
image.png

momentNotNull($1,$2)
image.png
替换之后需要做校验,防止有些已经做了null判空的参数被也被修改了
以上~

3.清除代码中的debugger

刚学习前端的时候喜欢打debugger
然后之后觉得在for循环里打debugger又非常的痛苦
再然后就是用谷歌控制台打断点调试
奈何有时候项目文件过多,搜一个名字又N多重名文件,还要对这列表来找~(心塞)
所以定位小问题的时候还是喜欢用debugger
定位的问题多了一天下来,文件准备提交了
发现debugger没删
以前的项目组debugger一个没删扣五块钱~
话不多说
上正则

\sdebugger\n
通过正则表达式一键匹配所有的debugger
然后用空字符替换
(直接搜索debugger进行全局替换会出现把名字包含debugger的函数或者语句给替换掉)

4.根据不同的文件后缀显示不同的图标

最近boss要求做一个类似于网盘的需求,用的是阿里云的前端直传oss
然后根据保存的文件进行分类显示
涉及到不同的文件需要有不同的图标显示

        const musicsuf = /\S*\.[mp3|wma|avi|rm|rmvb|flv|mpg|mov|mkv]/
        const videosuf = /\S*\.[mp4|rmvb|flv|mpeg|avi]/
        const imgsuf = /\S*\.[gif|jpeg|png|jpg|bmp]/
        if (videosuf.test(filename)) {
            return (<i className="iconfont icon-videoicon"></i>)
        } else if (musicsuf.test(filename)) {
            return (<i className="iconfont icon-musicicon"></i>)
        }
        else if (imgsuf.test(filename)) {
            return (<i className="iconfont icon-imgicon"></i>)
        } else {
            return (<i className="iconfont icon-excelicon"></i>)
        }

代码分别匹配了常见的视频,音频和图片格式,剩余的默认为文档格式
效果如下
image.png

5.传入时间格式,格式化当前时间

在学习小程序代码的时候偶然看到老师分享的一段时间处理的代码,正好最近有用到moment插件中的format方法,应该moment中的实现方案和这个原理差不多吧,做下记录,代码出处因为太多地方转载,找不到,侵删(狗头)

Date.prototype.Format = function (fmt) { 
    if(!fmt){
        fmt="yyyy-MM-dd hh:mm:ss"
    }
    var o = {
        "M+": this.getMonth() + 1, //月份 
        "d+": this.getDate(), //日 
        "h+": this.getHours(), //小时 
        "m+": this.getMinutes(), //分 
        "s+": this.getSeconds(), //秒 
        "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
        "S": this.getMilliseconds() //毫秒 
    };
    if (/(y+)/.test(fmt)) {
        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    }
    for (var k in o)
        if (new RegExp("(" + k + ")").test(fmt)) {
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        }
    return fmt;
}

var time1 = new Date().Format("yyyy-MM-dd");
var time2 = new Date().Format("yyyy-MM-dd hh:mm:ss");
console.log(time1)
console.log(time2)

to be continue...


pan463859
21 声望0 粉丝

永远的前端小白~