JavaScript 기초(2) - 콘솔(console) 사용하기

우리가 자바스크립트를 실행하고자 할 때 매번 파일을 생성해야 한다면 이건 여간 귀찮은 일이 아니다. 그래서 이 포스팅에서는 파일을 만들지 않고도 자바스크립트 코드를 즉석에서 실행할 수 있는 방법에 대해서 설명하고자 한다.

브라우저 창에 마우스 커서를 두고 우클릭 - 검사(개발자 도구) 선택 - Console 탭을 선택 - 코드를 입력

활용해 보자!

아래와 같은 글이 있다고 친다 -_-;

"안녕, 나는 해이나야. 나는 지구라는 별에서 살고 있어. 지구는 물이 매우 풍족하고, 낮과 밤이 있으며, 매일 햇살과 바람을 느낄 수 있는 아름다운 별이야. 기회가 되면 꼭 놀러와. 우리 함께 놀자."

이 문장의 전체 글자수가 궁금하다면?

위 경로를 통해 console에 들어간다. 문자를 작은 따옴표(' ')로 감싸고, 뒤에 .length(글자수를 알려주는 명령어)를 입력한다. 그리고 이것을 다시 괄호(())로 감싸준 후, 맨 앞에 alert를 입력하고 엔터!

즉, 이렇게 입력하면 아래와 같은 알림창을 볼 수 있다.

참고로 콘솔(console)에서 실행시키는 자바스크립트는 해당 웹페이지를 대상으로 실행되며, 한번 실행했던 코드는 키보드의 위쪽 방향 화살표키(↑)를 누르면 다시 입력되어 히스토리 기능으로 사용할 수 있다.

+ 응용 TIP : 개발자 도구 element 에서 esc 키를 누르면 아래에 console 탭이 별도로 보인다. 다시 한번 더 esc 키를 누르면 사라진다.

※생활코딩 > WEB > WEB2 - JavaScript 강의를 통해 공부한 내용입니다.