TypeScript - 変数の宣言(let)

公開日:2019-01-15 更新日:2019-05-14

1. 概要

let を使って変数の使用を宣言します。

let 変数名;
let 変数名: 変数の型;
let 変数名: 変数の型 = 初期値;

{ } の中で let を使って宣言した変数は、{ } の中だけで使用できます。
関数内だけで使用する変数は、必ず let を付けるようにしてください。

{ } の中と外に同じ変数名の変数がある場合、別の変数として扱われます。
但し、{ } の中で let を使っていない場合は、外の変数が、{ } の中でも使えます。

混乱を避けるため、{ } の中と外など、階層が異なる場合は、必要がない限り、同じ変数名を使わない方が良いかもしれません。
同じ階層の { } の中と、他の { } の中で、同じ変数名を使うのは問題ありません。

また、var を使うと、{ } の中でも外でも、全て同じ変数として扱われます。

2.1 サンプル

{ } の中の変数aは、それぞれ独立したものとなっています。
また、{ } が閉じると、{ } 内で定義した変数は使えなくなります。
{
	let a = 1;
	console.log(a); //1
}

{
	let a = 100;
	console.log(a); //100
}

//ビルドエラー。{ } の中で定義した変数は、{ } の外では使用できません。
//console.log(a);
1
100

2.2 サンプル

{ } の外で定義した変数は、{ } の中で変数名が重複していなければ、そのまま使用できます。
let a = 1;
{
	console.log(a); //1
}
1

2.3 サンプル

{ } の中と外で同じ変数名の変数を定義した場合、同じ階層で定義した変数が有効になります。
混乱を避けるため、以下のような使い方は避けた方が良いかもしれません。
let a = 1;
console.log(a); //1

{
	let a = 100;    //{ } の外の a とは別物扱い
	console.log(a); //100
}

console.log(a); //1	
1
100
1

2.4 サンプル

関数で使用する変数に let を付けない場合、外側で定義した変数が使用されます。

function test() {
	return a + 20;
}

let a = 10;
let b = test(); 

console.log(b); //30
30

関数の引数を受ける変数と、関数内で let を使って宣言した変数は、名前が同じ外部の変数とは別の変数として扱われます。
function test(a) {
	return a + 20;
}

function test2() {
	let a = 100;
	return a + 20;
}

let a = 10;
let b = test(5);
let c = test2();

console.log(a); //10
console.log(b); //25
console.log(c); //120
10
25
120