2022/09/27 (更新日: 2022/10/18)

型について

JavaScript

「今、この変数には何の型が入っているか」を意識してプログラミングすることがバグ防止につながる。動的型付言語であるJavaScriptだからこそ型を意識したプログラミングが重要となる

JavaScriptは動的型付言語

• 変数宣言時に型の定義が必要ない
• 状況によってJavaScriptが型を判定してくれる

型の判定方法

console.log(typeof 変数名);

型の種類

プリミティブ型

• String
• Number
• Bigint
• Bool
• undefind
• sinbol
• null

オブジェクト

• Object(上記のプリミティブ型以外を言う)

ストリング型について

囲み方

• ‘シングルクオート’

let string = 'Hello';

• “ダブルクオート”

let string = "Hello";

• バッククオート“

let string = `Hello`;

違い

変数を埋め込める

let userName = 'hoge'; 
let string = `Hello${userName}!` // Hellohoge!

改行を認識してくれる↓以下は同じ

let single = 'hoge\nfuga';
let back = `hoge
fuga`;

明示的に型を変換する方法

文字列⇒数字

let input = '10';
let result;
// 以下の4つ
result = Number(input) + 10;
result = parseInt(input) + 10;
result = parseFloat(input) + 10;
result = +input + 10;

数字⇒文字列(ほぼ使わない)

let tenNum = 10;
let result;
result = '10' + String(tenNum);
result = '10' + tenNum.toString();

オブジェクトについて

• キーとバリューの組み合わせ(プロパティという)
• キーとバリューを:(コロン)で繋げ、カンマで終わる
• 全てのデータ型が格納できる
• アクセス方法は2つ
  • ドット記法
  • ブラケット記法

const coffee = {
	name: 'moca',
	size: 350,
	isHot: true,
	toppings: ['calamel','cinnamon'],
	nutritions: {
		calories: 430,
		sugars: 50,
	},
}

console.log(coffee.name); // moca
console.log(coffee['isHot']; // true;

// 更新
coffee.isHot = false;
// 追加
coffee.barista = 'hoge';

nullとundefined

• 「何もない」を示す
  • null ⇒ 意図して使用する
  • undefined ⇒ 意図せず出てくる
• 「何もない」を判定するにはnullを使うのが良い

if(hoge === null) foo;

• Tweet