ホームページ > ウェブフロントエンド > jsチュートリアル > 変更が適用される前に、「console.log()」で変更された配列値が表示されるのはなぜですか?

変更が適用される前に、「console.log()」で変更された配列値が表示されるのはなぜですか?

Linda Hamilton
リリース: 2024-12-22 13:31:43
オリジナル
345 人が閲覧しました

Why Does `console.log()` Show Altered Array Values Before the Changes Are Applied?

Console.log() が変更された配列値を途中で表示する

プログラミングでは、変数を頻繁に操作し、その値を追跡するためにコンソールに記録します。変化します。ただし、配列の場合、変更が行われる前であっても、console.log() が配列の変更された値を出力するという予期しない動作が発生します。

この現象は、次のコード スニペットで確認できます。

var A = [2, 1];
var C = A;
console.log(C); // [1, 2]
A.sort();
console.log(C); // [1, 2]
ログイン後にコピー

この例では、別の変数 C に割り当てられている 2 つの要素を含む配列 A があります。C をログに記録すると、最初は元の値 [1, 2] が表示されます。ただし、A で sort() メソッドを呼び出すと、変更が A に適用されているにもかかわらず、C もソートされた値 [1, 2] を表示していることがわかります。

動作について

この現象は、console.log() に値のコピーではなくオブジェクトへの参照が渡されるために発生します。配列をログに記録すると、コンソールにはメモリ内の配列への参照が表示され、配列が変更されると更新されます。

これを説明するには、次の変更されたコードを考えてみましょう。

var A = [2, 1];
var C = JSON.parse(JSON.stringify(A));
console.log(C); // [1, 2]
A.sort();
console.log(C); // [2, 1]
ログイン後にコピー

配列 A を JSON 文字列に変換してから配列に戻すことで、メモリ内に新しいオブジェクトを作成します。これは、C が A の元の値のコピーを保持していることを意味します。 A を並べ替えると、C は別のオブジェクトであるため変更されません。

MDN の警告

この動作は、Chrome や Firefox などの最新バージョンのブラウザに特に関係します。

MDN warns: ... at the moment you open the console.
ログイン後にコピー

これは、コンソールに表示されるログ値が、その時点でのオブジェクトの実際の値を表していない可能性があることを意味します。ログに記録されました。代わりに、コンソールが最初に開かれたときの値が表示される場合があり、混乱を招く可能性があります。

結論

配列を操作するときは、次のことが重要です。 console.log() の参照渡し動作を認識しています。早期に変更されるリスクを冒さずに配列の実際の値をログに記録したい場合は、まず JSON.parse() メソッドと JSON.stringify() メソッドを使用して配列のディープ コピーを作成することを検討してください。

以上が変更が適用される前に、「console.log()」で変更された配列値が表示されるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート