TypeScript - オペレータ
こんにちは、未来のプログラマーたち!今日は、TypeScript オペレータの世界に興味深い旅に出発します。あなたの近所の親切なコンピュータ教師として、私はこの冒険を一歩一歩ガイドします。さあ、シートベルトを締めて、潜りましょう!

オペレータとは?
TypeScript オペレータの冒険の旅を始める前に、オペレータが実際に何かを理解しましょう。オペレータは、コンピュータに特定の数学的または論理的な操作を行うように指示する特別な記号です。プログラミングの魔法の杖のように、データをさまざまな方法で変換し、結合します。
例えば、コードに "+"記号が見える場合、それは単なる装飾ではありません。それは、コンピュータにものを足すように指示するオペレータです。すごいでしょう?
算術オペレータ
まずは算術オペレータから始めましょう。これらはおそらく最も慣れ親しんでいるでしょう。数学の授業で使用したものに似ています。
以下は、TypeScriptの算術オペレータの表です:
| オペレータ | 説明 | 例 |
|---|---|---|
| + | 加算 | 5 + 3 |
| - | 減算 | 7 - 2 |
| * | 掛け算 | 4 * 6 |
| / | 除算 | 8 / 2 |
| % | 剰余 (余り) | 9 % 4 |
| ++ | 増加 | let x = 5; x++; |
| -- | 減少 | let y = 3; y--; |
これらを実際に見てみましょう:
let a: number = 10;
let b: number = 5;
console.log(a + b); // 出力: 15
console.log(a - b); // 出力: 5
console.log(a * b); // 出力: 50
console.log(a / b); // 出力: 2
console.log(a % b); // 出力: 0
let c: number = 7;
c++;
console.log(c); // 出力: 8
let d: number = 3;
d--;
console.log(d); // 出力: 2
この例では、変数に対してさまざまな算術操作を行っています。剰余オペレータ (%) は、一部の人にとって新しいかもしれません。これは除算後の余りを返します。したがって、10 % 5 は 0 です。なぜなら、10 が 5 で割り切れるからです。
比較オペレータ
次は比較オペレータです。これらは値を比較し、比較結果に基づいて true または false を返します。
以下は比較オペレータの表です:
| オペレータ | 説明 | 例 |
|---|---|---|
| == | 等しい | 5 == 5 |
| != | 等しくない | 5 != 3 |
| > | より大きい | 7 > 3 |
| < | より小さい | 2 < 8 |
| >= | より大きいか等しい | 5 >= 5 |
| <= | より小さいか等しい | 4 <= 4 |
これらがどのように動作するか見てみましょう:
let x: number = 5;
let y: number = 10;
console.log(x == y); // 出力: false
console.log(x != y); // 出力: true
console.log(x > y); // 出力: false
console.log(x < y); // 出力: true
console.log(x >= 5); // 出力: true
console.log(y <= 10); // 出力: true
これらのオペレータは、コード内で値を比較して決定を行う際に非常に便利です。
論理オペレータ
論理オペレータは、変数や値間の論理関係を決定するために使用されます。これらは、プログラミングの Sherlock Holmes のように、複数の条件から真実を推理する手助けをしてくれます。
以下は論理オペレータの表です:
| オペレータ | 説明 | 例 |
|---|---|---|
| && | 論理AND | true && false |
| || | 論理OR | true || false |
| ! | 論理NOT | !true |
これらを実際に見てみましょう:
let isRaining: boolean = true;
let isWarm: boolean = false;
console.log(isRaining && isWarm); // 出力: false
console.log(isRaining || isWarm); // 出力: true
console.log(!isRaining); // 出力: false
この例では、&& は両方の条件が true 的时候に true を返します。|| は少なくとも一方の条件が true 的时候に true を返します。! は boolean 値を反転します。
ビットwise オペレータ
今度はもっと高度な領域に進みましょう。ビットwise オペレータは、数のビット表現に対して操作を行います。これは複雑に聞こえるかもしれませんが、一緒に解説します!
以下はビットwise オペレータの表です:
| オペレータ | 説明 | 例 |
|---|---|---|
| & | ビットwise AND | 5 & 3 |
| | | ビットwise OR | 5 | 3 |
| ^ | ビットwise XOR | 5 ^ 3 |
| ~ | ビットwise NOT | ~5 |
| << | 左シフト | 5 << 1 |
| >> | 右シフト | 5 >> 1 |
以下に例を示します:
let a: number = 5; // ビット表現: 0101
let b: number = 3; // ビット表現: 0011
console.log(a & b); // 出力: 1 (ビット表現: 0001)
console.log(a \| b); // 出力: 7 (ビット表現: 0111)
console.log(a ^ b); // 出力: 6 (ビット表現: 0110)
console.log(~a); // 出力: -6 (ビット表現: 1010の2進数補数)
console.log(a << 1); // 出力: 10 (ビット表現: 1010)
console.log(a >> 1); // 出力: 2 (ビット表現: 0010)
これらのオペレータは、数のビット表現に対して操作を行うため、低レベルなプログラミングや特定のアルゴリズムに特に便利です。
代入オペレータ
代入オペレータは、変数に値を代入するために使用されます。これらは、プログラミングの引越し屋のように、値を適切な場所(変数)に配置します。
以下は代入オペレータの表です:
| オペレータ | 説明 | 例 |
|---|---|---|
| = | 代入 | x = 5 |
| += | 加算して代入 | x += 3 |
| -= | 減算して代入 | x -= 2 |
| *= | 掛け算して代入 | x *= 4 |
| /= | 除算して代入 | x /= 2 |
| %= | 剰余して代入 | x %= 3 |
これらを実際に見てみましょう:
let x: number = 10;
x += 5; // これと同じ: x = x + 5
console.log(x); // 出力: 15
x -= 3; // これと同じ: x = x - 3
console.log(x); // 出力: 12
x *= 2; // これと同じ: x = x * 2
console.log(x); // 出力: 24
x /= 4; // これと同じ: x = x / 4
console.log(x); // 出力: 6
x %= 4; // これと同じ: x = x % 4
console.log(x); // 出力: 2
これらのオペレータは、コードを簡潔で読みやすくするショートカットです。
その他のオペレータ
TypeScriptには、他のカテゴリに当てはまらないいくつかのオペレータもあります。
以下はいくつかのその他のオペレータの表です:
| オペレータ | 説明 | 例 |
|---|---|---|
| ?: | 条件 (三元) | condition ? expr1 : expr2 |
| , | コンマ | let x = (1, 2, 3) |
| delete | プロパティ削除 | delete obj.property |
| typeof | 変数の型 | typeof x |
| void | 式の評価と undefined の返却 | void(0) |
以下に三元オペレータの例を見てみましょう:
let age: number = 20;
let canVote: string = age >= 18 ? "Yes" : "No";
console.log(canVote); // 出力: "Yes"
これは if-else 文の短縮形で、条件 (age >= 18) が true 的时候に "Yes" を返し、それ以外の場合は "No" を返します。
タイプオペレータ
最後に、TypeScript 特有のオペレータを見てみましょう。これらは型を扱うのに役立ちます。
以下はタイプオペレータの表です:
| オペレータ | 説明 | 例 |
|---|---|---|
| typeof | 変数の型を取得 | typeof x |
| instanceof | オブジェクトがクラスのインスタンスかをチェック | obj instanceof Class |
| as | タイプアサーション | (someValue as string).toUpperCase() |
| タイプアサーション (代替シンタックス) | ( |
以下に例を見てみましょう:
let x: any = "Hello, TypeScript!";
let length: number = (x as string).length;
console.log(length); // 出力: 20
class Animal {}
class Dog extends Animal {}
let myPet = new Dog();
console.log(myPet instanceof Animal); // 出力: true
この例では、TypeScript に x が string であることを伝えるための型アサーションを使用しています。また、myPet が Animal クラスのインスタンスであるかをチェックしています。
そして、ここまでが TypeScript オペレータの旅です。お楽しみいただけたでしょうか?実践は完璧を生むので、これらのオペレータを自分のコードで試してみてください。ハッピーコーディング!
Credits: Image by storyset
