Lập trình · 21/10/2026

JavaScript Array.length: đổi độ dài có thể xóa dữ liệu

Gán length để giới hạn danh sách có thể làm mất phần cuối của chính mảng nguồn. length là thuộc tính có thể ghi của Array, không chỉ là số đếm để đọc. Trước khi thay đổi nó, cần biết ai đang dùng chung mảng và mục tiêu là sửa dữ liệu hay chỉ hiển thị một phần.

JavaScript Array.length: đổi độ dài có thể xóa dữ liệu

Gán length để giới hạn danh sách có thể làm mất phần cuối của chính mảng nguồn. length là thuộc tính có thể ghi của Array, không chỉ là số đếm để đọc. Trước khi thay đổi nó, cần biết ai đang dùng chung mảng và mục tiêu là sửa dữ liệu hay chỉ hiển thị một phần.

1. Rút ngắn length làm thay đổi cùng một mảng

const rows = ['A', 'B', 'C', 'D'];
const shared = rows;
rows.length = 2;
console.log(JSON.stringify(rows)); // ["A","B"]
console.log(JSON.stringify(shared)); // ["A","B"]
rows.length = 4;
console.log(Object.hasOwn(rows, 2)); // false

Ví dụ dùng mảng thông thường có các phần tử có thể xóa. Sau khi rút ngắn, C và D không còn là phần tử của mảng; tăng lại length không khôi phục chúng. shared cũng quan sát thay đổi vì nó tham chiếu cùng đối tượng.

Không dùng thao tác này chỉ để giới hạn số hàng trên một bảng nếu nơi khác vẫn cần toàn bộ dữ liệu. Việc một biến được khai báo const không ngăn sửa nội dung mảng mà biến đó trỏ tới.

2. Tăng length không tạo các bản ghi mới

const rows = ['A'];
rows.length = 3;
let calls = 0;
rows.map(value => {
  calls += 1;
  return value;
});
console.log(rows.length); // 3
console.log(calls); // 1
console.log(Object.hasOwn(rows, 1)); // false

Trong ví dụ, độ dài bằng 3 nhưng chỉ có một phần tử hiện hữu để map gọi callback. Các vị trí mới là empty slots. Đối chiếu MDN Array.length về tăng, giảm length và mảng thưa.

Nếu cần ba hàng placeholder, hãy tạo ba giá trị placeholder rõ ràng theo schema. Không dùng length như bằng chứng đã tải đủ ba bản ghi. Phân biệt số vị trí của mảng với số mục dữ liệu mà ứng dụng đã kiểm tra hợp lệ.

3. Gán length không thay thế kiểm tra đầu vào

const rows = ['A', 'B', 'C'];
rows.length = '2';
console.log(JSON.stringify(rows)); // ["A","B"]
try {
  rows.length = 1.5;
} catch (error) {
  console.log(error instanceof RangeError); // true
}
console.log(rows.length); // 2

Chuỗi số '2' vẫn gây rút ngắn trong ví dụ, còn độ dài phân số bị từ chối. Vì vậy, đừng thử gán length rồi xem có exception hay không để xác nhận một tham số phân trang hợp lệ. Contract của ứng dụng có thể nghiêm ngặt hơn phép gán của ngôn ngữ.

Nếu nguồn gửi chuỗi, hãy quyết định rõ bước chuyển đổi và giới hạn nghiệp vụ. Với dữ liệu sai, báo lỗi trước khi thay đổi mảng giúp tránh kết quả đã bị cắt ngoài ý muốn.

4. Lấy phần đầu mà không sửa mảng nguồn

function takeFirst(items, limit) {
  if (!Array.isArray(items)) throw new TypeError('items must be an array');
  if (!Number.isInteger(limit) || limit < 0 || limit > 1000) {
    throw new RangeError('limit must be an integer from 0 to 1000');
  }
  return items.slice(0, limit);
}
const rows = [{ id: 'A' }, { id: 'B' }, { id: 'C' }];
const visible = takeFirst(rows, 2);
console.log(visible.length); // 2
console.log(rows.length); // 3
console.log(visible[0] === rows[0]); // true

Giới hạn 1000 là chính sách minh họa của helper, không phải giới hạn Array. limit bằng 0 trả mảng rỗng; limit lớn hơn số phần tử lấy tối đa phần đang có. Hàm kiểm tra loại mảng và limit, chưa xác thực schema của mỗi hàng.

slice tạo mảng mới nhưng chỉ sao chép nông; xem MDN slice. Tham chiếu object vẫn được chia sẻ như phép so sánh cuối cho thấy. Sửa visible[0].id vẫn có thể tác động dữ liệu nhìn qua rows[0]. Nếu đầu vào là mảng thưa, slice cũng không biến nó thành danh sách bản ghi đầy đủ.

5. Review cả nguồn dữ liệu và tham chiếu dùng chung

  • Mục tiêu là sửa danh sách hay chỉ tạo danh sách hiển thị?
  • Có nơi khác đang giữ tham chiếu cùng mảng không?
  • Độ dài tăng thêm là vị trí trống hay giá trị thực?
  • limit đã đúng kiểu và giới hạn sản phẩm trước khi xử lý chưa?
  • Test có kiểm tra mảng nguồn và object con sau thao tác không?

Tám khối mã Việt–Anh đã chạy bằng Node.js, kèm kiểm tra limit biên, đầu vào sai và việc không sửa mảng nguồn khi lấy phần đầu. Chưa tích hợp giao diện hoặc API thực tế.

Thảo luận

Bình luận 0

Đăng nhập để bình luận

Bạn cần có tài khoản để tham gia thảo luận và trả lời độc giả khác.

Đăng nhậpĐăng ký

Chưa có bình luận. Hãy là người đầu tiên chia sẻ ý kiến.