Qiita Conference 2025

ymrl (@ymrl)

がんばらないアクセシビリティ: より幅広く価値を届けるために

0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

「【初心者向け】JavaScriptの変数宣言(const / let / var)の違いまとめ」

Last updated at Posted at 2025-04-21

はじめに

初心者の勉強用の備忘録として、
JavaScriptの変数宣言 constletvar の違いについてまとめました

結論

  • 基本は const を使う
  • 再代入が必要なときだけ let
  • var は使わない

詳細

const

  • 再代入できない
  • 再定義もできない
  • 値を固定したいときに使う
  • ブロックスコープ
    ブロック({})内で定義した変数はブロックスコープ内でのみ参照可能。
    ⇒関数スコープ同様にスコープの外側から参照すると例外が発生する。

【再代入】

const test = "宣言1回目";
test = "宣言2回目"; //エラーになる

【関数スコープ】

function test() {
  if (true) {
    const x = 1;
  }

  console.log(x); // エラー:x is not defined
}

test();

let

  • 再代入は可能
  • 再定義は不可
  • 初期値なしで宣言できる
  • constと同じくブロックスコープ

【再代入】

let test = "宣言1回目";
test = "宣言2回目"; //実行可能
function test() {
  if (true) {
    let x = 1;
  }

  console.log(x); // エラー:x is not defined
}
test();

>初期値なしで宣言できる件

let x; // 初期値なし
x = 1; // 後で代入

var

  • 再代入可能
  • 再定義可能
  • 関数スコープ(関数内で有効、ブロックスコープなし)
  • 現代のJavaScriptでは基本的に非推奨
    ⇒const や let が導入される以前は var しかなく、
    そのため古いコードでは使用されているが、新しいコードでは非推奨

【再代入】

var test = "宣言1回目";
test = "宣言2回目";//実行可能

【関数スコープ】

function test() {
  if (true) {
    var x = 1;
  }

  console.log(x); // 1(関数スコープなのでここでも見える)
}

test();

参考文献

https://qiita.com/andota05/items/1233b147f4f96bd53646
https://magazine.techacademy.jp/magazine/14872
https://www.youtube.com/watch?v=4NPrR_szrUM&t=345s
https://typescriptbook.jp/reference/values-types-variables/let-and-const

0
0
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
morara12

@morara12

未経験からWebエンジニアの転職を目指して、学習中/学習した言語 **HTML / CSS / JavaScript** 現在はJavaScriptの基礎理解と実践力アップを目指して、todoアプリを製作中/

Comments

ibyrjbf
@ibyrjbf

• 再定義もできない

ブロック({})内で定義した変数は

test = "宣言2回目"; //エラーになる

• 再定義は不可

• 再定義可能

test = "宣言2回目";//実行可能

この記事の要の部分なので、「宣言」や「代入」といった用語の意味は明確にした方が良いかと思います。

0

Let's comment your feelings that are more than good

Qiita Conference 2025 will be held!: 4/23(wed) - 4/25(Fri)

Qiita Conference is the largest tech conference in Qiita!

Keynote Speaker

ymrl、Masanobu Naruse, Takeshi Kano, Junichi Ito, uhyo, Hiroshi Tokumaru, MinoDriven, Minorun, Hiroyuki Sakuraba, tenntenn, drken, konifar

View event details

Being held Article posting campaign

0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Login to continue?

Login or Sign up with social account

Login or Sign up with your email address