JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのビット演算子（AND・OR・XOR）の使い方を徹底解説

JavaScriptのビット演算子とは

ビット演算子は、数値を2進数のビット単位で処理するための演算子です。主な種類としてAND（&）、OR（|）、XOR（^）があります。それぞれの動作を、実際のコード例と実行結果をもとに詳しく見ていきましょう。

a) AND演算子（&）

AND演算子は、比較する2つのビットがどちらも1の場合にのみ1を返します。

コード例

<html>
<body>
<p id="and"></p>
<script>
   document.getElementById("and").innerHTML = 13 & 1;
</script>
</body>
</html>

実行結果

1

解説： 13を2進数で表すと「1101」、1は「0001」です。同じ桁位置同士を比較すると、最下位ビットだけが両方とも1になっています。したがって結果は「0001」、つまり10進数の1となります。

b) OR演算子（|）

OR演算子は、比較する2つのビットのうちどちらか一方でも1であれば1を返します。

コード例

<html>
<body>
<p id="or"></p>
<script>
   document.getElementById("or").innerHTML = 5 | 1;
</script>
</body>
</html>

実行結果

5

解説： 5を2進数で表すと「0101」、1は「0001」です。各桁を比較すると、少なくとも一方が1の桁はそのまま1になるため、結果は「0101」、つまり5になります。

注意： ビット演算のORは半角パイプ1本の「|」です。「||」（論理OR）と混同しないようにしましょう。「||」は真偽値の判定に使われる別の演算子です。

c) XOR演算子（^）

XOR（排他的論理和）演算子は、2つのビットが異なる場合に1を、同じ場合には0を返します。

コード例

<html>
<body>
<p id="xor"></p>
<script>
   document.getElementById("xor").innerHTML = 5 ^ 1;
</script>
</body>
</html>

実行結果

4

解説： 5を2進数で表すと「0101」、1は「0001」です。ビットが異なるのは下から2番目の桁だけなので、結果は「0100」、つまり4になります。

まとめ：3つのビット演算子の違い

演算子記号1を返す条件
AND&両方のビットが1のとき
OR|どちらか一方が1のとき
XOR^2つのビットが異なるとき

ビット演算子はフラグ管理やマスク処理など、効率的なデータ操作に役立ちます。まずは2進数に変換して各桁を丁寧に比較することで、仕組みをしっかり理解しましょう。

  1. 【初心者向け】JavaScriptの非同期関数（async/await）をサンプルコード付きで解説

    非同期関数（async function）とはJavaScriptの非同期関数は、asyncキーワードを付けて定義する特別な関数です。ES2017（ES8）で標準仕様に組み込まれ、従来のコールバック関数よりも簡潔で読みやすい形でPromiseを扱えるようにするために導入されました。async関数の内部ではawaitキーワードを使用できます。awaitを付けた箇所では処理の流れが一時停止し、対象のPromiseが完了（resolveまたはreject）するまで待機します。この仕組みにより、非同期処理をあたかも同期処理のような直感的なコードとして書ける点が最大のメリットです。押さえておきたいポイン

  2. 【初心者向け】JavaScriptでオブジェクトのディープクローンを作成する方法を実例付きで解説

    はじめにJavaScriptでは、単純な代入（=）やObject.assign()などによるコピーはシャローコピー（浅いコピー）となり、元のオブジェクトとプロパティへの参照が共有されてしまいます。そのため、一方を変更するともう一方にも影響が及びます。これを防ぐには、参照関係まで完全に切り離したディープクローン（深いコピー）を作成する必要があります。本記事では、JSON.parse(JSON.stringify()) を使ったシンプルな方法で、オブジェクトのディープクローンを作成する例を紹介します。ディープクローンのサンプルコード以下のコードでは、ボタンをクリックすると元のオブジェクト obj