0Pricing
JavaScript Academy · บทเรียน

นอกเหนือจาก console.log

ใช้ table, group, warn, error และ assert

นอกเหนือจาก console.log เป็นบทเรียน JavaScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน JavaScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 4 บทเรียน

มากกว่า log

อ็อบเจ็กต์ console มีเมธอดมากมายนอกเหนือจาก console.log แต่ละเมธอดสื่อเจตนาที่แตกต่างกัน และสามารถแสดงเอาต์พุตในรูปแบบที่เป็นประโยชน์ได้

console.log("plain message")
console.info("informational")

console.warn

console.warn แสดงคำเตือน ในเบราว์เซอร์จะแสดงพร้อมไฮไลต์สีเหลือง เพื่อสื่อว่าเป็นปัญหาที่ไม่ร้ายแรงแต่ควรตรวจสอบ

console.warn("This API is deprecated")

console.error

console.error รายงานข้อผิดพลาด โดยมีรูปแบบการแสดงผลที่แตกต่างอย่างชัดเจน และในเบราว์เซอร์ยังมีสแต็ก trace เพื่อช่วยระบุตำแหน่งของปัญหา

console.error("Failed to load data")

console.info และ debug

console.info และ console.debug ทำงานคล้าย log แต่สื่อระดับความรุนแรงของข้อความ เครื่องมือสามารถกรองข้อความตามระดับเหล่านี้ได้

console.info("Server started")
console.debug("Cache size is 42")

console.table

console.table แสดงอาร์เรย์และอ็อบเจ็กต์เป็นตารางที่จัดรูปแบบแล้ว ทำให้ตรวจดูข้อมูลที่มีโครงสร้างได้ง่ายกว่าการใช้ log แบบธรรมดามาก

const users = [
  { name: "Ann", age: 30 },
  { name: "Bob", age: 25 }
]
console.table(users)

console.group

console.group เริ่มส่วนที่เยื้องเข้าไปและยุบขยายได้ ข้อความที่บันทึกหลังจากนั้นจะอยู่ซ้อนกันจนกว่าจะเรียก console.groupEnd

console.group("User details")
console.log("Name: Ann")
console.log("Age: 30")
console.groupEnd()

กลุ่มแบบซ้อนกัน

กลุ่มสามารถซ้อนกันเป็นลำดับชั้นได้ โดยแต่ละระดับจะเพิ่มการเยื้องเข้าไปอีก

console.group("Order")
console.log("id: 1")
console.group("Items")
console.log("Book")
console.groupEnd()
console.groupEnd()

console.assert

console.assert จะบันทึกข้อผิดพลาดเฉพาะเมื่ออาร์กิวเมนต์แรกมีค่าเป็นเท็จ วิธีนี้ช่วยตรวจจับสมมติฐานที่ไม่ถูกต้องได้อย่างรวดเร็วโดยไม่หยุดการทำงาน

const total = 10
console.assert(total > 0, "total should be positive")
console.assert(total > 100, "total is unexpectedly small")

console.count

console.count ติดตามว่าบรรทัดที่มีป้ายกำกับทำงานไปแล้วกี่ครั้ง เหมาะสำหรับตรวจหาการเรียกซ้ำที่ไม่คาดคิด

function ping() {
  console.count("ping")
}
ping()
ping()
ping()

console.time

console.time และ console.timeEnd ใช้วัดว่ากลุ่มโค้ดใช้เวลานานเท่าใด โดยพิมพ์ระยะเวลาที่ผ่านไปพร้อมป้ายกำกับที่ตรงกัน

console.time("loop")
let sum = 0
for (let i = 0; i < 1000; i++) { sum += i }
console.timeEnd("loop")

การเลือกเมธอดที่เหมาะสม

ใช้ warn และ error สำหรับปัญหา ใช้ table สำหรับข้อมูลที่มีโครงสร้าง ใช้ group เพื่อจัดระเบียบบันทึกข้อความที่เกี่ยวข้อง และใช้ assert เพื่อตรวจสอบสมมติฐาน การบันทึกข้อความที่ชัดเจนช่วยให้การแก้จุดบกพร่องรวดเร็วขึ้น

console.warn("low memory")
console.table([{ id: 1 }, { id: 2 }])

ตรวจสอบความเข้าใจอย่างรวดเร็ว

ทดสอบความเข้าใจเรื่องเมธอดของ console

สรุป

สรุป: console มีเมธอดมากมายที่นอกเหนือจาก log

  • warn และ error สื่อระดับความรุนแรง
  • table แสดงข้อมูลที่มีโครงสร้าง
  • group จัดระเบียบบันทึกข้อความแบบซ้อนกัน
  • assert แจ้งเงื่อนไขที่ไม่ผ่าน
console.table([{ a: 1 }, { a: 2 }])
console.warn("done")

คำถามที่พบบ่อย

บทเรียน “นอกเหนือจาก console.log” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “นอกเหนือจาก console.log” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส JavaScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “นอกเหนือจาก console.log”

ใช้ table, group, warn, error และ assert คุณปฏิบัติ JavaScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน JavaScript Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน JavaScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน

บทเรียน “นอกเหนือจาก console.log” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน JavaScript Academy นี้ได้ไหม

ได้ บทเรียน JavaScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. นอกเหนือจาก console.log
  2. การตั้งจุดหยุด
  3. การไล่ทำงานทีละขั้นในโค้ด
  4. การอ่านสแต็กเทรซ
← กลับไปที่ JavaScript Academy