Làm cách nào để nhập tệp csv vào javascript?

Các bạn đọc like ủng hộ MUO nhé. Khi bạn mua hàng bằng các liên kết trên trang web của chúng tôi, chúng tôi có thể kiếm được hoa hồng liên kết. Đọc thêm

Các tệp CSV là một định dạng lưu trữ dữ liệu thuận tiện và bạn có thể sử dụng chúng trong Nút của mình. js để xử lý mọi thứ từ cấu hình đến dữ liệu thô. Chúng có thể đơn giản hóa việc chia sẻ thông tin giữa hai ứng dụng, ngay cả khi chúng được viết bằng các ngôn ngữ khác nhau

trong nút. js, bạn có thể sử dụng một số phương pháp để đọc và ghi tệp CSV

Hướng dẫn này chỉ cho bạn cách sử dụng mô-đun fs và gói fast-csv NPM để đọc và ghi tệp CSV

Thiết lập dự án

Để làm theo hướng dẫn này, đảm bảo bạn có Node. js được cài đặt trên máy của bạn. Chạy lệnh này để kiểm tra

 node -v

Nó sẽ trả về một số phiên bản. Nếu bạn không có nút. js, hãy làm theo hướng dẫn trong hướng dẫn cài đặt này để thực hiện

Trong thư mục ưa thích của bạn, hãy tạo một thư mục mới có tên là parse-csv

 mkdir parse-csv

Điều hướng đến parse-csv và tạo một tệp mới. Đặt tên cho nó là parseCSV. js

 cd parse-csv
touch parseCSV.js

Bây giờ bạn có thể bắt đầu làm việc với CSV

Sử dụng Mô-đun fs

Mô-đun fs [viết tắt của hệ thống tệp] chứa một số lệnh để tương tác với hệ thống tệp trong Node. js

Đọc toàn bộ tệp cùng một lúc

Các lệnh readFile[] và readFileSync[] từ mô-đun fs cho phép bạn đọc nội dung tệp trong Node. js. Sự khác biệt giữa các lệnh này là readFileSync[] là đồng bộ—nó chặn JavaScript khác thực thi—trong khi readFile[] là không đồng bộ hoặc không chặn

Vì việc đọc các tệp CSV có thể mất một chút thời gian, đặc biệt là đối với các tệp lớn, tốt hơn hết là sử dụng lệnh không chặn, readFile[], như được hiển thị bên dưới

 const fs = require['fs'];

fs.readFile['csvdemo.csv', 'utf8', function [err, data] {
  /* parse data */
}];

Nếu bạn không có tệp CSV mẫu, bạn có thể tạo một tệp từ mockaroo. Bạn cũng có thể tự học cách tạo tệp CSV

Đọc từng dòng

Mặc dù readFile[] hoạt động, nhưng nó chiếm nhiều bộ nhớ vì nó đọc toàn bộ tệp CSV cùng một lúc. Đây là một vấn đề, đặc biệt là khi làm việc với các tệp CSV lớn. Một cách khác là đọc từng dòng một bằng fs. lệnh createReadStream[]

 const fs = require["fs"];
const readline = require["readline"];
const stream = fs.createReadStream["./csvdemo.csv"];
const rl = readline.createInterface[{ input: stream }];
let data = [];

rl.on["line", [row] => {
  data.push[row.split[","]];
}];

rl.on["close", [] => {
  console.log[data];
}];

Tại đây, bạn đang chuyển tên tệp CSV sang fs. createReadStream[] để tạo luồng có thể đọc được. Luồng cho phép bạn làm việc với lượng lớn dữ liệu bằng cách cho phép bạn truy cập dữ liệu theo khối

Khi bạn tạo luồng có thể đọc được, hãy chuyển luồng đó tới đường dẫn. phương thức createInterface[]. Mô-đun readline cung cấp giao diện để đọc dữ liệu từng dòng một. Bây giờ bạn có thể đẩy từng hàng vào mảng dữ liệu khi nó đang được đọc

Tuy nhiên, lưu ý rằng mã này chỉ đơn giản là tách từng hàng trên dấu phẩy. Mặc dù điều này sẽ hoạt động với tệp CSV cơ bản nhất, nhưng định dạng này thực sự phức tạp hơn so với tên gọi của nó. Phân tích cú pháp các tệp CSV theo cách thủ công không phải là một cách tiếp cận hiệu quả, đặc biệt nếu bạn không tự mình kiểm soát dữ liệu. Đối với hầu hết các trường hợp, bạn nên sử dụng thư viện CSV

Sử dụng fast-csv

Để phân tích tệp CSV một cách đáng tin cậy, bạn có thể sử dụng thư viện như fast-csv, có sẵn dưới dạng gói npm. Không chỉ đọc các tệp CSV mà còn định dạng chúng dễ dàng hơn

Để bắt đầu, hãy khởi tạo npm và cài đặt fast-csv

 npm init -y
npm i fast-csv

Đọc tệp CSV bằng fast-csv như sau

 const fs = require['fs']
const csv = require['fast-csv'];
const data = []

fs.createReadStream['./csvdemo.csv']
.pipe[csv.parse[{ headers: true }]]
.on['error', error => console.error[error]]
.on['data', row => data.push[row]]
.on['end', [] => console.log[data]];

Trong đoạn mã trên, hãy bắt đầu bằng cách tạo một luồng có thể đọc được từ tệp CSV, sau đó kết nối nó với phương thức phân tích cú pháp từ CSV nhanh bằng cách sử dụng pipe[]. Lưu ý rằng bạn đang chuyển tùy chọn tiêu đề cho csv. phân tích cú pháp []. Điều này bỏ qua hàng đầu tiên. Đặt tiêu đề thành false nếu hàng đầu tiên của tệp CSV của bạn không chứa tiêu đề

Khi tệp CSV được đọc từng hàng một, bạn đang đẩy từng hàng vào mảng dữ liệu. Sau khi toàn bộ tệp được đọc, bạn có thể thao tác với nội dung của mảng dữ liệu theo ý muốn

Có nhiều hơn một cách để phân tích CSV

Các tệp CSV rất hữu ích để lưu trữ các tập dữ liệu lớn vì dễ dàng phân tích cú pháp chúng. trong nút. js, bạn có thể sử dụng mô-đun fs tích hợp hoặc các gói NPM

Sử dụng một thư viện như fast-csv dễ dàng hơn và mạnh mẽ hơn nhiều so với việc viết mã phân tích cú pháp của riêng bạn theo cách thủ công. Một số gói khác để phân tích cú pháp CSV là trình phân tích cú pháp csv và trình phân tích cú pháp papa

JavaScript có thể phân tích cú pháp CSV không?

Để bắt đầu với một ví dụ đơn giản, bạn có thể đọc dữ liệu CSV từ một chuỗi JavaScript . tệp csv. hàm phân tích cú pháp có các tham số cho dữ liệu CSV, các tùy chọn cấu hình riêng của nó và một hàm để chuyển kết quả tới.

Cách đọc dữ liệu từ tệp CSV trong phản ứng js?

Hàm handleParse sẽ phân tích cú pháp dữ liệu CSV bằng trình phân tích cú pháp papa và đặt trạng thái dữ liệu cho các cột của tệp CSV . Sau đó, cuối cùng chúng tôi trả về thành phần chứa phần tử đầu vào để lấy tệp đã tải lên, một nút để phân tích cú pháp dữ liệu khi nhấp và vùng chứa để hiển thị bất kỳ lỗi hoặc dữ liệu đã phân tích cú pháp nào.

Chủ Đề