[JS] 정규표현식 test()를 여러 번 호출하면 생기는 문제 (lastIndex)

문제 상황.

 

회원가입 폼을 만들고 있는데

email 정규식을 설정하고 [계정 생성] 버튼을 누를 때마다 유효성 검사를 진행함.

 

유효성 검사는 test()를 사용함.

 

test()에 통과할 값으로 테스트를 진행했는데

true, false가 번갈아 가며 나오는게 아니던가...

const isPass = emailRegex.test(email);
console.log(isPass); // true 와 false가 번갈아가며 나옴

 

 

공식 문서를 살펴보니,

정규표현식에 g 플래그를 함께 사용할 경우 생길 수 있는 현상이라고 한다.

 

test()를 진행하면 정규표현식의 lastIndex 값이 업데이트되고,

test()값이 false를 반환하면 lastIndex 값이 다시 0으로 초기화된다.

 

 

 

공식 문서 내용

 

 

 

나의 해결.

유효성 검사하는 함수 첫 부분에 lastIndex를 0으로 초기화하는 코드를 넣어주었다.

const checkForm = () => {
  emailRegex.lastIndex = 0;
  
  ...
}

 

 

휴,,

 

 

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test

RegExp.prototype.test() - JavaScript | MDN