본문 바로가기
Front 공부/Javascript

1-4. HTML과 JS : ③ 콘솔 (console)

by erase-jeong 2023. 10. 16.

콘솔 (Console)

첫 강의에서 했던 것처럼 웹 브라우저에서 오른쪽 버튼 > 검사 를 누르면 뜨는 창을 잘 살펴보면 Console이라는 이름의 탭이 보일 겁니다. 이 콘솔을 이용하면 파일을 만들지 않고도 바로 Javascript 코드를 실행할 수 있습니다.

 

예를 들어서, 어떤 문자열(Hello, World!)의 길이를 알고 싶다고 해 봅시다. 이 때 바로 이 콘솔 창에서 다음과 같이 치고 엔터를 누르면 문자열의 길이를 현재 페이지에서 바로 경고창으로 출력할 수 있습니다.

alert('Hello, World!'.length)

즉, 콘솔을 통해서 입력된 코드는 현재 페이지에서 즉석으로 실행되는 것입니다.

 

Q.  콘솔을 어떻게 활용?

예를 들어서 여러분이 페이스북에 댓글을 남기는 이벤트를 개최

이 때 아주 많은 참가자들 중 당첨자를 뽑아야 하는데, 여기서 콘솔을 사용할 수 있습니다.

미리 짜 둔 Javascript코드를 콘솔 창에 적은 후 실행시키면 당첨자를 쉽게 뽑을 수 있겠죠.

 

즉,  콘솔을 이용하면 웹사이트에서 간단한 문제를 간편하게 Javascript를 실행시켜서 해결할 수 있는 있음

 

<아래는 콘솔 사용 예시>

 

콘솔창에 1+2를 입력하면 3을 출력해준다

 

강의 내용 캡쳐
alert('Hello, World!'.length)를 콘솔창에 입력하면 경고창으로 'Hello, World!' 의 길이를 반환해준다.

'Front 공부 > Javascript' 카테고리의 다른 글

1-3. HTML과 JS (이벤트)  (0) 2023.10.16
1장-2. HTML과 JS (script 태그)  (0) 2023.10.16
1장-1. Javascript의 역할  (0) 2023.10.16
자바스크립트의 시작  (1) 2023.10.16