typeof で型を調べる
このレッスンで分かること
typeof 値で、その値の型名を取り出せます- 返ってくるのは型そのものではなく
"string""number"のような文字列です
エラーは出ないのに答えが合わない
同じ + でも、文字列どうしなら連結、数値どうしなら足し算になります。
JavaScript
console.log("3" + 3); // "33" 連結された
console.log(3 + 3); // 6 足し算になったどちらもエラーになりません。値の性質、つまり 型 が違うだけで結果が変わり、しかも静かに通ってしまいます。だから「今この変数には何の型が入っているか」を確かめる道具が要ります。
JavaScript の値は、文字列 string、数値 number、真偽値 boolean、まだ値が入っていない undefined、それにオブジェクトや配列や関数といった種類に分かれます。整数と小数の区別は無く、3 も 3.5 も同じ number です。
typeof で中身の種類を聞く
typeof は値の型名を返す演算子です。関数ではないので括弧は要りませんが、typeof (値) と書いても動きます。
JavaScript
const author = "山田 太郎";
const postCount = 12;
const isPublic = true;
console.log(typeof author); // "string"
console.log(typeof postCount); // "number"
console.log(typeof isPublic); // "boolean"返ってくるのは型そのものではなく、型の名前が入った 文字列 です。typeof author の結果は string という 6 文字の文字列なので、比べる相手も引用符で囲んだ文字列にします。
typeof の結果を何度か使うなら、一度変数に受けておくと読みやすくなります。前のレッスンの原則どおり、途中で書き換えないので const を選びます。
関数を呼ぶときに引数を渡さないと、その引数は undefined になります。渡し忘れはエラーにならず静かに進み、typeof は "undefined" を返します。
確かめるのは出どころが見えない値だけ
自分で const postCount = 12; と書いたばかりの変数に typeof を使う必要はありません。型は読めば分かるからです。役に立つのは、入力欄から届いた値や、引数として渡ってきた値のように、中身を目で確かめられない場面です。
JavaScript
const inputText = "12"; // 入力欄から届いた値
console.log(typeof inputText); // "string" 数字に見えても文字列
console.log(inputText + 1); // "121" 足し算にならない入力欄の値は、見た目が数字でも文字列として届きます。計算が合わないときは、まず型を書き出してみてください。原因の半分はここで見つかります。
現場の話 受け取った値が数値のつもりで文字列だった、という事故は珍しくありません。計算結果がおかしいときに
console.log(typeof 値)を挟むのは、現場でも定石の一手です。
よくある間違い
いちばん多いのは、typeof の結果を型そのものと比べてしまうケースです。
JavaScript
console.log(typeof postCount === number); // ReferenceError number が未定義
console.log(typeof postCount === "number"); // true 文字列と比べれば正しく判定できるtypeof が返すのは文字列なので、比べる相手も引用符で囲みます。引用符を外した number は、どこにも宣言されていない名前として扱われます。
要件
- 関数名は typeReport、引数は label (文字列) と value (任意の値) の 2 つ
- 型名は typeof value の結果をそのまま使う。null を特別扱いしない
- 戻り値は
name は string ですの形の文字列
入出力例
typeReport("name", "山田 太郎") → "name は string です"
typeReport("workCount", 3) → "workCount は number です"
typeReport("published", true) → "published は boolean です"
typeReport("profile", null) → "profile は object です"
typeReport("bio") → "bio は undefined です"ヒント
