패스트캠퍼스 - Web APIs : console

clouood·2024년 4월 2일

패스트캠퍼스

목록 보기
18/18

console

1. console.log(document.body)

내가 알고 있는 HTML 구조가 그대로 출력됨.

2. console.warn(document.body)

경고 메시지가 뜸.

3. console.error(document.body)

에러 메시지가 뜸.

4. console.dir(document.body)

HTML 구조를 그대로 출력하는 것이 아니고 객체 데이터처럼 출력함. body에서 사용할 수 있는 속성, 메소드를 확인할 수 있음.

5. console.count()

6. console.countReset()

만약, count 메소드를 실행할 때 아무런 이름도 추가하지 않는다면,

이렇게 출력된다.

7. console.time()

8. console.timeEnd()

time이라는 메소드로 특정 부분부터 시작해서 timeEnd라는 메소드로 언제 그 타이머를 종료할 것인지를 설정해, 그 사이에 있는 특정 로직이 얼마나 시간을 소요해서 처리되는지를 확인할 수 있음.

9. console.trace()

trace 메소드가 실행되기까지 어떠한 함수들이 실행되어 도달되었는지를 확인할 수 있음.

a 함수가 실행되는 것은 주변에 아무 함수도 없으므로 익명의 함수로부터 실행, b 함수는 a 함수 내부에서 실행, c 함수는 b 함수 내부에서 실행된다. 어떤 로직을 함수 범위로 분석해야될 때 유용.

10. console.clear()

console.clear() 메소드를 사용하면,

모두 삭제됨.

11. console 서식 문자 치환

이렇게 3개의 변수를 둠.

console.log('Tottenham, led by %s, has a game %s, a, b);

첫 번째 %s에는 두 번째 인수가 들어가고, 두 번째 %s에는 세 번째 인수가 들어감. 물론 더 넣을 수도 있음.

기본적인 서식 문자는 서식 문자가 작성된 순서대로 그 뒤쪽에 있는 인수의 데이터들이 차례대로 들어갈 수 있는 구조를 가짐

console.log('%o is Tottenham!', c);

객체로 잘 출력됨. prototype도 object.

서식 문자가 치환될 수 있는 데이터를 순서에 맞게 같은 개수만큼 제공해야 함.

profile
雲外蒼天

0개의 댓글