Dev/javascript

[javascript] 크롬 브라우저 디버깅 단축키 정리

bskyvision.com 2024. 8. 4. 23:23

오늘은 크롬 브라우저에서 자바스크립트 코드를 디버깅할 때 사용할 수 있는 단축키에 대해 정리해보도록 하겠습니다. 먼저 F12로 개발자 도구를 연 후에 sources 탭에 가서 디버깅하고 싶은 부분에 중단점을 설정합니다. 그 다음에 이제 아래 버튼들을 통해서 디버깅을 진행할 수 있습니다. 

 

스크립트 디버깅 단축키 정리

F8 - Resume script execution

 

스크립트 실행을 재개한다. 추가 중단점이 있다면 중단점까지, 없다면 스크립트를 쭉 실행한다. 

 

F9 - Step

 

다음 코드를 실행한다. 

 

F10 - Step over next function call

 

다음 함수 호출까지 넘어간다.

 

F11 - Step into next funciton call

 

다음 함수 안으로 들어간다.

 

F12 - Step out of current function

 

현재 함수 밖으로 나온다.

 

참고자료

[1] https://ko.javascript.info/debugging-chrome