在 JavaScript 中逐行讀取檔案
- 在 JavaScript 中使用普通 JavaScript 逐行讀取本地檔案
-
在 JavaScript 中使用 Node.js
readline模組讀取本地檔案 -
在 JavaScript 中使用 Node.js 中的
line-reader模組讀取本地檔案
本文將介紹使用 Vanilla JS 和 JavaScript 框架 Node.js 使用 JavaScript 讀取檔案的方法。
在 JavaScript 中使用普通 JavaScript 逐行讀取本地檔案
我們可以建立一個簡單的 JavaScript 函式來讀取作為 HTML 輸入放入的本地檔案。
我們可以使用 input HTML 標籤來上傳檔案，並使用函式 FileReader() 從檔案中逐行讀取內容。
程式碼示例：
<input type="file" name="file" id="file" />
document.getElementById('file').onchange = function(){
var file = this.files[0];
var reader = new FileReader();
reader.onload = function(progressEvent){
console.log(this.result);
};
reader.readAsText(file);
};
在這裡，輸入欄位由 getElementById 方法選擇，該方法將在更改時觸發該函式（無論何時選擇檔案）。我們建立物件 FileReader() 的新例項。當例項 reader.onload 被觸發時，一個帶有引數 progressEvent 的函式被呼叫，我們可以在控制檯上將檔案的全部內容列印為 console.log(this.result)。
我們可以擴充套件函式來逐行讀取檔案內容，如下圖。
document.getElementById('file').onchange = function(){
var file = this.files[0];
var reader = new FileReader();
reader.onload = function(progressEvent){
var fileContentArray = this.result.split(/\r\n|\n/);
for(var line = 0; line < lines.length-1; line++){
console.log(line + " --> "+ lines[line]);
}
};
reader.readAsText(file);
};
前一個方法的擴充套件片段使用 split() 來拆分 result 變數讀取的內容並將其儲存到陣列 fileContentArray 變數中。然後使用 for 迴圈遍歷 fileContentArray 變數的每一行並逐行列印檔案內容。
出於測試目的，我們建立了一個 demo.txt 檔案，其中包含以下內容。
Line 1
Line 2
Line 3
Line 5
現在，我們可以看到檔案有五行，從 HTML Input 元素上傳檔案時，我們可以看到檔案的內容，如下面的輸出所示。
輸出：
1 --> Line 1
2 --> Line 2
3 --> Line 3
4 -->
5 --> Line 5
我們可以忽略內容 1 --> 因為它是為了視覺化檔案的行號。
在 JavaScript 中使用 Node.js readline 模組讀取本地檔案
我們應該確保我們已經安裝了 Node 來使用這個方法。我們可以通過在終端或命令提示符中鍵入 node -v 來檢查。我們現在可以使用 readline 模組輕鬆讀取檔案的內容。我們建立一個檔案 app.js, 並在檔案 app.js 的第一行，我們匯入模組，如下所示。
const readline = require('readline');
const fs = require('fs');
由於 readline 模組內建在 Node.js 中，我們沒有明確安裝它。我們可以使用 fs 模組來建立可讀流。這是因為 readline 模組僅與可讀流相容。
示例程式碼：
const readLine = require('readline');
const f = require('fs');
var file = './demo.txt';
var rl = readLine.createInterface({
input : f.createReadStream(file),
output : process.stdout,
terminal: false
});
rl.on('line', function (text) {
console.log(text);
});
我們可以將檔案 app.js 儲存到與檔案 demo.txt 相同的資料夾中，然後使用命令 node app.js 執行。
輸出：
Line 1
Line 2
Line 3
Line 5
在 JavaScript 中使用 Node.js 中的 line-reader 模組讀取本地檔案
我們可以使用 Node.js line-reader 模組在 JavaScript 中讀取檔案。該模組是開源的，我們需要使用 npm install line-reader --save 或 yarn add line-reader 命令來安裝它。
使用 line-reader 模組讀取檔案內容很容易，因為它提供了 eachLine() 方法。它讓我們一行一行地讀取檔案。我們可以在我們的檔案 app.js 的頂部將它匯入為 const lineReader = require('line-reader')。
eachLine() 方法採用帶有兩個引數的回撥函式。引數是 line 和 last。選項 line 儲存內容，選項 last 告訴讀取的行是否是檔案中的最後一行。第二個選項代表一個布林值。
示例程式碼：
const lineReader = require('line-reader');
lineReader.eachLine('./demo.txt',(line,last)=>{
console.log(line);
})
我們可以將檔案 app.js 儲存到檔案 demo.txt 所在的資料夾，或者我們可以顯式設定檔案的路徑，它將逐行讀取檔案的內容並將輸出列印到控制檯。
輸出：
Line 1
Line 2
Line 3
Line 5
