🔰

Typescriptのdeclareってなんでするの?

に公開

はじめに

NextJSにて自作ウェブサービスを作成していると、どうしても使用しているライブラリの中身が気になって読むことが多いのですが、typescriptの構文をそんなに理解してないことに気付かされました.
今回は、declareについて疑問点を解消していけたらと思います

declareの意味

意外と単語の意味を理解することで、すんなり解決するなんてこともあります.
weblioでdeclareを調べると宣言するという意味が出てきました.
https://ejje.weblio.jp/content/declare

typescriptのdeclareの意味

typescriptでのdeclare単語の意味と同様で、宣言をするのに使用します.
https://www.typescriptlang.org/docs/handbook/declaration-files/by-example.html

何を宣言するんだと思いますが、これはJavascript内に処理があることを宣言しています.
これを、アンビエント宣言というそうです.
ambient取り巻くといった意味があります

実際のコードで見てみる

greet.jsにて、以下のgreet関数を記述したとします.

# greet.js
// JavaScriptの関数
function greet(name) {
  return `Hello, ${name}!`;
}

このとき、javascriptの関数をtypescriptで呼び出すには型宣言がされていないのでtypescriptの型付けがされていません.
そんなときに、delacareを使用すると型宣言をすることができます.
この場合は、以下のコードになります.

# greet.d.ts
// TypeScriptでの型宣言
declare function greet(name: string): string;

ちなみに、TypeScriptにおいて型情報を提供するためのファイルです.
様々なライブラリにて、*.d.tsというファイル名がたくさんあるとお思います.

最後に...

今回はさらっと、declare(エンビアンと宣言)について触れてみました.
基礎的な部分を復習することで理解が進むことがあるので毛嫌いせず今後もやっていきたいと思います.

Discussion