알고쓰면 더 좋은 자바스크립트 Console (with 드림코딩)

드림코딩 엘리님의 유튜브를 보고 기억하기위해 적어두는 TIL

Console 제대로 알고쓰기

 

콘솔로그의 기본 로그레벨에 따른 method

const cat = {type : '😺' name : 'Ori', owner : {name: 'didue'}}
console.log('logging' , cat);

//log level
console.log();   //개발 출력 => 배포시 삭제
console.info();  //정보 출력 => 배포시 삭제 
console.warn();  //경보 
console.error(); //에러! 시스템 에러

특정 조건이 일치할 때만 로그를 출력하고 싶을 경우

//assert 
console.assert(2 === 3, 'not samae!')
console.assert(2 === 2, 'same!')

Object를 더 스마트하게 가독성있게 출력하기

//print object
console.table(cat);
console.dir(dog, {color: false, depth : 0});

수행시간 측정 하기

console.time('for loop');
//working
console.timeEnd('for loop');

//output : for loop 0.053ms

스마트하게 카운팅 하기

//old
let count = 0;
function a(){
    count++;
}
a();
a();
a();
console.log(count);
count = 0;

//new
function a(){
    console.count('a function');
}
a();
a();
a();
console.countReset('a function');

함수 어디에서 호출했는지 tracing하기

function f1(){
    f2();
}
function f2(){
    f3();
}
function f3(){
    console.trace();
}
f1();

출처

- MDN : Console https://developer.mozilla.org/ko/docs/Web/API/Console

- Node.js : Console https://nodejs.org/dist/latest-v14.x/docs/api/console.html

- 드림코딩 유튜브 https://youtu.be/KxsVV5jbJe4