blog
discuss
contribute
documentation

JavaScript 커맨드라인

커맨드라인은 프로그래밍 도구들중 가장 오래된 도구중의 하나 입니다. Firebug는 JavaScript를 위한 멋진 커맨드라인을 제공합니다.

일을 저질러라

DOM에 대해서 알고 있다면, 때때로 Javascript를 이것저것 실행해보는것보다 빠른 대답을 얻는 방법은 없습니다. Firebug의 커맨드 라인은 어떤 JavaScript든지 엔터를 누르면 그것을 실행합니다. 그것이 페이지에 일부분이었던 것처럼 실행을 하고, 리턴값을 콘솔에서 보여줍니다.

자동완성

tab키를 사용해서 객체 속성과 변수의 이름을 완전히 적을 수 있습니다. 사용가능한 값들의 세트를 순환해서 이동하고, shift-tab을 사용하면 이전값으로 이동합니다.

자동완성은 다양하게 작동됩니다. 어떤것도 타이핑하지 않고 tab키를 누르면 전역변수를 순환하여 보여줍니다. "document.b"를 타이핑 한후 tab키를 누르면 "b"로 시작하는 모든 속성값들을 순환하여 이동합니다. "document.getElementsByTagName('a')[0]."과 같은 표현식에서 tab키를 사용하면 문서에서 첫번째 링크에 해당하는 모든 속성값들을 보여준다.

크게 만들기

한줄이 당신이 느끼기에 조금 비좁더라도 당황하지마세요. Firebug의 커맨드라인은 더 큰 텍스트 에디터가 되도록 확장이 가능합니다. 한줄짜리 대신에 전체크기의 스크립트를 경험할 수 있습니다.

똑똑한 붙여넣기

JavaScript를 에디터에 작성하고 곧바로 그것을 테스트해보고 싶습니다. 이럴때는 단지 커맨드라인으로 붙여넣기 하면 됩니다. 1줄 이상이라면, Firebug는 당신의 스크립트가 실행될수 있도록 큰 텍스트 에디터를 자동으로 열것입니다.

책갈피 천국

책갈피 만들기는 이보다 더 쉬울수가 없습니다. 에디터에서 "Copy" 버튼을 클릭하면 스크립트는 클립보드에 책갈피할수 있는 형태로 복사될 것입니다.

클릭을 잊지마세요

전통적인 커맨드라인과 달리, 각각의 명령에 대한 출력은 정적인 텍스트가 아니라, 하이퍼텍스트입니다. 콘솔에서 출력된 모든 객체들은 하이퍼링크가 있으며 그것을 클릭하면 해당하는 Firebug의 탭으로 이동해서 그것을 가리킵니다.

우측 클릭을 잊지마세요

콘텍스트 메뉴는 재미있는 기능들을 포함하고 있습니다. 다른 여러 종류들의 객체는 각자 자신들의 콘텍스트 메뉴를 가지고 있습니다, 그렇기 때문에 Firebug 콘솔에서 객체로 가는 링크를 보았을때, 우측버튼 클릭을 해보세요.

가운데 클릭을 잊지마라

탭브라우징과 가운데 클릭의 마법을 아직 알지 못한다면 지금이 그것을 배울 좋은 기회입니다. Firefox 브라우저에서 링크에 마우스를 가져다 대고 가운데 클릭을 하면, 새탭에서 해당 URL또는 파일이 열립니다.

마우스에 가운데 버튼이 없을 경우에는, 컨트롤 키를 누른채로 (또는 맥에서 command) 클릭을 하면 같은 효과가 나타납니다.

가리키고 명령하고

지시기를 사용해서 HTML 엘리먼트를 찾은 후에, 커맨드라인을 사용하여 그것을 조정하고 싶을때가 있습니다. Firebug는 그것을 쉽게 가능하게 합니다; "$1" 변수를 사용하면 마지막으로 가리킨 엘리먼트를 참조하며, 또한 "$2"는 그 전의 것을 참조합니다.

마찬가지로, "$$1" 와 "$$2"는 DOM 탭에서 선택했던 객체들의 참조를 나타냅니다.

명령하고 가리키고

커맨드라인은 다른 탭의 객체를 가리키는데 사용하기에 훌륭합니다. 콘솔에서 결과를 보기위해 엔터를 클릭하는 것 대신에, Shift+Enter를 누르면 결과값을 DOM탭, HTML탭, Script탭, 또는 CSS탭으로 이동해 가리킵니다.