티스토리 뷰

JavaScript/JS

console API 란?

유니엘. 2022. 5. 20. 22:55
console이란

JS를 실행 시, 실시간으로 에러 메시지 혹은 정의한 어떤 것들을 출력해주는 기능을 말합니다. 가장 많이 사용하는 대표적인 예는 console.log가 있어요.

 

console API란

콘솔 API는 개발자가 사용할 수 있는 디버깅 기능을 제공하는데, 상단에서 언급한 변수의 값을 기록해주는 console.log도 그 예 중에 하나이며, 이 뿐만 아니라 다양한 메소드로 디버깅을 도와줍니다.

동작 방식은 브라우저마다 조금씩 다른 부분이 있지만 console API 명세에 일관적인 동작 방식이 정의되어 있어 최신 브라우저는 조금의 차이는 있겠지만 거의 같은 동작을 따르고 있습니다. 

 

console methods

1. console.assert()
첫 번째 매개변수가 false인 경우 메시지와 스택 추적 출력, true인 경우 아무 액션도 취하지 않음.

console.assert(number % 2 === 0, {number, errorMsg});

 

2. console.clear()
콘솔 내용 지우기

3. console.count()
메서드 호출 횟수 카운트

console.count();
// "default: 카운트 횟수"
console.count("alice");
// "alice: 3"
// 라벨에 지정된 카운트 호출 수

4. console.countReset()
라벨 횟수 초기화

5. console.debug()
debug 중요도로 메세지 출력

6. console.dir()
객체의 속성 목록

7. console.dirxml
객체를 XML/HTML 요소로 표시하며, 그렇지 않을 경우 JS 객체의 형태로 표시

8. console.error()
오류 메시지 출력
* console.exception()은 error()의 별칭으로 Deprecated

9. console.group()
모든 출력을 한 단계 들여쓰기로 보여줌, 그룹을 나오려면 groupEnd() 호출 필요.

10. console.groupCollapsed()
group()과 비슷하지만 처음에 접힌 상태로 그려짐. 

11. console.info()
정보 메시지 출력

12. console.log()
일반 메시지 출력

13. console.profile()
브라우저 내장 프로파일러 실행, 프로파일러를 멈추기 위해서는 console.profileEnd() 호출 필요

14. console.table()
표 형태의 데이터를 그려줌

15. console.time(이름)
주어진 이름의 타이머 실행. 하나의 페이지에서 최대 10,000개의 타이머 동시 실행 가능. 타이머를 멈추고, 소요 시간을 출력하기 위해서는 console.timeEnd() 호출 필요. console.timeStamp()로 브라우저의 타임라인에 마커를 추가할 수 있음 (일부에서 제한된 기능)

16. console.trace()
스택 추적 출력

17. console.warn()
경고 메시지 출력

* console.log() / console.info() / console.warn() / console.error() 메서드를 사용해 중요도를 나눌 수 있으며, 각각의 스타일이 조금씩 다름. 콘솔창에서 중요도 필터링 가능

* 각각의 메세지는 문자열 치환 가능.

  • 객체 : %o
  • 정수 : %d || %i
  • 문자 : %s
  • 부동 소수점 : %f

* %c 명령을 통해 스타일 적용 가능

console.log("This is %cMy stylish message",
"color: yellow; font-style: italic; background-color: blue;padding: 2px");

여러번 사용 가능

console.log("Multiple styles: %cred %corange",
"color: red", "color: orange", "Additional unformatted message");

 

 

 

https://developer.mozilla.org/ko/docs/Web/API/Console_API

 

Console API - Web API | MDN

Console API는 코드의 특정 지점에서 값이나 변수를 기록하고, 작업의 소요 시간을 알아내는 등 개발자가 사용할 수 있는 디버깅 기능을 제공합니다.

developer.mozilla.org

 

공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/09   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
글 보관함