มีใครใช้ firebug บ้างยกมือขึ้น

ใน firebug มันมีแท็บแท็บหนึ่ง ซึ่งอยู่ซะอันแรกสุด (console) บอกตามตรงนะว่าเมื่อก่อนนี้ ผมสงสัยว่าไอ้แท็บเนี้ย มันทำมาทำมะเขืออะไร

แล้วอยู่ไปอยู่มาวันหนึ่ง อ่านเว็บฝรั่งไปเรื่อยๆ ก็เจอบทความนำเสนอแสงฟ้าส่องอำไพ ( อำไภ อำภัย เขียนไงหว่า) ให้แก่ผม

เขาสอนวิธีดีบักจาวาสคริปต์ด้วยคำสั่ง console.log ซึ่งมันเกี่ยวพันกับแท็บอันแรกนั้นโดยตรง

โดยปกติแล้วที่ผ่านมา ผมจะดีบักคำสั่ง javascript ด้วยการ alert แสดงค่าที่ต้องการออกมา แต่ปัญหามันก็ตามมา เมื่อดีบักในลูปก็ดี อยากทราบหลายๆค่าก็ดี

alert กันทีจนเครื่องแฮ้งก์ ชิบหายละกู

แต่พอเมื่อมาเจอการดีบักแบบใหม่ อูย… สะใจดี ชอบ อยากจะแสดงค่าออกมาเท่าไรก็ได้แล้ว ไม่ต้องคอยกดปุ่ม OK ของ alert ให้เมื่อยนิ้วชี้ ให้เสียอารมณ์

ลองดูโค้ดที่ผมทำการทดสอบใช้คำสั่ง console.log

<html>
<head>
	<meta charset="utf-8">
<script type="text/javascript">	
	for(var i=0;i<=10;i++){
		document.write("<p>"+i+"</p>");
		console.log(i);	
	}
</script>
</head>
<body>
</body>
</html>

และผลลัพธ์มันออกมาอย่างนี้
firebug-console

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