F12 버튼을 눌러 크롬 개발자 도구에 진입합니다.
소스 탭 메뉴를 누른 후에 디버깅하고 싶은 자바스크립트 파일을 찾습니다.
해당 파일을 클릭 후에 함수 왼쪽을 클릭하여 브레이크 포인트를 지정합니다.
지정한 자바스크립트 함수가 실행될 수 있도록 이벤트를 발생시킵니다.
브레이크 포인트가 걸렸으면 디버깅 모드를 이용할 수 있습니다.
디버깅 모드
다음 함수 호출(Step Over) - 한 줄씩 순차 실행
다음 함수 호출(Step Into) - 해당 시점에 함수 안에 들어가 내부 함수를 탐색합니다.
현재 함수에서 벗어나기 - 현재 함수에서 상위 함수로 빠져나옵니다.
'Frontend > JavaScript' 카테고리의 다른 글
| window 객체의 opener 사용하기 (0) | 2023.10.15 |
|---|---|
| 자바스크립트 null, undefined, NaN의 차이 (0) | 2023.10.08 |
| 자바스크립트(3) - 객체 생성 (0) | 2022.09.27 |
| 자바스크립트(2) - Rest, 클로저, 화살표 함수 (0) | 2022.09.26 |
| 자바스크립트(1) - 요소 값 접근 (0) | 2022.09.24 |