Chrome 디 버 깅 디 버 깅 의 JS 단점 디 버 깅 기술

JS 디 버 깅 기술
1:압축 코드 포맷
这里写图片描述
这里写图片描述
기술 2:어떤 정지점 으로 빠르게 이동
오른쪽 에 있 는 Breakpoints 는 JS 파일 에서 걸 었 던 모든 정지점 을 모 을 것 입 니 다.checkbox 와 같은 줄 을 누 르 면 이 정지점 을 잠시 취소 합 니 다.checkbox 를 누 르 면 다음 줄 은 이 정지점 의 위치 로 바로 이동 합 니 다.
这里写图片描述
기교 3:단점 내부 의 작용 범 위 를 살 펴 본다[매우 실용적이다]
오른쪽 에 있 는 scope 는 상당히 많은 실 용적 인 정 보 를 볼 수 있 습 니 다.예 를 들 어 this 의 지향,값 이 있 는 지,단점 이 대상 인지 다른 지 등 입 니 다.
这里写图片描述
기술 4:감청 사건 정지점
오른쪽 에 있 는 Event Listener Breakpoints 는 키보드 입력,드래그 등 특정한 행위 이 벤트 를 선택적으로 감청 할 수 있 습 니 다.앞 에 있 는 checkbox 를 선택 하면 동작 변경 을 실행 할 때 실행 중인 JS 로 이동 합 니 다.
这里写图片描述
기술 5:DOM 및 XHR 감청 점프
DOM Breakpoints:Elements 페이지 입 니 다.dom 의 행동 을 감청 해 야 할 것 같 지만 정확 한 위 치 를 구체 적 으로 알 지 못 하면 사용 할 수 있 습 니 다.
这里写图片描述  
这里写图片描述
XHR Breakpoints:서버 에 요청 한 ajax 의 핵심 요점
기본적으로 모든 XHR 행 위 를 선 택 했 습 니 다.옵션 은 URL 을 판단 하 는 것 입 니 다...저 는 많이 안 써 요.
这里写图片描述
기술 6:한 걸음 실행,한 걸음 진입,강제 진입,한 걸음 퇴장
이 동 동 은 디 버 깅 에서 없어 서 는 안 될 것 입 니 다.사실은 firebug 를 사용 한 동료 입 니 다.이것 에 대해 명확 한 인식 을 가지 고 있 습 니 다.기본적으로 같다.먼저 위의 그림;
这里写图片描述
기능 명사
  • Pause script excution[한 단계 실행,정지점 에서 일시 정지,디버그 C 를 기다 리 는 것 은 직역 이 아 닙 니 다]:일시 정지 후 이 단 추 는 Resume script excution[계속 실행],단축 키[F8 또는 Ctrl+\]
  • Step over next function call[한 걸음 건 너 뛰 기]:다음 정지점 으로 넘 어 갑 니 다.단축 키[F10 또는 Ctrl+]
  • Step into next function call[한 단계 진입]:함수 내부 디 버 깅,단축 키[F11 또는 Ctrl+;]
  • Step out of current function[한 걸음 으로 뛰 기]:현재 이 정지점 의 함수,단축 키[Shift+F11 또는 Ctrl+Shift+;]
  • 뒤에 있 는 게 chrome 의 특색 기능 이에 요.
  • 브레이크 포인트 비활성화:모든 인 터 럽 트 를 일시 적 으로 무효 화,단축 키【Ctrl+F8】
  • Don't Pause on exceptions:표현 식 에서 멈 추 지 마 세 요.또 하나의 옵션 이 있 습 니 다.[Pause On Caught Exceptions C 에서 이상 을 던 지면 멈 춰 야 합 니 다]
  • 총결산
    이 글 은 여기까지 입 니 다.더욱 깊이 있 고 효율 적 인 작은 조작 은 다음 글 에서 소개 하 겠 습 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

    좋은 웹페이지 즐겨찾기