Chrome의 코드에서 JavaScript 중단 점을 설정하는 방법은 무엇입니까?

Chrome의 코드에서 JavaScript 중단 점을 설정하는 방법은 무엇입니까?

---

Chrome 디버거가 코드를 통해 줄을 끊 거나 다른 종류의 주석 태그를 사용 하도록 강제하고 싶습니다 console.break().

---

debugger;코드 내에서 사용할 수 있습니다 . 개발자 콘솔이 열려 있으면 실행이 중단됩니다. 방화범에서도 작동합니다.

---

버튼 클릭 리스너를 설정하고 debugger;

예

$("#myBtn").click(function() {
 debugger;   
});

데모

http://jsfiddle.net/hBCH5/

자바 스크립트 디버깅에 대한 리소스

• http://www.laurencegellert.com/2012/05/the-three-ways-of-setting-breakpoints-in-javascript/
• http://berzniz.com/post/78260747646/5-javascript-debugging-tips-youll-start-using-today

---

debug(function),를 사용 하여 function가 호출 될 때 중단 할 수도 있습니다 .

명령 줄 API 참조 : 디버그

---

다른 사람들이 이미 말했듯 debugger;이 갈 길입니다. 함수 호출 직전에 중단 점을 설정하고 제거하기 위해 브라우저의 명령 줄에서 사용할 수있는 작은 스크립트를 작성했습니다. http://andrijac.github.io/blog/2014/01/31/javascript-breakpoint/

---

"스크립트"탭에서 코드가있는 위치로 이동하십시오. 줄 번호 왼쪽에서 클릭합니다. 중단 점을 설정합니다.

스크린 샷 :

그러면 오른쪽 탭에서 중단 점을 추적 할 수 있습니다 (스크린 샷 참조).

---

debugger EcmaScript에 의해 예약 된 키워드이며 ES5 이후 선택적 의미가 제공됩니다.

그 결과,도 파이어 폭스와 Node.js를 만 크롬에없는 사용 할 수 있지만 통해node debug myscript.js .

표준은 말합니다 :

통사론

DebuggerStatement :
    debugger ;

의미론

DebuggerStatement 프로덕션을 평가하면 구현이 디버거에서 실행될 때 중단 점이 발생할 수 있습니다. 디버거가 없거나 활성 상태가 아니면이 문은 관찰 가능한 효과가 없습니다.

프로덕션 DebuggerStatement : 디버거; 다음과 같이 평가됩니다.

1. 구현 정의 디버깅 기능이 사용 가능하고 활성화 된 경우
   1. 구현 정의 디버깅 작업을 수행합니다.
   2. 결과를 구현 정의 완료 값으로 설정합니다.
2. 그밖에
   1. 결과를 (일반, 비어 있음, 비어 있음)으로 둡니다.
3. 결과를 반환합니다.

ES6에는 변경 사항이 없습니다.

---

가능하며이를 원하는 데는 여러 가지 이유가 있습니다. 예를 들어 페이지로드 시작 부분에 가까운 자바 스크립트 무한 루프를 디버깅하면 Chrome 개발자 도구 집합 (또는 방화범)이 올바르게로드되지 않습니다.

섹션 2 참조

http://www.laurencegellert.com/2012/05/the-three-ways-of-setting-breakpoints-in-javascript/

또는 필요한 테스트 지점의 코드에 디버거라는 단어가 포함 된 행을 추가하십시오.

---

중단 점 :-

중단 점은 실행을 중지하고 JavaScript 값을 검사 할 수 있습니다.

값을 검사 한 후 코드 실행을 재개 할 수 있습니다 (일반적으로 재생 버튼 사용).

디버거 :-

디버거; 자바 스크립트 실행을 중지하고 디버깅 기능을 호출합니다.

디버거 문은 실행을 일시 중단하지만 파일을 닫거나 변수를 지우지는 않습니다.

Example:-
function checkBuggyStuff() {
  debugger; // do buggy stuff to examine.
};

---

debug(functionName)디버그 기능도 설정할 수 있습니다 .

https://developers.google.com/web/tools/chrome-devtools/javascript/breakpoints#function

---

JavaScript 코드를 디버깅하는 방법에는 여러 가지가 있습니다. 다음 두 가지 접근 방식은 코드를 통해 JavaScript를 디버깅하는 데 널리 사용됩니다.

1. console.log()브라우저 콘솔에서 값을 인쇄하는 데 사용 합니다. (이것은 코드의 특정 지점에서 값을 이해하는 데 도움이됩니다.)

2. 디버거 키워드. debugger;디버깅하려는 위치에 추가 하고 브라우저의 개발자 콘솔을 열고 소스 탭으로 이동합니다.

JavaScript 코드를 디버깅하는 더 많은 도구와 방법은 W3School이이 링크에 제공 합니다.

참고 URL : https://stackoverflow.com/questions/10050465/how-to-set-a-javascript-breakpoint-from-code-in-chrome