1. 정보를 표시하는 명령
코드 사본은 다음과 같습니다.
<! doctype html>
<html>
<헤드>
<title> 공통 콘솔 명령 </title>
<meta http-equiv = "content-type"content = "text /html; charset = utf-8" />
</head>
<body>
<script type = "text/javaScript">
Console.log ( 'Hello');
console.info ( '정보');
Console.error ( '오류');
Console.warn ( '경고');
</스크립트>
</body>
</html>
가장 일반적으로 사용되는 Console.log는 Console.log입니다.
둘 : 자리 표시 자
위의 콘솔 농도는 Printf 자리 표시 자 형식을 지원합니다. 지원되는 자리 표시자는 문자 (%s), 정수 (%d 또는%i), 부동 소수점 번호 (%f) 및 물체 (%o)입니다.
코드 사본은 다음과 같습니다.
<script type = "text/javaScript">
Console.log ( " %d 년 %d 달 %d 일", 2011, 3, 26);
</스크립트>
효과:
3. 정보 그룹화
코드 사본은 다음과 같습니다.
<! doctype html>
<html>
<헤드>
<title> 공통 콘솔 명령 </title>
<meta http-equiv = "content-type"content = "text /html; charset = utf-8" />
</head>
<body>
<script type = "text/javaScript">
Console.group ( "첫 번째 정보 그룹");
Console.log ( "첫 번째 그룹 첫 번째 : my xx (// www.vevb.com)");
Console.log ( "첫 번째 그룹 2 : xxx (http://vevb.com)");
Console.groupend ();
Console.group ( "두 번째 정보 그룹");
Console.log ( "두 번째 그룹 1 : 프로그램 애호가 QQ 그룹 : 80535344");
Console.log ( "두 번째 그룹 2 : 가입에 오신 것을 환영합니다");
Console.groupend ();
</스크립트>
</body>
</html>
효과:
4. 객체의 정보를 봅니다
Console.dir ()는 객체의 모든 속성과 메소드를 표시 할 수 있습니다.
코드 사본은 다음과 같습니다.
<script type = "text/javaScript">
var info = {
블로그 : "// www.vevb.com",
QQGroup : 80535344,
메시지 : "프로그램 애호가는 당신이 참여하도록 환영합니다"
};
Console.dir (정보);
</스크립트>
효과:
5. 노드의 내용을 표시합니다
Console.dirxml ()는 웹 페이지 노드에 포함 된 HTML/XML 코드를 표시하는 데 사용됩니다.
코드 사본은 다음과 같습니다.
<! doctype html>
<html>
<헤드>
<title> 공통 콘솔 명령 </title>
<meta http-equiv = "content-type"content = "text /html; charset = utf-8" />
</head>
<body>
<div id = "info">
<H3> 내 블로그 : www.ido321.com </h3>
<p> 프로그램 애호가 : 259280570, 가입에 오신 것을 환영합니다 </p>
</div>
<script type = "text/javaScript">
var info = document.getElementById ( 'info');
Console.dirxml (정보);
</스크립트>
</body>
</html>
효과:
6. 변수가 참인지 결정하십시오
Console.assert ()는 표현식 또는 변수가 True인지 결정하는 데 사용됩니다. 결과가 아니오 인 경우 해당 메시지가 콘솔에서 출력되고 예외가 발생합니다.
코드 사본은 다음과 같습니다.
<script type = "text/javaScript">
var result = 1;
Console.Assert (결과);
var 년 = 2014;
Console.Assert (Year == 2018);
</스크립트>
1은 0이 아닌 값이며 사실입니다. 두 번째 판단은 거짓이며 콘솔에 오류 메시지가 표시됩니다.
7. 함수의 호출 트랙을 추적하십시오.
Console.trace ()는 함수의 통화 트랙을 추적하는 데 사용됩니다.
코드 사본은 다음과 같습니다.
<script type = "text/javaScript">
/*함수가 호출되는 방법, console.trace () 메소드를 추가하기 만하면*/
함수 추가 (a, b) {
Console.Trace ();
A+B를 반환합니다.
}
var x = add3 (1,1);
함수 add3 (a, b) {return add2 (a, b);}
함수 add2 (a, b) {return add1 (a, b);}
함수 add1 (a, b) {return add (a, b);}
</스크립트>
콘솔 출력 정보 :
8. 타이밍 기능
console.time () 및 console.timeend ()는 코드의 실행 시간을 표시하는 데 사용됩니다.
코드 사본은 다음과 같습니다.
<script type = "text/javaScript">
Console.Time ( "콘솔 타이머 1");
for (var i = 0; i <1000; i ++) {
for (var j = 0; j <1000; j ++) {}
}
Console.TimeEnd ( "콘솔 타이머 1");
</스크립트>
실행 시간은 38.84ms입니다
9. Console.profile ()의 성능 분석
성능 분석 (Profiler)은 프로그램의 각 부분의 실행 시간을 분석하고 병목 현상을 찾는 것입니다. 사용 된 방법은 console.profile ()입니다.
코드 사본은 다음과 같습니다.
<script type = "text/javaScript">
all () {
경고 (11);
for (var i = 0; i <10; i ++) {
Funca (1000);
}
funcb (10000);
}
기능 funca (count) {
for (var i = 0; i <count; i ++) {}
}
함수 funcb (count) {
for (var i = 0; i <count; i ++) {}
}
Console.profile ( 'Performance Analyzer');
모두();
Console.profileend ();
</스크립트>
LZ 테스트 중에 모든 ()에 경고가 추가되지 않았으며 제어 막대가 출력되지 않았다고 설명하겠습니다. 추가 후 성능 분석 테이블이있었습니다. 그 이유는 아직 명확하지 않았습니다. 알고 있다면 댓글을 달 수 있습니다.