1. คำสั่งเพื่อแสดงข้อมูล
การคัดลอกรหัสมีดังนี้:
<! doctype html>
<html>
<head>
<title> คำสั่งคอนโซลสามัญ </title>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
</head>
<body>
<script type = "text/javascript">
console.log ('สวัสดี');
console.info ('ข้อมูล');
console.error ('ข้อผิดพลาด');
console.warn ('คำเตือน');
</script>
</body>
</html>
console.log ที่ใช้กันมากที่สุดคือ console.log
สอง: ตัวยึดตำแหน่ง
ความเข้มข้นของคอนโซลข้างต้นรองรับรูปแบบตัวยึด printf ตัวยึดตำแหน่งที่รองรับคือ: ตัวละคร (%s) จำนวนเต็ม (%d หรือ%i), หมายเลขจุดลอยตัว (%f) และวัตถุ (%o)
การคัดลอกรหัสมีดังนี้:
<script type = "text/javascript">
console.log (" %d ปี %d เดือน %d วัน", 2011, 3, 26);
</script>
ผล:
3. การจัดกลุ่มข้อมูล
การคัดลอกรหัสมีดังนี้:
<! doctype html>
<html>
<head>
<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 Group: 80535344");
console.log ("กลุ่มที่สอง 2: ยินดีต้อนรับเข้าร่วม");
console.groupend ();
</script>
</body>
</html>
ผล:
4. ดูข้อมูลของวัตถุ
console.dir () สามารถแสดงคุณสมบัติและวิธีการทั้งหมดของวัตถุ
การคัดลอกรหัสมีดังนี้:
<script type = "text/javascript">
var info = {
บล็อก: "// www.vevb.com"
qqgroup: 80535344,
ข้อความ: "ผู้ที่ชื่นชอบโปรแกรมยินดีต้อนรับคุณเข้าร่วม"
-
console.dir (ข้อมูล);
</script>
ผล:
5. แสดงเนื้อหาของโหนด
console.dirxml () ใช้เพื่อแสดงรหัส HTML/XML ที่มีอยู่ในโหนดของหน้าเว็บ
การคัดลอกรหัสมีดังนี้:
<! doctype html>
<html>
<head>
<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 ('ข้อมูล');
console.dirxml (ข้อมูล);
</script>
</body>
</html>
ผล:
6. ตรวจสอบว่าตัวแปรเป็นจริงหรือไม่
console.assert () ใช้เพื่อตรวจสอบว่านิพจน์หรือตัวแปรเป็นจริง หากผลลัพธ์คือ NO ข้อความที่เกี่ยวข้องจะถูกส่งออกบนคอนโซลและมีการโยนข้อยกเว้น
การคัดลอกรหัสมีดังนี้:
<script type = "text/javascript">
var result = 1;
console.assert (ผลลัพธ์);
Var Year = 2014;
console.assert (ปี == 2018);
</script>
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);}
</script>
ข้อมูลเอาต์พุตคอนโซล:
8. ฟังก์ชั่นเวลา
console.time () และ console.timeend () ใช้เพื่อแสดงเวลาทำงานของรหัส
การคัดลอกรหัสมีดังนี้:
<script type = "text/javascript">
console.time ("คอนโซลจับเวลาหนึ่ง");
สำหรับ (var i = 0; i <1000; i ++) {
สำหรับ (var j = 0; j <1000; j ++) {}
-
console.timeend ("คอนโซลจับเวลาหนึ่ง");
</script>
เวลาทำงานคือ 38.84ms
9. การวิเคราะห์ประสิทธิภาพของคอนโซล. profile ()
การวิเคราะห์ประสิทธิภาพ (Profiler) คือการวิเคราะห์เวลาทำงานของแต่ละส่วนของโปรแกรมและค้นหาคอขวด วิธีที่ใช้คือคอนโซล profile ()
การคัดลอกรหัสมีดังนี้:
<script type = "text/javascript">
ฟังก์ชั่นทั้งหมด () {
การแจ้งเตือน (11);
สำหรับ (var i = 0; i <10; i ++) {
Funca (1,000);
-
funcb (10,000);
-
ฟังก์ชั่น funca (นับ) {
สำหรับ (var i = 0; i <count; i ++) {}
-
ฟังก์ชั่น funcb (นับ) {
สำหรับ (var i = 0; i <count; i ++) {}
-
console.profile ('เครื่องวิเคราะห์ประสิทธิภาพ');
ทั้งหมด();
console.profileend ();
</script>
ให้ฉันอธิบายว่าในระหว่างการทดสอบ LZ ไม่มีการแจ้งเตือนทั้งหมด () และแถบควบคุมไม่ได้ส่งออก หลังจากเพิ่มมีตารางการวิเคราะห์ประสิทธิภาพ เหตุผลยังไม่ชัดเจน ถ้าคุณรู้คุณสามารถแสดงความคิดเห็น