본문 바로가기

전체 글

(131)
ReferenceError: require is not defined 에러 원인과 해결 방법 ReferenceError: require is not defined 에러 원인과 해결 방법자바스크립트에서 require()로 모듈을 불러오려는데 갑자기 ReferenceError: require is not defined라는 오류가 나타날 때가 있습니다. 다른 예제에서는 멀쩡하게 사용하는 코드인데 내 프로젝트에서만 실행되지 않으면 require 문법 자체가 잘못된 것처럼 느껴질 수 있는데요. 하지만 require is not defined는 대부분 문법보다 현재 실행 환경과 모듈 시스템이 맞지 않아서 발생합니다. 브라우저에서 실행하는지, Node.js의 CommonJS인지 ES Module인지에 따라 해결 방법도 달라집니다. 원인부터 하나씩 알아보겠습니다. ReferenceError: require ..
Cannot access before initialization 오류(TDZ) 해결하기 Cannot access before initialization 오류(TDZ) 해결하기자바스크립트를 실행하다가 ReferenceError: Cannot access '변수명' before initialization이라는 오류를 만날 때가 있습니다. 분명 아래쪽에 변수를 선언해 두었는데 왜 “초기화 전에 접근했다”고 나오는지 처음에는 이해하기 어려운데요. Cannot access before initialization 오류를 이해하려면 let과 const, 그리고 TDZ(Temporal Dead Zone) 개념을 알아두는 것이 중요합니다. 단순히 변수 선언을 위로 옮우는 방법뿐 아니라 왜 이런 오류가 발생하는지 원리부터 차근차근 살펴보겠습니다. Cannot access before initializati..
Identifier has already been declared 오류 원인과 중복 선언 해결 방법 Identifier has already been declared 오류 원인과 중복 선언 해결 방법자바스크립트를 실행하다가 SyntaxError: Identifier '변수명' has already been declared라는 오류가 나타날 때가 있습니다. 코드를 조금 수정했을 뿐인데 갑자기 실행 자체가 되지 않아 당황하기 쉬운 오류인데요. Identifier has already been declared 오류는 대부분 같은 스코프에서 동일한 이름을 중복 선언했을 때 발생합니다. 특히 let과 const, import 문을 사용할 때 자주 만날 수 있습니다. 중복 선언이 정확히 무엇인지부터 재할당과의 차이, 상황별 해결 방법까지 알아보겠습니다. Identifier has already been decl..
Assignment to constant variable 오류 해결법, const를 사용할 때 자주하는 실수 Assignment to constant variable 오류 해결법, const를 사용할 때 자주하는 실수자바스크립트에서 const로 변수를 선언한 뒤 코드를 실행했는데 TypeError: Assignment to constant variable.이라는 오류가 나타날 때가 있습니다. const는 자주 사용하는 기본 문법이지만 정확히 무엇을 변경할 수 없는지 헷갈리면 같은 오류를 반복해서 만나기 쉬운데요. Assignment to constant variable 오류는 대부분 const로 선언한 변수에 새로운 값을 다시 할당했을 때 발생합니다. const의 정확한 의미부터 재할당과 객체 내부 값 변경의 차이, let을 사용해야 하는 경우와 해결 순서까지 쉽게 알아보겠습니다. Assignment to c..
Maximum call stack size exceeded 오류가 발생하는 이유와 해결법 Maximum call stack size exceeded 오류가 발생하는 이유와 해결법자바스크립트 코드를 실행하다가 RangeError: Maximum call stack size exceeded라는 오류를 만나면 코드가 갑자기 멈추면서 어디서 문제가 시작됐는지 찾기 어려울 수 있습니다. 특히 재귀 함수나 이벤트 처리처럼 함수가 연속해서 호출되는 코드에서 자주 볼 수 있는데요. Maximum call stack size exceeded 오류는 쉽게 말해 함수 호출이 너무 많이 쌓여 자바스크립트가 더 이상 처리할 수 없는 상태가 됐다는 의미입니다. Call Stack이 무엇인지부터 무한 재귀가 발생하는 이유, 자주 놓치는 원인과 해결 순서까지 쉽게 알아보겠습니다. Maximum call stack si..
JSON.parse SyntaxError 원인과 해결 방법 총정리 JSON.parse SyntaxError 원인과 해결 방법 총정리자바스크립트에서 JSON.parse()를 사용하다 보면 SyntaxError와 함께 Unexpected token, Unexpected end of JSON input 같은 메시지가 나타날 때가 있습니다. 코드 자체에는 별다른 문제가 없어 보이는데 오류가 발생한다면 무엇부터 확인해야 할지 막막할 수 있는데요. JSON.parse SyntaxError는 대부분 변환하려는 문자열이 올바른 JSON 형식이 아닐 때 발생합니다. JSON.parse가 무엇을 하는 함수인지부터 따옴표, 쉼표, 빈 응답, API 데이터 등 자주 문제가 되는 원인과 해결 방법까지 차근차근 알아보겠습니다. JSON.parse란? 먼저 역할부터 이해하기JSON.parse(..
Unexpected token '<', 원인은 HTML일까? Unexpected token '자바스크립트를 실행했는데 SyntaxError: Unexpected token '라는 오류가 나타나면 조금 이상하게 느껴집니다. 자바스크립트 파일에는 를 작성한 적도 없는데 갑자기 HTML 태그처럼 생긴 문자가 문제라고 나오기 때문인데요. 결론부터 말하면 Unexpected token ' 정확히는 자바스크립트나 JSON을 받아야 하는 곳에서 서버가 HTML 문서를 반환했고, 이를 JavaScript 또는 JSON으로 해석하려다 오류가 발생하는 상황입니다. 왜 이런 일이 생기는지부터 해결 순서까지 자세히 알아보겠습니다. Unexpected token 'Unexpected token은 자바스크립트 엔진이 코드를 해석하다가 현재 위치에서 예상하지 못한 문자를 발견했다는 의미입..
Cannot use import statement outside a module 에러 해결 Cannot use import statement outside a module 에러 해결자바스크립트에서 import를 사용했는데 갑자기 SyntaxError: Cannot use import statement outside a module이라는 오류가 나타날 때가 있습니다. 분명 다른 예제에서는 정상적으로 사용하는 문법인데 내 코드에서는 왜 안 되는지 헷갈리기 쉬운데요. 이 오류의 핵심은 현재 자바스크립트 파일이 ES Module로 인식되지 않고 있다는 것입니다. 브라우저와 Node.js에서는 해결 방법이 조금 다르기 때문에 현재 어떤 환경에서 코드를 실행하는지부터 확인해야 합니다. 원인부터 상황별 해결법까지 차근차근 알아보겠습니다. Cannot use import statement outside a..