정규식 Invalid regular expression 에러 - safari/iOS

증상

React로 된 웹 페이지에서

크롬, 안드로이드에서는 문제 없이 보여지지만

safari와 아이폰에서 확인하였을때 뜨지않는 오류가 발생하였다. 

SyntaxError: Invalid regular expression: invalid group specifier name

 

원인

숫자에 콤마, 포메팅하는 정규표현식에 Safai와 iOS에 지원이 되지 않는 부분이 포함되어있었다. 

https://stackoverflow.com/questions/58460501/js-regex-lookbehind-not-working-in-firefox-and-safari

JS Regex lookbehind not working in firefox and safari

lookbehid가 허용되지 않는다고한다. 

 

해결

//기존
function priceToString(price) {
  return price.toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
}

//수정
function priceToString(price) {
  const parts = price.toString().split(".");
  parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  return parts.join(".");
}

 

브라우저별로 확인을 해보고 배포하자