본문 바로가기
D.evelop/JavaScript

[TIL]Javascript - Console.log로 간단한 디버깅해보기

by Danne 2021. 8. 10.

 Console.log() 

javascript를 익히면서 console.log()를 자주 사용하는 것을 보게 된다. 오늘은 그 콘솔 로그를 손에 익혀보기로 했다.

 

✅ 왜 사용하나요?

실무에서 경험한 바에 의하면

console.log()데이터를확인하기 위해 사용한다. 그리고 그 데이터를 확인하며 디버깅을 해나간다.

 

어떻게 사용하나요?

console.log('Hello, Dan:d World!');

결과)

 

좀 더 다양한 형식의 데이터를 사용해 호출해보면

function hello(){
  console.log('Hello, World!');
}

function dan(){
  let myName = 'DAN' // 문자
  let myNum = 3;     // 숫자
  let myCity = ['Seoul', ['Busan', 'Paris']]; // 배열 
  console.log(myName);
  console.log(myNum);
  console.log(myCity);
}

hello();
dan();

결과)

 

로그만 표시하나요?

console.log의 console도 하나의 객체다.

log뿐 아닌 다양한 매서들을 사용할 수 있다.

 

info, warn, error는 log와 비슷한 작동을 한다. 상황에 따라 적절히 사용하면 되지만 log로 충분하다고함.

console.log();  
console.info(); 
console.warn(); 
console.error();

그 외 더 다양한 콘솔 메서드들이 존재함

MDN Web Docs 참고 : https://developer.mozilla.org/ko/docs/Web/API/Console 

 

 

디버깅 시 alert도 사용했던 것에 대해 간략히 기록해 보자.

 Alert() 

alert의 경우 대화 상자로 출력되며 출력 되는 중에는 페이지가 정지되어있다. 

하지만 루프를 잘못 태웠을 때, 대화창이 무한으로 계속 뜨는 단점있었다.

console과 같은 상세한 데이터를 확인 할 수 없었다.

alert('hello Dan:d world');

alert은 경고, 확인 등의 절차적인 부분에서 유용하게 사용된다.

 

 

 

반응형

댓글