본문 바로가기

프론트엔드/JAVASCRIPT

[Javascript] Javascript 콘솔(console), 주석 처리

 

/* 바닐라 자바스크립트 - 고승원

책으로 학습하고 정리한 내용입니다. */

 

INDEX


  • 콘솔(console), 개발자 도구 여는 법
  • 주석처리

 

콘솔(console)


- 웹 프로그램 개발 시 디버깅 작업은 매우 중요하다 이때 쓰이는 것이 콘솔(console)이다.

 

- 코드의 에러 해결, 전체적인 흐름 파악, 정상 동작 여부 등을 확인할 때 쓰인다.

 

- 웹 개발 시 개발자 도구를 많이 활용하게 되고 여기에서 그 기능(콘솔)을 제공한다.

 

- 대표적인 확인 방식은 console.log()를 활용하여 출력하고 싶은 숫자, 문자 등을 기입하는 것이다. 

 

- 잘못된 예약어, 선언되지 않은 변수를 사용했을 경우에 에러를 콘솔 창으로 확인이 가능하다.

 

 

console.log로 데이터 타입 등을 확인

 

 

* 예약어를 변수로 사용했을 때 콘솔창에 Uncaught SyntaxError: Unexpected token '='이라는 에러 메시지를 확인 가능하다, 에러 메시지 우측에 몇 번 줄 코드에서 에러가 발생했는지도 확인이 가능

 

예약어를 변수로 사용 했을 때 콘솔창에서 에러를 확인

 

개발자 도구 여는 법

 

- F12 / ctrl + shift + i(윈도우) / cmd + option + i(맥) 키로 실행

 

- 마우스 우클릭 후 속성 중 검사를 선택 

 

 

마우스 우클릭으로 개발자 도구 확인하기
개발자 도구 들어가는 법, 마우스 우클릭

 

 

개발자 도구 중 console 항목 선택
개발자 도구 중 console항목 선택

 

 

 

주석처리


- 주석은 프로그래밍 시 작성한 코드에 대한 설명 또는 일부 코드에 실행을 잠시 막기 위해서 사용한다.

 

- 주석처리를 할 경우 가독성, 유지보수성 등이 좋아지며 다른 사람과의 협업을 할 때 코드 분석 시간을 단축할 수 있다.

 

- 실행을 잠시 막아 에러를 추적하는데 사용한다.

 

 

주석 처리 방법   

 

- 일반 주석(한줄 단위 주석, //)

  -> 단축키 사용 법 : 주석 처리할 문장에 커서를 놓거나 여러 문장 드래그하여 선택 후 ctrl + /(윈도우), cmd + /(맥)

 

- 묶음 주석(여러줄 주석, /* */)

  -> 단축키 사용 법 : 주석 처리할 문장에 커서를 놓거나 여러 문장 드래그하여 선택 후 shift + alt + a(윈도우), shift + option + a(맥)

 

 

주석 처리 하는 방법
주석 처리 하는방법