국비교육(22-23)

[참고] Chrome에서 javascript 실행 과정 살펴보기 (breakpoints, step over, step into)

서리/Seori 2022. 10. 7. 18:26

2022.10.07 - [국비교육] - 3일차(4)/javascript 기초 : function(2)

예제 전체는 3일차/javascript 기초 <예제10> 참고

 

 

크롬 브라우저의 검사-source-파일명을 선택하면 작성한 javascript 코드가 나타난다.
행 번호를 선택하고 새로고침하면 그 행에서 실행을 멈출 수 있다.(일괄 실행X, 실행의 중단점으로 사용)

→ 이미지의 Breakpoints 부분을 보면 됨.

step over를 누르면 한 줄씩 차례로 실행해볼 수 있다.

 이미지의 Scope를 보면서 아래에 Console 창을 띄워놓고 확인 가능

 

step into 를 누르면 function 안으로 들어가서 실행 절차를 추적해 들어갈 수 있다.

 


javascript가 실행되는 단계를 익히는 데에 참고하기!