프런트엔드에서 일반적으로 사용되는 정규식을 요약합니다.
对于正则表达式,我们或许会经常使用,但是又很难记住。这篇文章,我将介绍下简单的正则表达式知识,然后总结前端开发中常用的正则表达式大全,需要的的朋友参考下
前言
正则这东西吧,感觉是开发的都会接触到一些..
那些所谓的基础语法就不说了哈,一搜一大把,来点实际的.
我这里就分享下我工作中汇总和遇到的,希望对一些小伙伴有些许帮助哈!!
正则汇总
匹配URL
const regexURL = /((https?|ftp)?:\/\/)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/gi; // 这条正则可以匹配这么一坨格式的url //www.baidu.com //http://www.baidu.com //https://www.baidu.com //baidu.com //test.baidu.com //gds.baidu.com //ftp://www.baidu.com // ---- 分割线 ---- // 也许有小伙伴不需要匹配这么一大坨,只要匹配http和https,上面的改写一下就好了 const regexURL = /(https?:\/\/)(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/gi; //http://www.baidu.com //https://www.baidu.com
匹配中国身份证不大靠谱版
// 为什么说不靠谱,是因为单单正则没法实现区域结合出生日期的判断这种很精准的识别 const regexCHINAIDCARD = /^((1[1-5])|(2[1-3])|(3[1-7])|(4[1-6])|(5[0-4])|(6[1-5])|71|(8[12])|91)\d{4}((19\d{2}(0[13-9]|1[012])(0[1-9]|[12]\d|30))|(19\d{2}(0[13578]|1[02])31)|(19\d{2}02(0[1-9]|1\d|2[0-8]))|(19([13579][26]|[2468][048]|0[48])0229))\d{3}(\d|X|x)?$/gi; // 可以匹配这么一堆身份证,身份证号码都是网络搜索的,一搜一堆 //230381198104143414 //650201199007186135 //460106197707275739 //44200019860325932X //43052819880216450X //654223197502255401
匹配数字,整数,浮点~~~
// 这货只会匹配正整数 const regexInteger = /^\d+$/gi; // 肯定有人想问,范围性的整数呢,看我改下,比如0-100 const regexRangeInteger = /^\d$|^[1-9]\d$|^100$/gi; // 匹配小数呢,不限定范围的 const regexFloat = /^\d+\.\d+$/gi // 倘若要限定呢,比如还是那个,0~100的任意整数和浮点数 const regexRangeIntFloat = /^(\d{0,2}(\.\d+)?|100(\.0+)?)$/gi;
匹配手机号码
// 不含卫星电话这些,只是罗列的常见的手机范围,也考虑了区域和长途前缀 const regexMobileNumber = /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/gi;
匹配邮箱
const regexEmail = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9_]+\.)+[a-zA-Z]{2,}))$/gi // 已经不靠谱的测试了这么几种写法的邮箱格式都通过了 //cc011@qq.com //fsdlk@dd-fad.cn //df_fs2.q@jd-f.com //crklej-dsfj@132.com //fdfkj@aa_fslkdfj.com.cn //d390.fslk@qq.com //1100@gmail.cn //sflk-98_dsf@qq_fsk.com
加强版密码设置规范
// 必须含有大小写字母,数字及特殊符号,长度8~24 const regexEnhancePassword = /^(?!\s)((?=.*[a-zA-Z])(?=.*[a-z])(?=.*[A-Z])(?=.*[\W_]).\S{8,24})$/g;
中国车牌号校验
const regexCarLicense = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/g;
匹配QQ号,微信号
// QQ在我印象中好像一直都是纯数字,现在好像发展到11位了,好像最初是从100000开始的 const regexQQNumber = /^[1-9]\d{5,10}$/gi; // 特意去查了下最新的微信号的规则 //1、微信号是微信的唯一凭证,只能设置1次; //2、可使用6-20个字母、数字、下划线和减号; //3、必须以字母开头(字母不区分大小写); //4、不支持设置中文。 const regexWeChatNumber = /^[A-Za-z][\w-]{5,19}$/gi;
用户名规范
// 普通版,英文+数字,必须字母开头,允许下划线,长度八到十六 const regexNormalUsername = /^[a-zA-Z]\w{7,15}$/gi; // 在这个基础上允许中文四到六个字符 const regexE1 = /^[\u4e00-\u9fa5]{4,6}$|^[a-zA-Z]\w{7,15}$/gi; // 多重复用版本,允许手机,邮箱,中文,这个若是写成一个的话,用分组的写法就好了 // 不过很长很长,,,推荐用if...else ...来拆分,,就三个正则....
위 내용은 프런트엔드에서 일반적으로 사용되는 정규식을 요약합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

핫 AI 도구

Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool
무료로 이미지를 벗다

Clothoff.io
AI 옷 제거제

AI Hentai Generator
AI Hentai를 무료로 생성하십시오.

인기 기사

뜨거운 도구

메모장++7.3.1
사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경

드림위버 CS6
시각적 웹 개발 도구

SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)

뜨거운 주제











Non-Blocking, Event-Driven 기반으로 구축된 Node 서비스는 메모리 소모가 적다는 장점이 있으며, 대규모 네트워크 요청을 처리하는데 매우 적합합니다. 대규모 요청을 전제로 '메모리 제어'와 관련된 문제를 고려해야 합니다. 1. V8의 가비지 수집 메커니즘과 메모리 제한 Js는 가비지 수집 기계에 의해 제어됩니다.

Vue.js는 오늘날 프런트엔드 개발에서 매우 인기 있는 프레임워크가 되었습니다. Vue.js가 계속 발전함에 따라 단위 테스트는 점점 더 중요해지고 있습니다. 오늘은 Vue.js 3에서 단위 테스트를 작성하는 방법을 살펴보고 몇 가지 모범 사례와 일반적인 문제 및 솔루션을 제공하겠습니다.

PHP와 Vue: 프론트엔드 개발 도구의 완벽한 조합 오늘날 인터넷이 빠르게 발전하는 시대에 프론트엔드 개발은 점점 더 중요해지고 있습니다. 사용자가 웹 사이트 및 애플리케이션 경험에 대한 요구 사항이 점점 더 높아짐에 따라 프런트 엔드 개발자는 보다 효율적이고 유연한 도구를 사용하여 반응형 및 대화형 인터페이스를 만들어야 합니다. 프론트엔드 개발 분야의 두 가지 중요한 기술인 PHP와 Vue.js는 함께 사용하면 완벽한 도구라고 볼 수 있습니다. 이 기사에서는 독자가 이 두 가지를 더 잘 이해하고 적용할 수 있도록 PHP와 Vue의 조합과 자세한 코드 예제를 살펴보겠습니다.

크로스 도메인은 개발 과정에서 자주 접하는 시나리오이며, 인터뷰에서도 자주 거론되는 문제이기도 합니다. 일반적인 크로스 도메인 솔루션과 그 뒤에 숨은 원칙을 익히면 개발 효율성이 향상될 뿐만 아니라 인터뷰에서도 더 나은 성과를 낼 수 있습니다.

지리정보학을 전공하는 학생들에게 적합한 컴퓨터 추천 1. 권장사항 2. 지리정보학을 전공하는 학생들은 대용량의 지리 데이터를 처리하고 복잡한 지리정보 분석을 수행해야 하므로 강력한 성능을 갖춘 컴퓨터가 필요합니다. 높은 구성을 갖춘 컴퓨터는 더 빠른 처리 속도와 더 큰 저장 공간을 제공할 수 있으며 전문적인 요구 사항을 더 잘 충족할 수 있습니다. 3. 데이터 처리 및 분석의 효율성을 향상시킬 수 있는 고성능 프로세서와 대용량 메모리가 장착된 컴퓨터를 선택하는 것이 좋습니다. 또한 더 큰 저장 공간과 고해상도 디스플레이를 갖춘 컴퓨터를 선택하면 지리 데이터와 결과를 더 잘 표시할 수 있습니다. 또한, 지리정보학을 전공하는 학생들은 지리정보시스템(GIS) 소프트웨어를 개발하고 프로그래밍해야 할 수도 있다는 점을 고려하여 그래픽 처리 지원이 더 나은 컴퓨터를 선택하세요.

프론트엔드 개발 인터뷰에서 일반적인 질문은 HTML/CSS 기초, JavaScript 기초, 프레임워크 및 라이브러리, 프로젝트 경험, 알고리즘 및 데이터 구조, 성능 최적화, 크로스 도메인 요청, 프론트엔드 엔지니어링, 디자인 패턴, 새로운 기술 및 트렌드. 면접관 질문은 후보자의 기술적 능력, 프로젝트 경험, 업계 동향에 대한 이해를 평가하기 위해 고안되었습니다. 따라서 지원자는 자신의 능력과 전문성을 입증할 수 있도록 해당 분야에 대한 충분한 준비를 갖추어야 합니다.

Golang 정규 표현식은 파이프 문자 |를 사용하여 여러 단어 또는 문자열을 일치시키고 각 옵션을 논리적 OR 표현식으로 구분합니다. 예: "fox" 또는 "dog"와 일치: fox|dog은 "quick", "brown" 또는 "lazy"와 일치: (quick|brown|lazy)는 "Go", "Python" 또는 "Java"와 일치: Go| Python |Java는 단어 또는 4자리 우편번호와 일치합니다: ([a-zA

초기에 JS는 브라우저 측에서만 실행되었습니다. 유니코드로 인코딩된 문자열은 처리하기 쉬웠지만 바이너리 및 유니코드가 아닌 인코딩된 문자열을 처리하는 것은 어려웠습니다. 그리고 바이너리는 컴퓨터의 가장 낮은 데이터 형식인 비디오/오디오/프로그램/네트워크 패키지입니다.
