ES6 配列の分割: 期待どおりに動作しないのはなぜですか?

ES6 配列の分割: 予期せぬ動作

ES6 では、配列の割り当てを分割すると予期しない結果が生じる可能性があり、プログラマーは困惑します。そのようなインスタンスの 1 つを次のコードで示します。

<code class="js">let a, b, c
[a, b] = ['A', 'B']
[b, c] = ['BB', 'C']
console.log(`a=${a} b=${b} c=${c}`)</code>

意図された出力:
a=A b=BB c=C

実際出力:
a=BB b=C c=未定義

説明:

予想に反して、このコードは目的の出力を生成しません。代わりに、b と c の値を交換し、c を未定義のままにします。なぜこのようなことが起こるのかを理解するには、コードを詳しく調べる必要があります。

解析と評価:

JavaScript では、ステートメントを区切るためのセミコロンはオプションです。明示的なセミコロンがない場合、コードは単一のステートメントとして解析されます:

<code class="js">let a = undefined, b = undefined, c = undefined;
[a, b] = (['A', 'B']
[(b, c)] = ['BB', 'C']);
console.log(`a=${a} b=${b} c=${c}`);</code>

ステートメントの内訳:

• [a, b] = ([ 'A', 'B'] は、元のコードのものと同様の構造化代入です。
• [(b, c)] = ['BB', 'C'] は、次の代入式です。配列 ['BB', 'C'] を左側のオペランドに割り当てます。この式は同じ配列として評価されます。
• ['A', 'B'][…] はプロパティ参照です。配列リテラル。未定義と評価されます。
• (b, c) は、未定義の最後のオペランド (c) と評価されるコンマ演算子を使用します。

影響:

したがって、コードは a と c の両方に unknown を割り当てますが、b は値 'C' を正しく受け取ります。この動作を回避するには、プログラマは明示的にセミコロンを使用するか、すべての行を a で始める必要があります。セミコロンを自動的に挿入する必要がある演算子 ((、[、/、-、または `)。

これを理解すると、ES6 での構造化代入が期待どおりに動作し、予期しない値の交換や未定義の代入が防止されます。 .

以上がES6 配列の分割: 期待どおりに動作しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。