開発環境
React.js
概要
JavaScriptで関数を共通化して別ファイルにまとめたときに、HTMLのscriptタグを使い呼び出すのは面倒だと思いました。JavaScriptのexportsを使い呼び出すことができることを知りましたので記事にしておきます。
import.jsとexport.jsファイルを作成
import.jsからexport.jsの関数を呼び出していきます。
export.js
exports.criminalIsKogoro=function(){console.log("犯人は毛利小五郎");}exports.detectiveCriminal=function(name){console.log("犯人は"+name);}constcriminalIsAgasa=function(){console.log("犯人は阿笠だ");}
比較するためにcriminalIsAgasaだけはexportsしないようにしておきます。
import.js
importexportFunctionfrom'export.jsのパスを記述'// または// var exportFunction = require('export.jsのパスを記述');exportFunction.criminalIsKogoro;// "犯人は毛利小五郎"exportFunction.detectiveCriminal("元太");//"犯人は元太"exportFunction.criminalIsAgasa;// error. exportFunction.criminalIsAgasa is not a function
このようにexportsをしておかないと外部のファイルから読み込むことができないことが分かりました。