TypeScript

【初心者向け】変数の静的型付け(TypeScript)と動的型付け(JavaScript)が曖昧だったのでまとめてみた

 
TypeScript

 

今回は変数の静的型付けと動的型付けの違いについて簡単に解説したいと思います。一般的にTypeScriptが静的型付け言語、JavaScriptが動的型付け言語として位置付けられており、今回はその2つを比較して解説していきます。

静的型付けと動的型付けの違いはアプリケーション開発をする上で、非常に重要な概念になってくるので参考にしていただけたらと思います。

この記事の内容
  1. 静的型付けとは
  2. 動的型付けとは
  3. 静的型付けをコードで見てみる
  4. 動的型付けをコードで見てみる
  5. どちらを採用するべきか
  6. まとめ
  7. 参考

静的型付けとは

静的型付けとは、変数の型を一旦決めた場合、その型は変更できない性質のことを言います。Wikipediaには静的型付けは以下のように説明されています。

静的型付けとは、変数や、サブルーチンの引数や返り値などの値について、その型が、コンパイル時など、そのプログラムの実行よりも前にあらかじめ決められている、という型システムの性質

参考：Wikipedia静的型付け

静的型付け言語にはTypeScriptやJavaなどが挙げられます。

動的型付けとは

動的型付けとは、変数にある型のデータを入れた場合でも、それに別の型のデータを入れることができる性質のことを言います。Wikipediaには動的型付けは以下のように説明されています。

動的型付けとは、変数や、サブルーチンの引数や返り値などの値について、その型を、コンパイル時など、そのプログラムの実行よりも前にあらかじめ決めるということをせず、実行時の実際の値による、という型システムの性質

参考：Wikipedia動的型付け

動的型付け言語にはJavaScriptやRubyが挙げられます。

静的型付けをコードで見てみる

静的型付けでは以下のようなコード(TypeScript)のことを指します。

var a: number = 100;
a = 'Hello World!'
console.log(a)
=> test.ts:2:1 - error TS2322: Type 'string' is not assignable to type 'number'.

 

具体的には見ていきましょう。

まずは「var a: number = 100;」とすることで、変数aに数値型(number)の100を代入しています。その後「a = ‘Hello World!’」と文字列を代入していますが、エラーが出力されてしまいます。

変数aは数値型として始めに定義してしまったため、新たに文字列を代入することはできません。これは静的型付けの特徴でもある、一度変数の型を決めてしまうとそれ以降は変更することができない性質のためです。

TypeScriptの型には様々ありますが、string/number/boolean/symbol/bigint/null/undefinedが基本となる型になります。

動的型付けをコードで見てみる

動的型付けでは以下のようなコード(JavaScript)のことを指します。

var a = 100;
a = 'Hello World!'
console.log(a)
=> Hello World!が出力される

 

具体的に見ていきましょう。

まずは「var a = 100;」とすることで変数aを定義しています。変数aには100という数値が入ったので始めは数値型ですが、後から「a = ‘Hello World!’;」と文字列を代入することができています。

このように変数の型(数値型や文字列型)を動的に変えることができる性質のことを、動的型付けと呼びます。

どちらを採用するべきか

ここまでで静的型付けと動的型付けを解説してきましたが、実際どちらの性質(言語)をアプリケーション開発に採用するべきなのでしょうか？

結論、大人数で堅牢なアプリケーションを開発する際は静的型付け、少人数で素早くアプリケーション開発を行いたい場合は動的型付けを使用するようにしましょう。

ただ、TypeScript(静的型付け言語)←→JavaScript(動的型付け言語)のように、どちらに切り替えることも可能なので、一度静的で書いたから動的ではもう書けないといったことはないので安心してください。

まとめ

  • 静的型付けとは、変数の型を一旦決めた場合、その型は変更できない性質のことでTypeScriptがその代表例である。
  • 動的型付けとは、変数にある型のデータを入れた場合でも、それに別の型のデータを入れることができる性質のことでJavaScriptがその代表例である。
  • 大人数で堅牢なアプリケーションを開発する際は静的型付け、少人数で素早くアプリケーション開発を行いたい場合は動的型付けを使用するのが一般的である。

参考

静的型付け言語と動的型付け言語の違いとメリット：
https://note.com/tasting/n/na6152e3aac51

TypeScriptの型入門：
https://qiita.com/uhyo/items/e2fdef2d3236b9bfe74a

 

 

今回は変数の静的型付けと動的型付けの違いについて解説しました。こういった概念を知っておくだけで、プログラミング学習が効率化できると思います。ぜひこの機会にこれらの血がについて理解を深めていただけたらと思います。

JavaScript TypeScript
こんな記事もおすすめ