Sử dụng các lệnh console để debug tốt hơn khi phát triển frontend

Fact: Trước khi có console ra đời chắc anh em dev debug js hơi mệt

Có console rồi thì thường chúng ta sẽ dùng console.log để log ra giá trị mà debug, rất đơn giản.

Bên cạnh đó, còn nhiều lệnh con thú vị khác của console sẽ giúp ích rất nhiều nhưng bị lãng quên. Chúng là:

Console.table

Truyền vào một object, console.table sẽ “log” cho bạn một kết quả dễ đọc dạng bảng.

Với console.log

Với console.table

Console.group, console.groupEnd

Phù hợp để nhóm nhiều lần nội dung lại với nhau và hiển thị ra một lần theo dạng nhóm. Bạn dùng console.group để bắt đầu một group, dùng console.groupEnd để kết thúc group.

Theo ví dụ bên dưới thì hiển thị đẹp đúng không nào

Console.time, console.timeEnd

Thường dùng để đo thời gian chạy của một hàm / một khối lệnh (hiển nhiên bạn có thể dùng console.log với Datetime nhưng cách này nhanh hơn, nhanh hơn thế nào? xem hình nhé. Kết quả được tính bằng ms.

Console.count

Hữu dụng khi đếm cái gì đó theo một nhãn cụ thể, đỡ tốn công tạo biến đếm.