Uncaught RangeError: Maximum call stack size exceeded

안녕하세요 홍대주민입니다. 

혹시 여러분 이런 에러를 만나본 적이 있나요?

Uncaught RangeError: Maximum call stack size exceeded

딱 봐도 뭐가 엄청나게 에러가 나고 있단 중후한 느낌이 강하죠? 

지금 당신의 홈페이지에서 현재 Uncaught RangeError: Maximum call stack size exceeded 이런 에러가 송출된다면, 자바스크립트가 무한루프를 돌고 있단 뜻입니다. 더 쉽게 말하자면, 쳇바퀴 돌듯 계속해서 반복적으로 스크립트 소스 내지, 자바스크립트 내의 반복문이 계속되고 있어서 당신의 호스팅이 지금 숨차하고 있는 상황입니다.

물론 제가 개발하고 있던 홈페이지도 스크립트 무한루프로 숨차하고 있는 상황이구요 ㅋㅋ 

자 그래서 소스보기를 눌러, 무엇이 잘못되었나 살펴봤습니다. 

살펴보니까, 위 스크립트 중에서 같은 소스가 두번 인클루딩이 되어서 "중복"된 소스가 HTML 내에서 읽혀지고 있었습니다. 

같은 소스의 중복에도 "Uncaught RangeError: Maximum call stack size exceeded" 이런 에러를 불러올 수 있고, 위에서 언급한 스크립트 내의 무한루프가 도는 지점에서도 발생할 수 있습니다. 

여러분, 홈페이지 운영 및 개발하시다가, 스크립트 에러가 뜨면, 당황하지 않고 차근차근 문제가 무엇인지 풀어가 봅니다. 

1 | <script>

2 | var str= "test';      // 문법에러 " 로 시작했으면 " 으로 닫아야함

3 | var str2 = "test222"; // 정상

.

.

.

80 | alert("왜 이게 실행이 안돼지??? 돼지야? 버그 많이 먹은거야? 왜 먹어 버그 ㅠ,ㅠ");

81 | </script>

순차적으로 html 랭귀지를 읽어내려오기 때문에, 앞에 있는 행에서 에러가 나면, 그 다음의 행이 문법적으로 옳다고 해도, 실행하지 못하고 에러 메세지를 띄워줍니다. 즉 2행에서 발생한 에러때문에 3행이 문법적으로 정상이어도, 읽어오지 못하는 슬픈 상황이 됩니다... 

2행의 에러는 80행의 정상적인 문구 역시 출력하지 못합니다. 그러니, 크롬 요소 검사에서 빨간줄 쫙쫙 그어져 있는 것이 있다면, 꼭 디버깅 하시고 작업 진행하시기 바랍니다.