TypeScript の export ステートメント
TypeScript の export
キーワードは、変数、定数、クラス、関数、インターフェイス、またはタイプエイリアスをさまざまなファイルにエクスポートするために使用されます。TypeScript の大規模なプロジェクト全体で効率的なファイル管理を行うのに非常に役立ちます。
この記事では、TypeScript で export
ステートメントを使用する方法を説明します。
TypeScript で export
ステートメントを使用する
export
ステートメントの構文は、export
キーワードで始まり、その後にエクスポートする要素が続きます。これは、import
キーワードを使用して別のファイルにインポートできます。
File1.ts
:
export SomeFunction() {
// body of the function
}
File2.ts
:
import { SomeFunction } from "./File1";
SomeFunction();
上記は、構文と、TypeScript で export
キーワードを使用してモジュールをインポートおよびエクスポートする方法の基本的な例を示しています。
TypeScript でのエクスポートの種類
TypeScript にはさまざまな export
ステートメントがあり、1つは名前付きエクスポートで、もう 1つはデフォルトのエクスポートです。default
エクスポートは、ファイルごとに 1つのデフォルトエクスポートに制限されていますが、複数の名前付きエクスポートまたは通常のエクスポートステートメントが存在する可能性があります。
File1.ts
:
const AddTwoNumbers = (a : number, b : number) : number => {
return a + b;
}
export default AddTwoNumbers;
File2.ts
:
import AddTwoNumbers from "./File1"
const result = AddTwoNumbers(4,5);
したがって、上記の例では、File1.ts
で定義された default export
関数を使用した後に 2つの数値が追加されます。これで、この関数は別の名前でも使用できます。
例えば:
File2.ts
:
import AddNumbers from "./File1"
const result = AddNumbers(4,5);
したがって、default export
の条件では任意の名前を使用できます。ただし、デフォルトのエクスポートはファイルごとに 1つだけに制限されています。
より多くの要素をエクスポートするには、デフォルト以外または名前付きのエクスポートを使用する必要があります。エクスポートされたモジュールは同じ名前でインポートされます。
File1.ts
:
const AddNumbers = (a : number, b : number) : number => {
return a + b;
}
const SubtractTwoNumbers = (a : number, b : number) : number => {
return a - b;
}
export { AddNumbers, SubtractTwoNumbers };
File2.ts
:
import { AddNumbers, SubtractTwoNumbers } from "./File1"
const resultAdd = AddNumbers(4,5);
const resultSub = SubtractTwoNumbers(4,5);
上記は、それぞれのファイルでの名前付きエクスポートとインポートの例を示しています。それらは中括弧で囲む必要があり、デフォルトのエクスポートとは異なり、名前付きエクスポートはいくつでも存在できます。
TypeScript でデフォルトのエクスポートを使用する別の方法は、export =
構文を使用することです。
File1.ts
:
class LengthValidator {
check(s : string) {
return s.length > 0;
}
}
export = LengthValidator;
File2.ts
:
import lengthChecker = require("./File1");
let validator = lengthChecker();
var testString : string = "test"
if ( validator.check(testString)) {
console.log("Okay");
} else {
console.log("Not working");
}
TypeScript ですべてをエクスポート
特定のファイルで定義されているすべての要素をエクスポートすることが重要になる場合があります。これは、export
および*
演算子を介して実行できます。
File1.ts
:
export const AddNumbers = (a : number, b : number) : number => {
return a + b;
}
export const SubtractTwoNumbers = (a : number, b : number) : number => {
return a - b;
}
export * as utils from "./File1"
File2.ts
:
import {utils} from "./File1"
const resultAdd = utils.AddNumbers(4,5);
const resultSub = utils.SubtractTwoNumbers(4,5);
したがって、File1.ts
内のすべてが utils
としてエクスポートされ、別のファイルにインポートでき、上記の例に示すように関数を参照できます。