
javascriptの変数宣言「var」「let」「const」を使い分ける
javascriptに限らず、プログラミングをする上で変数を扱うことは多々あります。今回はJavaScriptで使う変数の「var」「let」「const」について、違いや使い分けのポイントをまとめておきたいと思います。これまでもあまり気にせずコーディングをしていたのですが、思わぬところで障害の原因になりうるので改めて理解したいと思います。
主な違いと特徴については上記の通りですが、他サイトの記事にも言われている通り、varは関数スコープが原因でバグの原因になりやすいので使用は控えるとのことです。ただ、ECMAScript2015以前の仕様が求められる場合にはletやconstが使えないため、varが必要になります。
ですが、そういうケースはほとんどないかと思います。つまり、letかconstで変数を宣言するのが良いみたいですね。letとconstの使い分けですが、再代入ができるか、定数と扱うかの違いになります。
そうすると、ほとんどのケースはconstを使うことになり、for文など変数の内容が変わる場合にはletを使うという形になりますね。
| var | 基本的な変数宣言で関数スコープのため、ある関数内で使われた場合その中でしか使うことができない。 |
|---|---|
| let | ECMAScript2015以降で使える新しい変数宣言で、ブロックスコープのため、宣言前に参照することはできない。再代入も可能である。 |
| const | ECMAScript2015以降で使える新しい変数宣言で、ブロックスコープのため、宣言前に参照することはできない。再代入ができない定数となる。 |
const hoge = 'ほげ';
for(let i = 0; i < 10; i++) {
}
あまり気にしなかったのですが、詳しく意味を理解することはやはりコーディングをする上でも大事なことなので、これを機にしっかり覚えておきたいと思います!
(参考にさせて頂いたサイト)
var/let/constの使い分けのメモcategories
- WordPress(61)
- JavaScript(49)
- Vue.js(48)
- CSS(46)
- jQuery(34)
- Nuxt.js(22)
- Sass(21)
- Gulp(17)
- webpack(16)
- PHP(14)
- HTML(14)
- GSAP(11)
- React(10)
- Vite(9)
- Pug(9)
- Laravel(8)
- Cordova(8)
- Linux(7)
- Next.js(6)
- Apache(5)
- Shopify(4)
- REST API(4)
- Node.js(4)
- Smarty(3)
- Git(3)
- JSON(3)
- その他プログラミング(3)
- Google Apps API(3)
- Bootstrap(3)
- 環境構築・システム(3)
- TypeScript(2)
- EJS(2)
- RMS(2)
- Docker(2)
- Instagram API(2)
- Excel VBA(2)
- SVG(1)
- Dart(1)
- ECカートASP(1)
- Markdown(1)
- AMP(1)
- Nginx(1)
- XML(1)
- shellscript(1)
- Ruby(1)
- MySQL(1)