【JavaScript】３分で理解できる！動的型付けとデータ型

初心者向けに、JavaScriptにおけるデータ型の考え方とJavaScriptの動的型付けについて解説します。

JavaScriptの変数は、どのような値でも代入することができます。つまり、変数のデータ型を意識しなくても変数を利用することが可能です。

ただし、決してJavaScriptにデータ型が存在しないというわけでありません。あくまでも、代入された値に応じて自動的にデータ型が付与されている（動的型付け）だけです。

このページでは、JavaScriptにおけるデータ型と動的型付けの考え方について、初心者向けに１から解説します。

このページで学べる内容

JavaScript学習中の方であれば、理解必須の超重要知識です。是非最後までご覧ください。

スキルアップを手軽に！
話題のサブスク型プログラミングスクールをご紹介。

SAMURAI TERAKOYA
月額2,980円から始める－入会金不要/途中解約自由。無料体験プランからスタート可能！
飲み会1回分以下の料金で継続的なスキルアップを。

Freeks(フリークス)
月額10,780円でJavaScript、Pythonなどのカリキュラムが学び放題。
質問し放題＆転職サポート制度あり。

ウズウズカレッジ/CCNAコース用
月額33,000円(税込)〜インフラエンジニアの登竜門「CCNA」取得を目指す。
コース受講→転職成功で【実質全額無料】（最大240,000円）

JavaScript：動的型付けとは？

JavaScriptは動的型付け言語に分類されます。動的型付けとは、その名の通り「動的にデータ型が設定される」ということを表します。

動的型付け言語は、変数宣言を行うときに「データ型」を指定する必要がありません。

宣言時にデータ型を指定しなくても、JavaScriptが実行されるタイミングで変数に自動的にデータ型が設定されるという特徴を持ちます。

以下のコードを確認してみましょう。変数宣言 / 初期値に「100」を代入します。

let sample = 100;

上記のようにコーディングした場合、変数「sample」のデータ型は Number（数値）となります。

JavaScriptが、変数に代入されている「100＝数値」というのを認識し、勝手にデータ型「Number」を付与するのです。

これが、動的型付けです。勝手に適切なデータ型が付与されるのです。

変数宣言

また、動的型付け言語の場合には、途中で変数のデータ型が変わることも許容されます。つまり、数値型の変数に文字列を代入することもできるのです。

let sample = 100;
sample = '文字列'; //文字列を代入する

宣言時にNumber（数値）であった変数ですが、文字列を代入してもエラーにはなりません。文字列が代入されたタイミングでデータ型がString（文字列）に変換されるためです。

このように、JavaScriptではデータ型が自動的に付与されるため、データ型を強く意識する必要がありません。他の言語では、例えば数値型の変数に文字列を入れるとエラーになってしまいますが、JavaScriptではそれが起こりません。

動的型付けとは？

①変数のデータ型が自動的に付与される
②同じ変数に異なるデータ型の値を再代入しても自動的にデータ型が変換される　⇒　エラーにならない

とはいえ、データ型を全く意識しなくて良いというわけではありません。

どのようにデータ型の型付け・変換が行われるのか？を知らないと、思わぬエラーを引き起こしてしまいます。

ここからは、JavaScriptで覚えておきたい５つの基本データ型を説明します。

let number1 = 12345;
var number2 = 123.45;

JavaScriptでは、整数も浮動小数も同じ数値（Number）として扱われます。基本的に数字が代入されていれば、数値型であると覚えておけばOKです。

let str1 = "Hello World!!";
let str2 = 'Hello World!!';

文字列の場合は、「"" (ダブルクォーテーション) 」もしくは「``（シングルクォーテーション）」で囲む必要があります。

ダブルクォーテーションでも、シングルクォーテーションでも意味は全く同じです。ただし、両者を併用することはできません。

let strNG = "Hello World!!';　//"と`は併用できません。

この場合は、エラーになるため注意が必要です。

Boolean型は「true」「false」のどちらかの値をとるデータ型です。

let boolTrue  = true;
let boolFalse = false;

let sampleNull = null;

nullというのは「何のデータもない状態」を表します。JavaScriptでは、nullが１つのデータ型として存在します。

let BizOnline;
alert(BizOnline); // "undefined" と表示される

undefinedは、「値が何も入っていない状態」を表します。

プログラミングをより実践的に学びたい―。実際にコーディングをしながら学びたい―。独学に限界を感じている―。

そんな方には、無料体験/オンライン完結もあるプログラミングスクールで学ぶのがおすすめです。都度検索しながら知識を補完していくのではなく、１から体系立てて学ぶことで短時間・かつ効率的にスキルハックすることが可能です。

各プログラミングスクールの特徴をまとめた記事をこちらに記載しておきますので、是非ご覧ください。