Đây là bài 1 của chương 3: Mảng và biến đổi dữ liệu, thuộc khóa demo JavaScript. Nội dung được dùng để trải nghiệm cấu trúc chương trình học; hãy thực hành trên dữ liệu và môi trường thử nghiệm riêng. Trong dự án xuyên suốt, bạn sẽ xây dựng ứng dụng danh sách công việc có tìm kiếm, lọc và lưu trạng thái trên trình duyệt.
Mục tiêu cụ thể
Map biến đổi từng phần tử, filter chọn phần tử, reduce tổng hợp kết quả. Chọn phương pháp dựa trên hình dạng đầu ra mong muốn.
Hiểu vấn đề trước khi dùng công cụ
Chương này tập trung vào một quyết định cụ thể: Thêm lọc trạng thái và sắp xếp theo tiêu đề mà không thay đổi danh sách nguồn. Đừng bắt đầu bằng cách chép nguyên ví dụ. Hãy chỉ ra thành phần nào là dữ liệu, thành phần nào là quy tắc và đâu là kết quả quan sát được. Một giải pháp đúng với dữ liệu mẫu vẫn có thể sai khi đầu vào rỗng, kích thước lớn hơn hoặc có hai thao tác xảy ra gần nhau.
Ví dụ tối thiểu
const tasks = [{id:1, done:false}, {id:2, done:true}];
const pending = tasks.filter(task => !task.done);
const ids = pending.map(task => task.id);
const completed = tasks.reduce((n, task) => n + Number(task.done), 0);Giới hạn cần hiểu
Sort thay đổi mảng gốc. Object trong mảng mới vẫn có thể cùng tham chiếu với object ban đầu nếu chỉ sao chép nông.
Câu hỏi để tự giải thích
- Bạn sẽ giải thích mảng và biến đổi dữ liệu cho người mới bằng ví dụ nào?
- Phần nào của ví dụ là giả định, phần nào cần kiểm tra bằng thực nghiệm?
- Nếu bỏ một điều kiện quan trọng, kết quả sẽ sai ở đâu?
Kết quả cần đạt
- Danh sách nguồn giữ nguyên thứ tự
- Bộ lọc hoạt động với mảng rỗng
- Phân biệt bản sao mảng và bản sao object
Trước khi chuyển bài, hãy viết một đoạn giải thích bằng lời của bạn và chỉ ra ít nhất một trường hợp không nên áp dụng máy móc ví dụ này.