WEB 웹/JAVASCRIPT
14 Must Know Dev Tools Tricks (javascript30 - 9)
KIMSG
2017. 11. 22. 13:22
콘솔창에서 console.log() 말고 다른것도 좀 찍어보기.
Console API : https://developer.mozilla.org/ko/docs/Web/API/Console
콘솔에서 가장 많이 사용되는 기능은 데이터와 텍스트를 출력하는 것이다. console.log(), console.info(), console.warn(), console.error() 와 같은 출력 메소드를 이용하여 4종류의 출력 카테고리를 지정할 수 있다. 각각의 출력 결과물들은 로그에 다른 형식으로 스타일링되며, 브라우저에서 제공하는 필터링 기능을 이용하여 관심있는 종류의 출력만 확인할 수 있다.
console.log() :
obj1
... objN
msg
0개 이상의 치환 문자열(ex:%d, %s)들을 포함하는 자바스크립트 문자열입니다.
subst1
... substN
msg
내의 치환 문자열들을 치환할 자바스크립트 객체들입니다. 이것은 추가적인 출력 형식 제어권을 제공합니다.%를 사용하여 변수와 같은 항목들을 대입할 수 있다.
Using string substitutions
Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6) introduced support for string substitutions. When passing a string to one of the console object's methods that accepts a string, you may use these substitution strings:
Substitution string |
Description |
%o or %O |
Outputs a JavaScript object. Clicking the object name opens more information about it in the inspector. |
%d or %i |
Outputs an integer. Number formatting is supported, for example console.log("Foo %.2d", 1.1) will output the number as two significant figures with a leading 0: Foo 01
|
%s |
Outputs a string. |
%f |
Outputs a floating-point value. Formatting is supported, for example console.log("Foo %.2f", 1.1) will output the number to 2 decimal places: Foo 1.10
|
Styling console output
You can use the "%c" directive to apply a CSS style to console output:
선언한 뒷 부분만 sytle을 넣어 줄 수 있다.
나머지도 하나씩 실습을 해보는 편이 이해하는데 더 빠를 것 같다.