👨👦👦
[TypeScript] ver/let/constの違い
はじめに
TypeScript
の学習を始めた時に、サンプルコードを見てver/let/const
の違いが分かりませんでした。
下記書籍でver/let/const
の違いを理解したので、執筆しします。
結論
解説
varible (変数)とは
下記の表の通りになります。
宣言 | 意味 | 再代入 | 再宣言 |
---|---|---|---|
var | varible(変数) | 〇 | 〇 |
再代入
var の再代入についてサンプルコードとともに確認します。
// 初回宣言
var price = 100;
console.log(price);
// 再代入
price = 120;
console.log(price);
var の再代入が可能である事が確認出来ました。
----- 出力結果 -----
100
120
再宣言
var の再宣言についてサンプルコードとともに確認します。
// 初回宣言
var price = 100;
console.log(price);
// 再宣言
var price = 200;
console.log(price);
var の再宣言が可能である事が確認出来ました。
----- 出力結果 -----
100
200
let it be (あるがままに)とは
下記の表の通りになります。
宣言 | 意味 | 再代入 | 再宣言 |
---|---|---|---|
let | let it be (あるがままに) | 〇 | × |
再代入
let の再代入についてサンプルコードとともに確認します。
// 初回宣言
let price = 100;
console.log(price);
// 再代入
price = 120;
console.log(price);
let の再代入が可能である事が確認出来ました。
----- 出力結果 -----
100
120
再宣言
let の再宣言についてサンプルコードとともに確認します。
// 初回宣言
let price = 100;
console.log(price);
// 再宣言
let price = 200;
console.log(price);
----- 出力結果 -----
error TS2451: Cannot redeclare block-scoped variable 'price'.
constant (定数)とは
下記の表の通りになります。
宣言 | 意味 | 再代入 | 再宣言 |
---|---|---|---|
const | constant (定数) | × | × |
再代入
const の再代入についてサンプルコードとともに確認します。
// 初回宣言
const price = 100;
console.log(price);
// 再代入
price = 120;
console.log(price);
----- 出力結果 -----
error TS2588: Cannot assign to 'price' because it is a constant.
再宣言
const の再宣言についてサンプルコードとともに確認します。
// 初回宣言
const price = 100;
console.log(price);
// 再宣言
const price = 200;
console.log(price);
----- 出力結果 -----
error TS2451: Cannot redeclare block-scoped variable 'price'.
Discussion