アンビエント宣言(declare)と型定義ファイル(.d.ts)

JavaScriptのライブラリをTypeScriptで利用できるようにする方法について確認します。アンビエント宣言、型定義ファイル( .d.ts )などの知識が必要です。

アンビエント宣言( declare )

下記ソースは、javascriptであれば動作しますが、typescriptの場合、変数の宣言がされてないためコンパイルエラーとなります。

x = 30;          // error TS2304: Cannot find name 'x'.
console.log(x);  // error TS2304: Cannot find name 'x'.

declareキーワード を使いアンビエント宣言をしておくことで、TypeScriptでも動作します。

declare var x: number;

x = 30;
console.log(x);

アンビエント宣言の部分は、型定義ファイル(.d.ts) と呼ばれる別ファイルで管理することが推奨されています。

型定義ファイルは用意されていることが多い

JavaScriptのライブラリをTypeScriptで利用する場合、アンビエント宣言によって、型情報を後付で与える必要があります。アンビエント宣言は専用の別ファイル( .d.ts )で管理します。

主要なJavaScriptライブラリの型定義ファイルは、DefinitelyTyped で管理されています。

typscript2.0以降 であれば、npmコマンドだけで型定義ファイルを取り込むことができます。
(以前は typings を利用してました。)

npm install --save-dev @types/jquery

型定義ファイルは、node_modules/@types 配下に追加されます。

typesyncコマンド を活用すると型定義ファイルの追加作業が楽になります。

型定義ファイルが用意されていない場合

最近では、型定義ファイルが用意されていることがほとんどですが、もし存在しない場合、自身で型定義ファイルを用意する必要があります。

src/@types などのフォルダを作成して、外部モジュールのアンビエント宣言を記述した型定義ファイル(.d.ts)を用意します。

参考・補足

【エンジニア向け】仕事を見つける方法

転職する

転職エージェントを活用する

転職サイトの場合、自身でサイト上から企業を探す必要があります。 一方「レバテックキャリア」 などの転職エージェントの場合、エージェントが企業を紹介してくれます。エージェントが間に入ることにより、日程調整や、条件交渉などもサポートしてくれます。

転職ドラフトを活用する

転職ドラフト」は、 企業がITエンジニアをドラフトという形で指名するサービスです。年収が最初に提示されるなどのメリットがあります。 ただ、初回登録時にレジュメ作成が必要で、すでにエンジニア経験が豊富にあるエンジニア向けのサービスかと思います。 レジュメ作成が手間ですが、自身のキャリアを見直す機会になり、他の仕事探しにも役立つはずです。

エンジニア転職保証のあるスクールを活用する

ある程度、開発経験のあるかたであれば、独学で必要なスキルを身につけることができるはずです。ただ、別業種からエンジニアに転職したい場合など、1から独学で学ぶのはハードルが高いです。そういった方は、スクールの活用を検討しても良いと思います。 「TechAcademy」は、エンジニア転職保証コースを提供しています。給付金制度の対象講座として認定されているため、金銭面の負担も抑えることができます。

フリーランスとして活動する

レバテックフリーランス」「ITプロパートナーズ」「ギークスジョブ」は、フリーランスエージェントサービスです。 エージェントによって、支払いサイトなど細かい違いはありますが、まずは良い案件を見つけることが重要です。 登録自体は無料なので、複数エージェントに登録して、より多くの案件を紹介してもらうのがおすすめです。

logo
わくわくBank.
技術系の記事を中心に、役に立つと思ったこと、整理したい情報などを掲載しています。