민프
[React][Error] TIL, 정규표현식 Invalid regular expression 본문
[Error] SyntaxError: Invalid regular expression: invalid group specifier name
(익명 함수) (main.2257f7da.js:2)개발중인 페이지에서 IOS 16버전 Safari에서는 잘 동작하던 페이지가
IOS 15버전 Safari에서는 위 와 같은 에러가 나오면서 동작하지 않았다.
Works in Chrome, but breaks in Safari: Invalid regular expression: invalid group specifier name /(?<=\/)([^#]+)(?=#*)/
In my Javascript code, this regex /(?<=\/)([^#]+)(?=#*)/ works fine in Chrome, but in safari, I get: Invalid regular expression: invalid group specifier name Any ideas?
stackoverflow.com
스택 오버플로우를 보면
x(?<=y) x(?<!y)정규식에서 위 문법(lookbehind)를 사용할 수 없다는 것 이다.
lookbehind를 언제부터 지원하는 것 일까?
http://kangax.github.io/compat-table/es2016plus/
ECMAScript 2016+ compatibility table
Sort by Engine types Features Flagged features Show obsolete platforms Show unstable platforms <!-- --> V8 SpiderMonkey JavaScriptCore Chakra Other ⬤ Minor difference (1 point) ⬤ Small feature (2 points) ⬤ Medium feature (4 points) ⬤ Large feature
kangax.github.io
위 페이지를 보면
lookbehind 문법은 최근에 생긴 정규식 문법으로 ECMAScript 2018 스펙이라서 Chrome 브라우저에서만 사용이 가능하고 Safari, FireFox 브라우저는 지원이 되지 않는 것과 Safari는 IOS 16.4버전 부터 지원해주는 것을 알 수 있었다.
--기존 작성--
setIsEditName(response.name.replace(/(?<=.{1})./gi, "*"));
{isCraditNumber.replace(/(?<=.{9})./gi, "*")}
--수정 코드--
setIsEditName(response.name.replace(/(.)./gi, "$1*"));
{isCraditNumber.slice(0, 9) + isCraditNumber.slice(9).replace(/./g, "*")}위 코드는 기존 작성했던 코드고, 아래 코드는 수정한 코드이다 이렇게 해야만 lookbehind를 지원하지 않는 IOS, Safari 버전 에서도 정상적으로 사용이 가능하다
