JavaScriptについて考える静的型付け言語と、動的型付け言語について

##主題
本記事は、JavaScriptについて考える静的型付け言語と、動的型付け言語についてまとめたみたものです。

まずそれぞれの型についてまとめる前に、
「二進数」
「16進数」
について簡単にまとめました。

##二進法について

コンピュータが扱うデータは全て二進数で表現できます。0と1だけであらゆる「情報」を表現できるのです。数値は勿論、画像や文字も0と1の二進数で表現できます。


##16進数について

2進数には 0と1の2種類の数字で表現しましたが、16進数には 16種類の数字があります。 文字としての数字は 0 から 9 までの 10種類しかないので、 アルファベットの A ～ F を 「数字」 として借用します。
16進数は 0 から F までの 16種類の数字を使って数を表し、 数が 0 から 1、2、3… と順に増えていくとき、7、8、9 の次は A、B、C と続き、 D、E、F までは 1桁ですが、 次に桁上がりして 10 になります。

    // 例の記載
    0, 1, 2 .. d, e, f, 10, 11, 12 … 1d, 1e, 1f, 20, 21, 22 ... 2d, 2e, 2f, 30

コンピュータ等の内部では 2進数が使われていますが、その内部の状態などを表示する
際に 2 進数は余り使われていません。これは、2 進数で表示すると桁数が多くなる上、0 と
1 だけが繰り返される 2 進数の列は専門家でも読みにくいものとなってしまいます。このた
め、一般的には 16 進数というものが使われています。
####数値

二進数で1桁の場合、`0 1` の 2通り(2^1 )
二進数で2桁の場合、`00 01 10 11` の 4通り(2^2)
二進数で3桁の場合、`000 001 010 011 100 101 110 111` の 8通り(2^3)
…
二進数で8桁の場合、`00000000 00000001 ... 11111110 11111111` の (256通り 2^8)

かなり桁数が多くなってしまいます。
####色

光の三原色 RGB(red、green、blue) の光の強さを それぞれ 0-255 で表現することで1677万色 を表現できます (256 x 256 x 256 = 16777216)

二進数表記だと見辛いため、CSSなどでは `16進数` で表記されることが多いです。


    #00ff00 //　２進数だと 00000000 11111111 00000000　となる
    #ffffff //  ２進数だと　11111111 11111111 11111111　となる

####文字
例えば、
Unicode、ASCIIコード、Shift-JIS、UTF-8

これら世界中の文字を集めたデータがあり、文字ひとつひとつにコードが割り当てられています。
https://wa3.i-3-i.info/word1812.html


####以上の事をふまえて・・・
このように全部01などの数値でデータにするとコンピューターが何のデータか分からないという事が発生します。

例えば `0011010100100111` という並びのデータがあるとき、このデータが数値を表すのか、色を表すのか、文字コードを表すのか分かりません。もしデータに対する型があればコンピュータがその数値をどのように解釈すれば良いか分かります。

なのでどんな型なのかをコンピュータへ伝えることは大事ということになります。

##JavaScriptにおけるデータ型について
結論として、JavaScript は動的型付け言語です。

プログラミング言語には大きく分けて静的型付け言語と、動的型付け言語の二種類があります。
「型付け」「型」とは？動的と静的の違いは？


動的型付け言語は型(=変数に入るデータの種類)を指定しないで変数を使用できます

JavaScriptとJavaで変数を宣言するコードを比較してみましょう。
(JavaScriptとJavaは全く別の言語です。食べ物のハムとハムスターくらい違います。)

JavaScript(動的型付け言語)の変数宣言

    var str = "Hello" // string型
    var i = 1 // number型
    var f = 1.1 // number型
    var bool = true // boolean型

Java(静的型付け言語)の変数宣言

    String str = "Hello"; // String型
    int i = 1; // int型
    float f = 1e-1f; // 1×10^-1 float型
    double d = 1.0; // double型
    boolean b = true; // boolean型

動的型付け言語では、プログラマは型を意識しないで変数を使用できます。一方、静的型付け言語の場合、変数にどんな値が入るかプログラマが指定する必要があります。

静的型付け言語の場合、は指定した型と違うデータが入ってくると、エラーが発生します。
動的型付け言語の場合は、エラーが発生しません。

###デメリットについて
上記のように書くと、動的型にはメリットしかないと思ってしまいますが、そうでもありません。
#####プログラムを実行しないとバグがわからない
事前に分からないため、リリースしたあとに結構気がついたりすることが起きます。

#####無駄なメモリが発生する
必要なメモリ数が把握できないので、余分に多くメモリ領域を取っておく等しておかないといけません。
##型とは

変数に入るデータの種類(文字列なのか、数値なのか、真偽値なのか…etc)を表す。


##JavaScriptで使えるデータ型一覧

JavaScriptにはプリミティブ型のデータ型7つ+オブジェクトというデータ型があります。


####プリミティブ型
*Boolean*
    - 真偽値。`true` または `false` 。
*Number*
    - 数値。整数または浮動小数点数。例えば `42` や `3.14` 。
*BigInt*
    - 長整数。精度が自由な整数値。例えば `9007199254740992n` など。
*String* 
    - 文字列。テキストの値を表す連続した文字。"Hello" など。
*Symbol*
    - シンボル。インスタンスが固有で不変となるデータ型。
*null*
    - null 値を意味する特殊なキーワード。JavaScript では大文字・小文字を区別するので、`null` は `Null` や `NULL` などとは異なる。
*undefined*
    - 未定義。値が未定義の最上位プロパティです。

####オブジェクト型
*Object*
   名前と値をもつプロパティを格納する入れ物

###typeof演算子

宣言した変数がどんな型なのか確認できます。

    var a
    typeof a
    // "undefined"
    
    var hoge = true
    typeof hoge
    // "boolean"
    
    var fuga = 100
    typeof fuga
    // "number"
    
    var hage = 100000000000000n
    typeof hage
    // "bigint"
    
    var obj = {}
    typeof obj
    // "object"


##まとめ
- JavaScriptは動的型付け言語
- JavaScriptにはプリミティブ型のデータ型7つ+オブジェクトというデータ型がある