본문 바로가기

Tech/BoostCourse - WEB

[부스트코스] JavaScript Debugging

프로그래밍에서 디버깅은 버그를 잡는 것을 의미한다.

프로그래밍을 하다보면 내 코드가 버그가 없으면 좋겠지만 생기기 마련이다. 이를 빠르게 해결하는 것이 프로그래밍 생활을 좀 더 건강하고 즐겁게 할 수 있는 방법이다.

 

자바스크립트는 런타임(실행) 단계에서 실행되는 언어이기 때문에 보통 브라우저에서 디버깅을 많이 한다.

 

* valnila js : 프레임워크 없이 실행되는 자바스크립트

 

디버깅 컨트롤

  • Pause, Continue : 첫 번째 버튼은 평소에는 Pause 버튼 상태인데 브렉포인트가 잡힌 상태에선 Continue 버튼이 됩니다. 다른 브레이크포인트가 잡힐 때까지 코드를 진행
  • Step over next function call : 스텝 오버는 코드 라인을 한 스탭 진행하는데 현재 실행 라인에 함수 실행 코드가 있다면 함수는 실행하는데 이때 함수 안의 코드로는 진입하지 않습니다. 즉 라인의 함수를 실행만 하게 된다.
  • Step into next function call : 스텝 인투는 스텝 오버와 다르게 현재 실행 라인의 코드에 함수가 있다면 함수 안의 첫 번째 코드로 진입해 들어가 다시 하나씩 라인별로 코드를 실행할 수 있습니다.
  • Step out of current function : 스텝 인투로 들어온 함수를 끝까지 실행하고 밖으로 빠져나와 해당 함수를 실행한 함수로 돌아갑니다.
  • Active/Deactive breakpoint : 브레이크포인트를 끄거나 켤 수 있다.
  • Pause on exception : 자바스크립트 예외가 발생하면 해당 위치에 브레이크포인트를 잡아준다.

 

[부스트코스 관련 강의 링크]

JavaScript Debugging - https://www.edwith.org/boostcourse-web/lecture/20391/

 

[LECTURE] 5) JavaScript Debugging : edwith

들어가기전에 자바스크립트은 실행단계(런타임)에서 버그가 발견됩니다. 그 타이밍에 어디가 문제인지 바로 확인하는 게 좋습니다. 다른 프로그래밍처럼 자바스크립트 개발도 디버깅의 연속이... - 부스트코스

www.edwith.org

반응형