その他の演算子、演算の順序

無効演算子

void 演算子の機能は、式を実行して値を返さないか、または unknown を返すことです。

void 0 // 未定義
void(0) // 未定義

上記は void 演算子を記述する 2 つの方法であり、どちらも正しいです。後者の形式をお勧めします。つまり、常に括弧を使用します。 「void」演算子は優先順位が高いため、括弧を使用しないと誤った結果が発生しやすくなります。たとえば、「void 4 + 7」は実際には「(void 4) + 7」と同等です。

以下は void 演算子の例です。

var x = 3;
void (x = 5) //未定義
× // 5

この演算子の主な用途は、ブラウザのブックマークレット ツール (ブックマークレット) であり、Web ページのジャンプを防ぐためにハイパーリンクにコードを挿入します。

以下のコードを見てください。

<スクリプト>
関数 f() {
  console.log('Hello World');
}
</script>
<a href="http://example.com" onclick="f(); return false;">クリック</a>

上記のコードでは、リンクをクリックした後、最初に onclick コードが実行されます。 onclick は false を返すため、ブラウザは example.com にジャンプしません。

void 演算子は上記の記述を置き換えることができます。

<a href="javascript: void(f())">テキスト</a>

以下は、より実用的な例です。ユーザーはリンクをクリックしてフォームを送信しますが、ページはジャンプしません。

<a href="javascript: void(document.form.submit())">
  提出する
</a>

カンマ演算子

カンマ演算子は 2 つの式を評価し、後者の式の値を返します。

'a', 'b' // "b"

var x = 0;
var y = (x++, 10);
× // 1
y // 10

上記のコードでは、カンマ演算子は後者の式の値を返します。

カンマ演算子の使用法の 1 つは、値を返す前にいくつかの補助演算を実行することです。

var value = (console.log('Hi!'), true);
// こんにちは！

値 // true

上記のコードでは、最初にカンマの前の操作が実行され、次にカンマの後の値が返されます。

操作の順序

優先度

JavaScript ではさまざまな演算子の優先順位 (Operator Precedence) が異なります。優先順位の高い演算子が最初に実行され、優先順位の低い演算子が後で実行されます。

4 + 5 * 6 // 34

上記のコードでは、乗算演算子 (*) は加算演算子 (+) よりも優先度が高いため、乗算が最初に実行され、次に加算が実行されます。これは次と同等です。

4 + (5 * 6) // 34

複数の演算子を混在させると、コードが混乱することがよくあります。

var x = 1;
var arr = [];

var y = arr.length <= 0 || arr[0] === 未定義 ? x : arr[0];

上記のコードでは、この式には 5 つの演算子が含まれているため、変数 y の値がわかりにくくなっています。どれが最も優先度が高いかを思い出すのは簡単ではありません。

言語仕様によると、これら 5 つの演算子の優先順位は高い順に次のとおりです: 以下 (<=)、厳密等価 (===)、または (||)、三項 ( ?:)、等号 (=)。したがって、上記の式の実際の演算順序は次のようになります。

var y = ((arr.length <= 0) || (arr[0] === 未定義)) x : arr[0];

すべての演算子の優先順位を覚えておくことは困難であり、その必要もありません。

括弧の役割

括弧 (()) を使用すると、操作の優先順位を上げることができます。これは、その優先順位が最も高く、括弧内の式が最初に評価されるためです。

(4 + 5) * 6 // 54

上記のコードでは、括弧を使用しているため、乗算の前に加算が実行されます。

演算子の優先順位レベルは非常に複雑で厳格なルールがあるため、演算の順序が明確で読みやすいことを保証するために常に括弧を使用することをお勧めします。これはコードのメンテナンスとデバッグにとって重要です。

ちなみに、括弧は演算子ではなく、構文の構成要素です。これには 2 つの用途があります。1 つは演算の優先順位を上げるために式を括弧内に入れること、もう 1 つは関数を呼び出して関数を追跡することです。

括弧は演算子ではないため、評価効果はなく、操作の優先順位が変更されるだけであることに注意してください。

var x = 1;
(x) = 2;

上記コードの2行目で括弧に評価効果があると「1 = 2」となりエラーとなります。ただし、上記のコードは機能し、括弧が評価ではなく優先度を変更するだけであることを確認します。

これは、式全体が括弧で囲まれている場合、効果がないことも意味します。

（表現）
// と同等
表現

関数を括弧で囲むと、関数自体が返されます。関数の直後に括弧が続く場合、それは関数の呼び出しを意味します。

関数 f() {
  1を返します。
}

(f) // 関数 f(){return 1;}
f() // 1

上記のコードでは、括弧内に置かれた関数は関数自体を返し、関数に続く括弧はその関数を呼び出します。

括弧内に配置できるのは式のみです。括弧内にステートメントを配置すると、エラーが報告されます。

(変数 a = 1)
// SyntaxError: 予期しないトークン変数です

左の組み合わせと右の組み合わせ

同じ優先順位の演算子が同時に出現すると、計算順序の問題が発生します。

a OP b OP c

上記のコードでは、「OP」は演算子を表します。それは二通りに解釈できます。

// 方法 1
(a OP b) OP c

// 方法 2
a OP (b OP c)

上記 2 つの方法で得られる計算結果は異なることがよくあります。 1 つ目の方法は、左側の 2 つのオペランドを結合することです。この解釈方法を使用する演算子は、「左から右への結合」演算子と呼ばれます。2 つ目の方法は、右側の 2 つのオペランドを結合することです。このような演算子は、「右から左への結合性」演算子と呼ばれます。

JavaScript 言語のほとんどの演算子は「左結合」です。加算演算子の例については、以下を参照してください。

x + y + z

//エンジンは次のように説明されます
(x + y) + z

上記のコードでは、「x」と「y」が結合され、それらの予算結果が「z」で計算されます。

いくつかの演算子は「右結合」であり、その中で最も重要なものは代入演算子 (=) と 3 項条件演算子 (?:) です。

w = x = y = z;
q = a ? b : c ? d : e ? f : g;

上記のコードを次のように説明します。

w = (x = (y = z));
q = a ? b : (c ? d : (e ? f : g));

上記の 2 行のコードは、右側のオペランドを結合しています。

さらに、べき乗演算子 (**) も右結合です。

2**3**2
// 2 ** (3 ** 2) に相当
// 512