[JS] console 메서드

console.log()

: 메시지와 변수의 값을 콘솔에 출력

let user = 'Alice';
console.log('Hello,', user); // 출력: Hello, Alice

 

 

 

console.clear()

: 콘솔의 내용을 지움

console.log('This will be cleared');
console.clear(); // 콘솔이 비워집니다.
console.log('Console has been cleared');

 

 

 

console.assert(condition, message)

: 조건이 false일 때만 메시지를 출력

• 반드시 === 이후의 값을 반환하지 않으면 에러 뜨도록 테스트
• = TDD (Test Driven Development)

console.assert(rem('25px') === '1.5625rem')

 

 

 

console.dir(obj)

: 객체의 모든 속성을 보여줌

• 객체의 프로퍼티를 확장 가능한 트리 형태로 표시

let person = { name: 'John', age: 30, job: 'Developer' };

console.dir(person); // 객체의 속성이 트리 형태로 표시

 

 

 

console.table()

: 데이터를 표 형태로 그림

let users = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 35 }
];

console.table(users);

 

 

 

console.error()

: 에러 메시지를 출력

console.error('Something went wrong!'); // Something went wrong!

 

 

 

console.info()

: 정보 메시지를 출력

console.info('This is an informational message.'); // This is an informational message.

 

 

 

 

console.time(label)

: label이라는 이름으로 타이머 시작

• console.timeEnd(label)과 함께 사용하여 시간 측정

console.time('Timer');

console.timeEnd('Timer'); // 타이머 종료 및 경과 시간 출력

 

 

 

console.timeEnd(label)

: console.time(label)로 시작한 타이머를 종료하고 경과 시간 출력

console.time('Processing');

setTimeout(() => {
  console.timeEnd('Processing'); // 경과 시간이 출력
}, 1000);

 

 

 

console.timeLog(label, ...)

: 현재까지의 경과 시간을 로그에 출력

• 타이머를 종료하지 않고 중간 결과를 출력할 때 사용

console.time('Process');

setTimeout(() => {
  console.timeLog('Process', 'Halfway through'); // 경과 시간과 메시지 출력
  
  setTimeout(() => {
    console.timeEnd('Process'); // 타이머 종료 및 최종 경과 시간 출력
  }, 1000);
}, 1000);

 

 

 

 

console.group(label)

: 로그 메시지를 그룹화 한다.

 

 

console. groupEnd(label)

: 가장 최근에 열려 있는 그룹을 닫는다.

• console.group과 함께 사용
• 닫힌 그룹의 범위까지의 로그만 그룹화

console.log("This is the outer level");
console.group();
console.log("Level 2");
console.group();
console.log("Level 3");
console.warn("More of level 3");
console.groupEnd();
console.log("Back to level 2");
console.groupEnd();
console.log("Back to the outer level");

 

 

---

 

console - Web API | MDN

 

 

console.clear() - Web API | MDN

 

console.assert() - Web API | MDN

 

 

console: log() static method - Web API | MDN

 

 

console.table() - Web API | MDN

 

console.dir() - Web API | MDN

 

console.warn() - Web API | MDN

 

console: info() static method - Web APIs | MDN

 

console.timeEnd() - Web API | MDN

 

console.timeLog() - Web API | MDN

 

console.group() - Web API | MDN

 

console.groupEnd() - Web API | MDN