カテゴリ: TypeScript 更新日: 2025/12/28

TypeScriptでlet・constの違いを理解して使い分けよう!初心者向け完全解説

TypeScriptでlet・constの違いを理解して使い分けよう
TypeScriptでlet・constの違いを理解して使い分けよう

先生と生徒の会話形式で理解しよう

生徒

「TypeScriptで変数を作るときに、letとconstってありますよね。どっちを使えばいいんですか?」

先生

「どちらも変数を作るための書き方ですが、役割と使いどころが違います。」

生徒

「名前が似ているので、違いがよく分かりません…」

先生

「では、TypeScriptとES6の考え方も含めて、基礎から順番に見ていきましょう。」

1. TypeScriptで使う変数とは?

1. TypeScriptで使う変数とは?
1. TypeScriptで使う変数とは?

TypeScriptでいう変数とは、数値や文字などのデータを一時的に入れておく箱のようなものです。 プログラムでは「年齢」「名前」「合計金額」など、後で使いたい情報を変数に保存します。 パソコンに触ったことがない人でも、メモ帳に数字を書いておくイメージをすると分かりやすいでしょう。

TypeScriptはJavaScriptを元に作られており、ES6(新しいJavaScriptのルール)で登場した letconst を使って変数を定義します。 これらは、昔使われていた var よりも安全で、初心者にも理解しやすい仕組みです。

2. letとは?値を変更できる変数

2. letとは?値を変更できる変数
2. letとは?値を変更できる変数

let は、後から中身を変更できる変数を作るときに使います。 例えば、ゲームのスコアや、入力フォームの合計金額のように、 時間がたつと値が変わるものに向いています。


let score = 10;
score = 20;
console.log(score);

上の例では、最初に10を入れたあとで、20に書き換えています。 このように「あとで変更する予定がある箱」にはletを使います。


20

3. constとは?値を固定する変数

3. constとは?値を固定する変数
3. constとは?値を固定する変数

const は、一度入れた値を変更できない変数です。 「定数(ていすう)」とも呼ばれ、ずっと同じ値を使いたいときに使います。 例えば、消費税率や、サービス名などが分かりやすい例です。


const taxRate = 0.1;
console.log(taxRate);

もし const で作った変数に別の値を入れようとすると、TypeScriptがエラーを教えてくれます。 これは「間違いを早めに気づかせてくれる」便利な仕組みです。


0.1

4. letとconstの違いを生活に例える

4. letとconstの違いを生活に例える
4. letとconstの違いを生活に例える

letとconstの違いを、生活の例で考えてみましょう。 letは「今日の予定を書いたメモ」のようなものです。 予定が変われば、あとから書き直します。

一方、constは「生年月日」のようなものです。 一度決まったら変わることはありません。 このように「変わるか、変わらないか」で使い分けるのが基本です。

5. TypeScriptではconstを優先する理由

5. TypeScriptではconstを優先する理由
5. TypeScriptではconstを優先する理由

TypeScriptやES6では、基本的にconstを先に使うことが推奨されています。 なぜなら、値が変わらないと分かっている方が、プログラムが読みやすくなり、 思わぬミスも減らせるからです。

「後から変更しない」と判断できるものはconst、 「途中で変わる可能性がある」ときだけletを使う、 この考え方を覚えておくと、初心者でも安全なTypeScriptコードが書けます。

6. TypeScriptとES6の連携ポイント

6. TypeScriptとES6の連携ポイント
6. TypeScriptとES6の連携ポイント

letとconstは、ES6で追加されたJavaScriptの新しい書き方です。 TypeScriptはこれらをそのまま使え、さらに型チェックという仕組みで 間違いを事前に見つけやすくしています。

そのため、TypeScriptでletとconstを正しく使い分けることは、 JavaScriptの基礎力アップにもつながります。 プログラミング未経験の人ほど、最初からこのルールに慣れておくことが大切です。

カテゴリの一覧へ
新着記事
New1
TypeScript
TypeScriptでパスエイリアスを設定する方法!baseUrlとpathsでコードをスッキリ整理
New2
JavaScript
JavaScriptのfor文の書き方を初心者向けにやさしく解説
New3
JavaScript
JavaScriptの関数でよくあるエラーとその解決法まとめ
New4
JavaScript
JavaScriptのイベント処理でよくあるエラーとその対処法
人気記事
No.1
Java&Spring記事人気No1
JavaScript
JavaScriptのインストール方法まとめ!Windows・Mac・Linux別にステップ解説
No.2
Java&Spring記事人気No2
JavaScript
JavaScriptのマウスイベントの使い方(click, mouseoverなど)
No.3
Java&Spring記事人気No3
JavaScript
JavaScriptのtoStringとString関数の違いを初心者向けに解説
No.4
Java&Spring記事人気No4
JavaScript
JavaScriptの純粋関数(pure function)と副作用の違いを理解しよう
No.5
Java&Spring記事人気No5
JavaScript
JavaScriptプログラムの実行方法まとめ!ブラウザ・Node.js・コンソールの使い方
No.6
Java&Spring記事人気No6
JavaScript
JavaScriptで文字列をforループで1文字ずつ処理する方法!初心者向け解説
No.7
Java&Spring記事人気No7
TypeScript
TypeScript学習におすすめの無料教材・リファレンスサイト【初心者向け】
No.8
Java&Spring記事人気No8
TypeScript
TypeScriptの始め方:開発環境の構築手順【初心者向け】