javascript 정규 표현 식 과 문자열 RegExp and String(1)
정규 표현 식 은 자 바스 크 립 트 가 매우 중요 하고 자주 사용 하 는 기능 으로 jquery 등 대형 프레임 워 크 에서 자주 사용 되 고 있 습 니 다.최근 에 시간 을 내 서 관련 지식 을 배우 고 필요 한 친구 와 공유 하 는 것 을 기록 하 였 습 니 다.
사유 지도
RegExp(정규 표현 식)생 성 방식
두 가지 방식 으로 RegExp 를 만 들 수 있 습 니 다.구체 적 으로 다음 과 같 습 니 다.
정규 표현 식 을 만 들 려 면/.......................................................................
RegExp 구조 방법 을 통 해 정규 표현 식 을 만 듭 니 다.
더 좋 은 설명 모드 를 위해 정규 표현 식 은 3 개의 표 지 를 제공 합 니 다.각각 g/i/m 입 니 다.
g:전역 일치:처음 일치 한 후에 멈 추 는 것 이 아니 라 전체 문자열 에서 일치 합 니 다.
i:대소 문자 일치 무시
m:여러 줄 문자열 의 줄 마다 줄 의 첫머리 와 줄 끝의 특수 문자(각각^와$)를 적용 합 니 다.
구체 적 으로 아래 코드 를 참조 하여 깊이 이해 하 십시오.
var regx = new RegExp('are','g');
var regx1 = /are/g; //
RegExp 실례 의 주요 속성RegExp 의 구조 함수 에 따라 우 리 는 RegExp 의 주요 속성 을 대충 짐작 할 수 있 고 인 스 턴 스 속성 에 대해 알 아 보면 된다.그러나 주의해 야 할 것 은 이 인 스 턴 스 속성 들 은 for in 을 통 해 옮 겨 다 니 며 가 져 올 수 없습니다.
아래 코드 를 참조 하여 깊이 이해 할 수 있 습 니 다.
var regx1 = /are/g; //
console.log("source:"+regx.source +" global:"+regx.global+" ignoreCase:"+regx.ignoreCase +" multiline:"+regx.multiline);
// source:are global:true ignoreCase:false multiline:false
for(var p in regx) { // for
if(regx.hasOwnProperty(p)) {
console.log(regx[p]);
}
}
RegExp 실례 의 주요 방법-test이 방법 은 매우 간단 합 니 다.하나의 매개 변수 만 있 습 니 다.입력 한 매개 변수 가 정규 표현 식 모드 와 일치 하 는 지 검증 하 는 데 자주 사 용 됩 니 다.true 와 일치 하면 false 로 돌아 갑 니 다.아래 코드 를 참조 하여 깊이 이해 할 수 있 습 니 다.
var regx1 = /are/g;
var res = regx.test('you are a good boy!');
console.log(res) ; //true
var res1 = regx.test('I am a good boy!');
console.log(res1) ; //false
RegExp 실례 의 주요 방법-exec법 이라는 방법 은 매우 상용 하 는 방법 이 므 로 잘 이해 해 야 한다.일치 하 는 문자열 만 받 습 니 다.반환 값 은 배열 arr 입 니 다.배열 에 저 장 된 첫 번 째 일치 하 는 항목 에 대한 정 보 는 다음 과 같 습 니 다.
input:일치 하 는 문자열,exec 방법의 입력 값
index:문자열 의 일치 성 위치
arr[0]:패턴 이 일치 하 는 문자열
arr[1]...arr[n]:n 번 째 포획 그룹 문자열
이 방법 을 사용 할 때 주의해 야 합 니 다.정규 표현 식 에서 전역 플래그 g 가 지정 되 지 않 으 면 항상 첫 번 째 일치 항목 을 되 돌려 줍 니 다.전역 플래그 g 가 설정 되 어 있 으 면 exec 를 호출 할 때마다 문자열 에서 새 일치 항목 을 계속 찾 습 니 다.
아래 코드 를 참조 하여 깊이 이해 할 수 있 습 니 다.
var regx = /fn:(\w+)\s+ln:(\w+)\s/g;
var s ="your fn:xiaoxin ln:tang right?";
var result = regx.exec(s);
console.log(result.input); //your fn:xiaoxin ln:tang right?
console.log(result.index); //5
console.log(result[0]); //fn:xiaoxin ln:tang
console.log(result[1]); //xiaoxin
console.log(result[2]); //tang
console.log(result[3]); //undefined 2 , undefined
RegExp 구조 함수 속성함수 속성 에 대해 서 는 다른 프로 그래 밍 언어(예 를 들 어 자바)의 정적 속성 을 참조 하여 이해 할 수 있 습 니 다.이러한 속성 은 모든 RegExp 인 스 턴 스 에 의 해 공 유 됩 니 다.즉,모든 RegExp 가 이러한 속성 을 방문 하고 수정 할 수 있 습 니 다.특정한 인 스 턴 스 가 test 나 exec 방법 을 실행 할 때 이러한 속성의 값 도 이에 따라 달라 집 니 다.
이러한 속성 에 대해 우 리 는 자신의 이해 에 따라 기억 할 수 있다.
input:패턴 이 일치 하 는 문자열,test 또는 exec 방법의 입력 인자 가 필요 합 니 다.매개 변수 별명:$-
lastMatch:최근 일치 하 는 항목 입 니 다.매개 변수 별명:$&
left Context:왼쪽 문자열 과 일치 합 니 다.매개 변수 별명:$`
rightContext:항목 오른쪽 에 있 는 문자열 과 일치 합 니 다.인자 별명:$'
1,2,$3...:캡 처 그룹 에 대응 하 는 문자열 입 니 다.
물론 이 값 들 은 RegExp 인 스 턴 스 를 통 해 exec 가 돌아 온 결 과 를 계산 할 수 있 습 니 다.그런데 왜 구조 함수 RegExp 에 이러한 속성 을 설정 해 야 합 니까?*
아래 코드 를 참조 하여 깊이 이해 할 수 있 습 니 다.
var regx = /fn:(\w+)\s+ln:(\w+)\s/g;
var s ="your fn:xiaoxin ln:tang right?";
var result = regx.exec(s);
console.log(RegExp.input); //your fn:xiaoxin ln:tang right?
console.log(RegExp.lastMatch); //fn:xiaoxin ln:tang
console.log(RegExp.leftContext); //your
console.log(RegExp.rightContext); //right?
console.log(RegExp.$1); //xiaoxin
console.log(RegExp.$2); //tang
RegExp-메타 문자다른 언어의 정규 표현 식 과 유사 합 니 다.js 정규 표현 식 에 도 일부 메타 문자 가 존재 합 니 다.이 문자 들 은 특별한 용도 와 의미 가 있 기 때문에 사용 하 는 과정 에서 이 문자 들 을 전의 해 야 합 니 다.이 문자 들 앞 에'\'를 붙 여 전의 처 리 를 해 야 합 니 다.JS 정규 표현 은 다음 과 같 습 니 다.
( [ { \ ^ $ | ) ? * + . ] }
RegExp-탐욕 매 칭 과 게 으 름 매 칭
탐욕 매 칭 은 정규 표현 식 의 매 칭 과정 에서 기본적으로 매 칭 길이 가 클 수록 좋 습 니 다.JS 정규 표현 식 에서 게 으 름 한정 부 는'?'입 니 다.모드 에'?'게 으 름 의 일치 가 요구 된다.구체 적 으로 아래 코드 를 참조 하여 이해 합 니 다.
var s = 'I am a good boy,you are also a good boy !';
var regx = /good.*boy/g; //
console.log(regx.exec(s)[0]); //good boy,you are also a good boy
var regx1 = /good.*?boy/g; //
console.log(regx1.exec(s)[0]); //good boy
위 내용 은 소 편 이 공유 하 는 자 바스 크 립 트 정규 표현 식 과 문자열 RegExp and String(1)입 니 다.다음 글 은 공유 하 겠 습 니 다javascript 정규 표현 식 과 문자열 RegExp and String(2)마음 에 드 셨 으 면 좋 겠 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[2022.04.19] 자바스크립트 this - 생성자 함수와 이벤트리스너에서의 this18일에 this에 대해 공부하면서 적었던 일반적인 함수나 객체에서의 this가 아닌 오늘은 이벤트리스너와 생성자 함수 안에서의 this를 살펴보기로 했다. new 키워드를 붙여 함수를 생성자로 사용할 때 this는...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.