[Java / 자바] Jquery 개발 팁

공부/Java  2015.07.06 09:00
안녕하세요 명월입니다.

저번 포스팅까지 Javascript, Jquery의 프로그래밍에 대해서 공부했습니다. 이번 포스팅에서는 실제 프로그래밍에서 도움이 될만한 팁을 준비했습니다.

(1) console.log
Console.log함수는 실제 프로그램에 이 함수를 넣으면 동작에 영향이 가는 함수가 아닙니다. firefox 웹 프로우저에서 디버깅을 할 시 console.log 함수에 넣은 값이 어떤 같인지 확인하기 위한 함수 입니다. 실제로 버그를 잡을 때 많이 사용되는 함수 중 하나입니다.

console log


위 이미지를 확인 하면 Setup1 버튼을 클릭 할 때 ajax가 불려지고 데이터 반환 값을 console.log에 넣고 실행해 봤습니다.

console log


Firefox 브라우저에서 개발자 모드로 전환(F12)을 하고 콘솔 탭에 들어가면 위와 같이 데이터를 확인 할 수 있습니다.

(2) 자바스크립트의 디버깅
의외로 많은 분들이 웹 클라이언트 프로그램을 개발 하면서 자바스크립트 디버깅 모드를 모르는 사람이 많습니다. 단순 alert 창을 이용해서 값을 확인하면서 개발하는 사람들이 많습니다.

console debug


FireFox 브라우저에서 개발자 모드로 전환(F12)을 하고 스크립트 항목에 들어갑니다. 여기에서 값을 확인하고 싶은 곳에 브레이크 포인트를 찍고 해당 웹 페이지를 다시 실행하겠습니다.

console debug


일반 프로그램처럼 디버깅이 되는 모습입니다. 개발을 할 때 디버깅이 전부는 아니지만 흐름에 대한 에러와 값을 계산해 가면서 프로그래밍을 하는면 버그를 찾는데도 도움이 되고 전체적인 사양을 확인 할 수 있으니 더 전체를 보고 그래도 에러를 못찾으면 디버깅을 하는 것이 이상적인 개발방법이네요..


댓글 0개가 달렸습니다.
댓글쓰기