JavaScript join: vì sao ghép rồi split không khôi phục được dữ liệu?

Array.join tiện để hiển thị danh sách, nhưng không tự tạo ra một định dạng lưu trữ có thể khôi phục nguyên vẹn. Nhiều mảng khác nhau có thể cho cùng chuỗi đầu ra. Nếu sau đó split theo dấu phân cách, thông tin đã mất không tự quay lại.

1. Các dạng dữ liệu khác nhau có thể cùng thành chuỗi rỗng

console.log(JSON.stringify([null].join('|'))); // ""
console.log(JSON.stringify([undefined].join('|'))); // ""
console.log(JSON.stringify([''].join('|'))); // ""
console.log(JSON.stringify(new Array(1).join('|'))); // ""
console.log(JSON.stringify([].join('|'))); // ""

Theo MDN Array.join, null và undefined được chuyển thành chuỗi rỗng khi ghép; ô trống cũng được đọc như undefined. Ví dụ còn có mảng không chứa phần tử nào. Chỉ nhìn đầu ra không thể phân biệt năm trường hợp này.

Nếu hệ thống cần phân biệt “chưa có giá trị”, “đã nhập chuỗi rỗng” và “không có phần tử”, phải giữ cấu trúc dữ liệu hoặc định nghĩa cách mã hóa các trạng thái đó. Dùng một dấu phân cách lạ hơn không giải quyết việc mất kiểu và trạng thái thiếu.

2. Dấu phân cách trong dữ liệu làm mất ranh giới

const labels = ['red|blue', 'green'];
const text = labels.join('|');
console.log(text); // red|blue|green
console.log(JSON.stringify(text.split('|'))); // ["red","blue","green"]
const encoded = JSON.stringify(labels);
console.log(JSON.stringify(JSON.parse(encoded))); // ["red|blue","green"]

Mảng gốc có hai phần tử; split tạo ba phần tử vì không biết dấu | nào thuộc nhãn. Với mảng đặc chỉ chứa chuỗi như ví dụ, JSON.stringify kết hợp JSON.parse giữ được ranh giới phần tử. Xem MDN JSON.stringify.

Đây không phải lời khẳng định JSON giữ nguyên mọi giá trị JavaScript. undefined trong mảng, kiểu đặc biệt hoặc tham chiếu vòng cần chính sách khác. Nếu bên nhận yêu cầu CSV, dùng quy tắc và công cụ CSV phù hợp; đổi join('|') thành join(',') không tự xử lý dấu nháy, dấu phẩy và xuống dòng trong ô dữ liệu.

3. Đặt contract riêng nếu chỉ ghép nhãn để hiển thị

function displayLabels(labels) {
  if (!Array.isArray(labels)) {
    throw new TypeError('labels must be an array');
  }
  for (const label of labels) {
    if (typeof label !== 'string') {
      throw new TypeError('every label must be a string');
    }
  }
  return labels.join(' / ');
}
console.log(displayLabels(['API', 'Web'])); // API / Web
console.log(JSON.stringify(displayLabels([]))); // ""

Helper dành cho mảng dữ liệu thông thường với iterator và join chuẩn. Nó chỉ nhận phần tử là chuỗi, không tự đổi số hoặc object thành chữ. Với mảng thưa thông thường, vòng for...of đọc ô trống thành undefined và từ chối đầu vào đó.

Contract này vẫn cho phép chuỗi rỗng và dấu / nằm trong nhãn. Đầu ra phục vụ hiển thị, không dùng để suy ngược danh sách hay làm khóa định danh duy nhất. Nếu UI không chấp nhận nhãn trắng, bổ sung quy tắc rõ ràng; helper hiện tại không trim hoặc loại phần tử.

4. Chuỗi nhìn giống nhau chưa chứng minh dữ liệu giống nhau

Khi dùng join để so sánh hai mảng, tạo khóa cache hoặc phát hiện thay đổi, dữ liệu khác nhau có thể bị gộp chung. Trước khi chọn biểu diễn làm khóa, cần xác định kiểu phần tử, ranh giới, thứ tự và các giá trị thiếu. Nếu cần so sánh mảng chuỗi theo thứ tự, so sánh độ dài và từng phần tử trực tiếp là một lựa chọn dễ kiểm tra.

Với việc gửi dữ liệu qua API, thống nhất schema cùng bên nhận rồi chọn định dạng mã hóa tương ứng. Với nội dung hiển thị, chọn cách phân cách dễ đọc và giữ mảng gốc nếu có thao tác chọn, sửa hoặc xóa từng mục. Một chuỗi đã định dạng thường không đủ thông tin để làm nguồn dữ liệu cho các thao tác đó.

5. Checklist trước khi dùng join

• Đầu ra phục vụ hiển thị hay cần giải mã lại?
• Phần tử có thể là null, undefined, chuỗi rỗng hoặc ô trống?
• Dấu phân cách có thể xuất hiện trong nội dung không?
• Có cần giữ kiểu, thứ tự và số lượng phần tử?
• Đã thử round-trip và so sánh cấu trúc thay vì chỉ xem chuỗi đầu ra?

Sáu khối mã Việt–Anh đã chạy bằng Node.js; kiểm tra thêm nhãn sai kiểu, mảng thưa, dấu phân cách trong nhãn và bảo toàn mảng nguồn. Chưa kiểm thử trình xuất CSV hoặc tích hợp API thực tế.