JavaScript - typeof オペレータ

ようこそ、志を抱くプログラマーさんたち!今日は、JavaScriptの世界に踏み出し、特にtypeofオペレータを探求する興奮人心的な旅を(start an exciting journey into the world of JavaScript, specifically exploring the typeof operator)始めます。プログラミングが初めてであっても心配しないでください。私はこの概念をステップバイステップでガイドします。これまでに何千もの学生たちにやったようにです。お気に入りの飲み物を手に取り、リラックスして、一緒に深めましょう!

JavaScript - typeof Operator

typeof オペレータ

JavaScriptの世界の探偵のように、さまざまなデータの種類を特定する仕事を想像してみてください。それがまさにtypeofオペレータの仕事です!それは、JavaScriptの値や式の種類を判断する手助けをする放大鏡のようなものです。

シntax

typeofオペレータを使うのは簡単で、パイを食べるようなものです(パイが好きな人はいませんか?)。こんな風にやります:

typeof operand
// または
typeof(operand)

どちらの形式も同じように動作するので、好きな方を選んでください。個人的には最初のほうが打ちやすくて好きです。プログラマーは効率を重視するものですから!

typeof オペレータが返すデータ型

では、typeofが特定できるさまざまなデータ型を見てみましょう。JavaScriptのデータの味のメニューのようなものです:

データ型 typeof が返す
Number "number"
String "string"
Boolean "boolean"
Symbol "symbol"
Undefined "undefined"
Null "object"
Object "object"
Function "function"
BigInt "bigint"

これらの中には馴染みのないものもありますが、心配しないでください。例を交えてそれぞれを探求します。

JavaScript typeof オペレータで数の型をチェック

まずは数から始めましょう。JavaScriptでは、数は数学的な操作の基本単位です。

console.log(typeof 42);        // "number"
console.log(typeof 3.14);      // "number"
console.log(typeof -10);       // "number"
console.log(typeof Infinity);  // "number"
console.log(typeof NaN);       // "number"

驚きですね!InfinityNaN(Not-a-Number)もJavaScriptでは数と見なされます。ホットドッグをサンドイッチと呼ぶようなものです – 予想外ですが、JavaScriptはそんな風に動作します!

JavaScript typeof オペレータで文字列の型をチェック

文字列はデータの包装のようなもので、テキストコンテンツを保持します。

console.log(typeof "Hello, World!");  // "string"
console.log(typeof '42');             // "string"
console.log(typeof ``);               // "string"

'42'がクォートで囲まれていると文字列になることに注意してください。数をテキストの衣装に着せているようなものです!

JavaScript typeof オペレータでブールの型をチェック

ブールはプログラミングのはい/いいえ、真/偽です。ライトスイッチのように – オンかオフのどちらかです。

console.log(typeof true);   // "boolean"
console.log(typeof false);  // "boolean"
console.log(typeof (1 > 2)); // "boolean"

最後の例は、比較がブールを返すことを示しています。質問「1は2よりも大きいか?」に「いいえ!」(偽)と簡単に答えるようなものです。

JavaScript typeof オペレータでシンボルの型をチェック

シンボルはユニークな識別子で、パーティーのそれぞれの名前の名札のようなものです。

console.log(typeof Symbol('unique'));  // "symbol"

今はシンボルについて深く考えなくても大丈夫です。ES6のクールな子どものように、JavaScriptのパーティーでは頻繁に見かけません。

JavaScript typeof オペレータで未定義とnullをチェック

ここでは少し複雑な部分に進みます。プログラミングのマジックのようなものです。

console.log(typeof undefined);  // "undefined"
console.log(typeof null);       // "object"

待ってください、nullはオブジェクト?これはJavaScriptの長年のバグで、修正すると既存のコードが壊れる可能性があるため、そのままにされています。お気に入りのカフェの揺れるテーブルのようなものです – 気になるが、替えると常連客が困るかもしれません。

JavaScript typeof オペレータでオブジェクトの型をチェック

オブジェクトはさまざまなプロパティやメソッドを保持するコンテナのようなものです。

console.log(typeof {});           // "object"
console.log(typeof []);           // "object"
console.log(typeof new Date());   // "object"

はい、配列もオブジェクトです!ショッピングリストが文書の一種であると言うような感じです – 技術的には正しいですが、少し奇妙に感じるかもしれません。

JavaScript typeof オペレータで関数の型をチェック

関数はプログラミングの動詞のように、動作をします!

console.log(typeof function() {});  // "function"
console.log(typeof console.log);    // "function"

関数は独自の型を持ちます。JavaScriptが言うには、「あなたは特別、関数。あなたには独自のカテゴリがあります!」

JavaScript typeof オペレータでBigIntの型をチェック

BigIntは新しい子で、非常に大きな数を扱うために導入されました。

console.log(typeof 1n);  // "bigint"
console.log(typeof BigInt(1));  // "bigint"

BigIntは、通常の数では十分でない場合に使う重量級チャンピオンのようなものです!

JavaScript typeof オペレータの実際の開発での使用

現実のプログラミングでは、typeofはしばしば操作之前的に型をチェックするために使われます。料理を始める前に適切な材料を持っているか確認するようなものです。

function safeAdd(a, b) {
if (typeof a === "number" && typeof b === "number") {
return a + b;
} else {
return "Error: Both arguments must be numbers";
}
}

console.log(safeAdd(5, 10));  // 15
console.log(safeAdd("5", 10));  // "Error: Both arguments must be numbers"

この関数は、両方の引数が数であるかを確認してから加算します。ナンバー専用のクラブのバウンサーのようなものです!

JavaScript 配列とtypeof オペレータ

ここで「罠」があります – 配列はオブジェクトです。実際に見てみましょう:

console.log(typeof [1, 2, 3]);  // "object"

配列をどうやってチェックするか?特別なメソッドを使います:

console.log(Array.isArray([1, 2, 3]));  // true
console.log(Array.isArray({a: 1}));     // false

配列型のオブジェクト用の特別な検出器を持っているようなものです!

そして、みんな!JavaScriptのtypeofの旅が終わりました。練習は完璧への道ですので、これらの例を試してみてください。すぐにプロのように型チェックができるようになるでしょう!幸せなコーディングを、あなたの変数が常に期待する型であることを祈っています!

Credits: Image by storyset