Phương thức HTML DOM console.table () được sử dụng để hiển thị dữ liệu ở định dạng bảng được tổ chức tốt. Phương pháp này có thể được sử dụng để trực quan hóa các mảng hoặc đối tượng phức tạp. Bảng được tổ chức theo cách mà mỗi phần tử trong mảng sẽ là một hàng trong bảng. Nó có hai tham số là dữ liệu dạng bảng (bắt buộc) và cột bảng (tùy chọn).

Cú pháp

Sau đây là cú pháp cho phương thức console.table () -

 console.table (dữ liệu tab, cột bảng);

Đây -

Dữ liệu dạng bảng là một giá trị tham số bắt buộc. Nó đại diện cho dữ liệu được sử dụng để điền vào bảng. Nó có thể là đối tượng kiểu hoặc một mảng.
Cột bảng là một giá trị tham số tùy chọn, nó là một tham số mảng chỉ định cột nào sẽ được hiển thị trong bảng.

Ví dụ

Hãy để chúng tôi xem xét một ví dụ cho phương thức HTML DOM console.table () -

Phương thức console.table ()

Nhấp vào nút bên dưới để tạo bảng điều khiển

nút

Xem bảng trong tab bảng điều khiển

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Phương thức HTML DOM console.table ()

Khi nhấp vào nút TABLE và xem nó trong tab bảng điều khiển -

Phương thức HTML DOM console.table ()

Trong ví dụ trên -

Đầu tiên, chúng tôi đã tạo một bảng nút sẽ thực thi hàm createTable () khi được người dùng nhấp vào.

Phương thức createTable () có ba mảng đối tượng được tạo bên trong nó. Các mảng đối tượng được đặt tên lần lượt là fruit1, fruit2 và fruit3. Sau đó, tên của mảng đối tượng được chuyển làm tham số đầu tiên (tableData) cho phương thức table () của bảng điều khiển.

Trong tham số tùy chọn thứ hai, chúng tôi chuyển tên của các cột dưới dạng một mảng, chúng tôi muốn đưa vào bảng. Vì chúng tôi đã chỉ định cột "Tên" và "giá"; các cột này sẽ được nhìn thấy trong bảng và sẽ không có cột "màu" -

 function createTable () {var fruit1 ={Name:"Mango", price:"100", color:"Yellow"} var fruit2 ={Name:"Guava", price:"50", color:"Green "} var fruit3 ={Name:" Strawberry ", price:" 150 ", color:" Red "} console.table ([fruit1, fruit2, fruit3], [" Name "," price "]);}