テキストファイルをJavaScriptで読み込む方法とは【メンターが回答】

「テキストファイルをJavaScriptで読み込む方法とは。」という質問にTechAcademyの現役エンジニアが解決方法を回答しています。テキストファイルを1行だけ読み込む際に使うReadLine( )関数の書き方を説明しています。ぜひ理解しておきましょう。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

※TechAcademyに実際に寄せられた質問に現役エンジニアのメンターが回答しました。

 

田島悠介

質問に対して現役のエンジニアが回答していくシリーズだね!

大石ゆかり

今回はどういう質問でしょうか?

田島悠介

テキストファイルをJavaScriptで読み込む方法だね!実際に回答してもらった内容を紹介するね!

大石ゆかり

お願いします!

質問

テキストファイルをJavaScriptで読み込むにはどうしたらいいでしょうか。(のちに1行ずつ分割して読み込むつもりです)

また、大抵はinputタグを使用しているようですが、特定のデータファイルしか読み込む必要がないため、inputタグを使用しない書き方があれば教えていただけたらと思います。

 

メンターからの回答

JavaScriptにて、テキストファイルを1行だけ読み込むにはReadLine( )関数を使用します。あらかじめテキストファイルを開いておきます。

var fs = new ActiveXObject("Scripting.FileSystemObject");
var file = fs.OpenTextFile("開くテキストファイルのパス");

/* 1行目のみ読み込む */
text[0] = file.ReadLine();

/* 2行目を読み込む */
text[1] = file.ReadLine();

ReadLine関数は、呼び出すたびに1行ずつ読み込みますので大変便利です。

テキストファイルをまとめて読み込むには、ReadAll( )関数を使用します。

/*
  あらかじめテキストファイルを開いておく
  var fs = new ActiveXObject("Scripting.FileSystemObject");
  var file = fs.OpenTextFile("開くテキストファイルのパス");
*/

/* テキストファイルをすべて読み込む */
text = file.ReadAll();
ReadAll()関数は便利ですが、メモリを多く消費します。ですので極力使わず、ReadLine()関数をうまく使うようにしましょう。
var text = "";
/* ファイルが最後まで読み込まれるまでループ */
while (!file.AtEndOfStream){
  text += file.ReadLine();
}

AtEndOfStreamプロパティにはテキストファイルが終端に達しているかを示す真偽値が入っています。終端ならtrue、そうでなければfalseです。

他にも似たようなプロパティAtEndOfLineがありますが、これは空行に到達すると終端に達していないにも関わらずtrueになってしまいます。よってここでAtEndOfLineを使うと、空行混じりのファイルが読み込めなくなります。AtEndOfStreamを使うようにしましょう。

 

以上、JavaScriptのreturnの使い方について解説しました。

TechAcademyでは、現役JavaScriptエンジニアのメンターが質問にすぐ回答します。

 

[PR] JavaScript・jQueryで挫折しない学習方法を動画で公開中

回答してくれたメンター

武田 勝輝(たけだ しょうき)

HaskellやLispなど関数型プログラミング言語を使用した数値計算システム開発業務に従事。

 

大石ゆかり

なぜ一行ずつ読み込むんですか?

田島悠介

メインメモリに展開しているから大きすぎるファイルだとエラーになるんだよ。

大石ゆかり

なるほど!ありがとうございます!

他にもJavaScript内でdocument.writeを使わずにHTMLを書く方法についてメンターが回答しています。

TechAcademyではJavaScriptを使ってWebサービスを公開できるオンラインブートキャンプ フロントエンドコース(JavaScript・jQuery講座)を開催しています。プログラミングの初心者でも受講可能です。

現役エンジニアがパーソナルメンターとして受講生に1人ずつつき、マンツーマンのメンタリングで学習をサポートし、最短4週間でオリジナルWebサービスを開発することが可能です。

独学に限界を感じている場合はご検討ください。