Ext.js-Ext JS 코드 디버깅

모든 JavaScript 코드는 다음을 사용하여 디버깅 할 수 있습니다. alert() 상자 또는 console.log() 또는 디버거에서 디버그 포인터를 사용합니다.

경고 상자

흐름 또는 변수 값을 확인하려는 코드에 경고 상자를 배치합니다. 예를 들어, alert ( 'message to show'+ variable);

개발 / 디버깅 도구

디버거는 모든 개발자가 개발하는 동안 코드의 문제와 오류를 확인하는 가장 중요한 도구입니다.

Ext JS는 JavaScript 프레임 워크이므로 다른 브라우저에서 제공하거나 특정 브라우저에 특정 된 개발자 도구를 사용하여 쉽게 디버깅 할 수 있습니다. 모든 주요 브라우저에는 JavaScript 코드를 테스트하고 디버깅하는 데 사용할 수있는 개발자 도구가 있습니다.

인기있는 디버거는 IE 용 IE 개발 도구, Firefox 용 Firebug 및 Chrome 브라우저 용 Chrome 개발 도구입니다.

크롬 디버거는 크롬 브라우저와 함께 제공되지만, 파이어 폭스는 파이어 폭스와 함께 패키지로 제공되지 않으므로 특별히 설치해야합니다.

다음은 firefox 브라우저 용 firebug를 설치하는 링크입니다. http://getfirebug.com

Windows OS에서 개발 도구를 여는 단축키는 F12 키보드 키입니다.

디버거에서 JS 코드 디버깅

JavaScript 코드를 디버깅하는 방법에는 두 가지가 있습니다.

첫 번째 방법은 console.log() 코드에서 로그 값을 확인하면 개발 도구의 콘솔에 인쇄됩니다.
두 번째 방법은 개발 도구에서 중단 점을 사용하는 것입니다. 다음은 과정입니다.
- 스크립트 태그 아래의 사용 가능한 모든 스크립트에서 파일을 엽니 다.
- 이제 디버그하려는 라인에 중단 점을 배치하십시오.
- 브라우저에서 애플리케이션을 실행하십시오.
- 이제 코드 흐름이이 줄에 도달 할 때마다 코드가 끊어지고 사용자가 F6 (코드의 다음 줄로 이동), F7 (함수 내부로 이동) 또는 F8 (이동) 키로 코드를 실행할 때까지 그대로 유지됩니다. 디버그하려는 흐름에 따라 다음 중단 점으로 이동하거나 중단 점이 더 이상없는 경우 코드를 실행합니다.
- 값을 보려는 변수 또는 함수를 선택할 수 있습니다.
- 콘솔을 사용하여 값을 확인하거나 브라우저 자체의 일부 변경 사항을 확인할 수 있습니다.