Mảng hiển thị Html trong bảng

Với cấu trúc lưu trữ dữ liệu này, họ thường chạy một vòng qua mảng và tạo thủ công từng ô của bảng, như thế này

let table = document.getElementById('table'); for (let user of users) { let tr = document.createElement('tr'); let td1 = document.createElement('td'); td1.textContent = user.name; tr.appendChild(td1); let td2 = document.createElement('td'); td2.textContent = user.surname; tr.appendChild(td2); let td3 = document.createElement('td'); td3.textContent = user.patronymic; tr.appendChild(td3); table.appendChild(tr); }

Cách tiếp cận này mang lại sự linh hoạt cao - bản thân chúng ta có thể điều chỉnh thứ tự dữ liệu trong các ô của bảng (ví dụ: chúng ta có thể hoán đổi họ và tên)

Ngoài ra, nếu muốn, chúng ta có thể treo sự kiện trên một số ô nhất định. Ví dụ: bạn có thể đính kèm một số loại hành động khi nhấp vào ô có họ, v.v.

Cho mảng sau với nhân viên

// an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 0

Xuất các phần tử mảng này dưới dạng bảng HTML

Sửa đổi nhiệm vụ trước đó để khi bạn nhấp vào bất kỳ ô nào có mức lương, nội dung của nó sẽ tăng thêm // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 1

Giải quyết câu hỏi liên quan đến dữ liệu mảng lởm chởm và đa chiều (thuộc loại nào đó, như chúng ta đã thảo luận), đây là một số phỏng đoán vô hại để xem xét…

Dữ liệu có thể có tất cả các loại hình thức, từ các giá trị tầm thường, nguyên thủy và số ít cho đến thang tài liệu. Tất cả dữ liệu trong JavaScript đều có kiểu dữ liệu hoặc được chuyển thành kiểu nếu đó là kiểu nguyên thủy

// an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 2 là một nguyên thủy, không có thuộc tính typeof, trực tiếp. Thay vào đó, JS cung cấp cho nó một đối tượng bao bọc. Trong quá trình này, nguyên thủy được chuyển thành một loại số. Đó là đối tượng bao bọc được cung cấp thuộc tính typeof. (Điều này hơi mơ hồ và đảm bảo đọc thêm. )

Một số loại rơi vào nhóm các giá trị số ít. một số, một chuỗi ký tự, một boolean, null, không xác định, tất cả đều có thể là kết quả của một biểu thức (luôn mang lại giá trị thuộc loại này hay loại khác)

Những thứ khác không được coi là giá trị, là các đối tượng và chức năng tham chiếu. Mảng và đối tượng thuộc nhóm này. Chúng tham chiếu các giá trị và các đối tượng khác, nhưng bản thân chúng không phải là một giá trị. Các tham chiếu này được tuần tự hóa trong đối tượng cha tương ứng

Nếu chúng ta chỉ thu thập toàn bộ dữ liệu về các khía cạnh khác nhau của một chủ đề, thì dữ liệu đó sẽ có nhiều dạng, như đã đề cập. Chúng ta sẽ nhồi nhét tất cả vào một cấu trúc cứng nhắc hay sắp xếp nó theo cách trực quan, để bản chất của dữ liệu đóng một vai trò trong cấu trúc? . Về mặt này, tính linh hoạt là điểm mạnh của nó.

Lập trình viên có tiếng nói trong cấu trúc dữ liệu nếu chương trình của họ đang tạo một tập dữ liệu, nhưng chúng ta cũng cần có khả năng làm việc với các tập dữ liệu hiện có. Đây là nơi hiểu cấu trúc của dữ liệu giúp chúng ta viết các chương trình có thể phân tích cú pháp và thao tác với nó

Các tập dữ liệu khá lớn có thể khá lởm chởm và không phù hợp, với nhiều loại dữ liệu và cấu trúc bên trong. Mặc dù chúng tôi không muốn cố ý hoặc xây dựng một cách thiếu thận trọng các cấu trúc dữ liệu phức tạp và lộn xộn, nhưng đôi khi chúng không đẹp như vậy khi mọi thứ được kết hợp. Miễn là logic có thể phổ biến lại, đó là điều chính. Cấu trúc đơn giản, logic phân tích cú pháp đơn giản. Cấu trúc phức tạp, logic phức tạp. Bạn muốn làm việc với cái nào hơn?

Hàm này nhận một đối số bắt buộc là // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 3, phải là một mảng hoặc một đối tượng và một tham số tùy chọn bổ sung là // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 4

Nó ghi nhật ký // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 3 dưới dạng bảng. Mỗi phần tử trong mảng (hoặc thuộc tính đếm được nếu // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 3 là một đối tượng) sẽ là một hàng trong bảng

Cột đầu tiên trong bảng sẽ được gắn nhãn // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 2. Nếu // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 3 là một mảng thì các giá trị của nó sẽ là các chỉ số của mảng. Nếu // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 3 là một đối tượng thì giá trị của nó sẽ là tên thuộc tính. Lưu ý rằng (trong Firefox) // an object whose properties are strings function Person(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } const me = new Person("Tyrone", "Jones"); console.table(me); 5 bị giới hạn hiển thị 1000 hàng (hàng đầu tiên là chỉ mục được gắn nhãn)

Ghi chú. Tính năng này có sẵn trong Web Worker