console.log() は非同期ですか、それとも同期ですか?

Question

現在、Trevor Burnham の「Async Javascript」を読んでいます。これはこれまでのところ素晴らしい本です。

彼は、このスニペットと console.log が Safari および Chrome コンソールで「非同期」であることについて話しています。残念ながらこれを再現することはできません。これはコードです:

var obj = {};
コンソール.ログ(obj);
obj.foo = 'バー';
// 私の結果: Object{}; 'bar';
// 本の結果: {foo:bar};

これが非同期であれば、結果は本に記載されているとおりになると予想されます。 console.log() は、すべてのコードが実行されるまでイベント キューに置かれ、その後実行され、bar 属性を持ちます。

同期的に実行されているようですが。

このコードを実行するのは間違っていますか? console.log は実際には非同期ですか?

Answer 1

これは質問に対する実際の答えではありませんが、この投稿に遭遇し、そのコメントが長すぎる人にとっては役立つかもしれません:

リーリー

これにより、console.log の擬似同期バージョンが作成されますが、受け入れられた回答に記載されているのと同じ警告が表示されます。

最近のほとんどのブラウザの console.log は何らかの形で非同期になっているようですので、場合によってはこのような関数を使用することもできます。

Answer 2

console.log は標準化されていないため、動作はかなり未定義であり、開発者ツールの異なるバージョン間で簡単に変更される可能性があります。あなたの本は古くなっているかもしれませんし、私の答えもすぐに古くなってしまうかもしれません。

私たちのコードでは、console.log が非同期かどうかは関係なく、いかなる種類のコールバックも提供せず、関数を呼び出すときに渡された値が常に参照されて評価されます。

次に何が起こるかは実際のところわかりません (Firebug、Chrome Devtools、Opera Dragonfly はすべてオープンソースなので、それはわかります)。コンソールは、ログに記録された値をどこかに保存し、画面に表示する必要があります。レンダリングは間違いなく非同期で行われます (レート制限された更新の対象となります)。コンソールに記録されたオブジェクトとの将来の対話 (オブジェクト プロパティの拡張など) も同様です。

そのため、コンソールはログに記録された可変オブジェクトのクローン (シリアル化) を作成したり、それらのオブジェクトへの参照を保存したりすることがあります。最初の方法は、深いオブジェクトや大きなオブジェクトでは機能しません。また、少なくともコンソールの最初のレンダリングでは、オブジェクトの「現在の」状態、つまり記録時の状態が表示される可能性があります。この例では、Object {} が表示されます。

ただし、オブジェクトを展開してそのプロパティをさらに調べる場合、コンソールにはオブジェクトとそのプロパティへの参照のみが保存される場合があり、それらを表示すると現在の (変更された) 状態が表示されます。 をクリックすると、例の bar プロパティが表示されるはずです。

これは、「修正」を説明する バグレポート に投稿されたスクリーンショットです:

したがって、一部の値は記録されてからかなり時間が経つまで参照されない可能性があり、これらの値の評価はむしろ lazy (「必要なとき」) になります。この違いの最も有名な例は、Chrome の JavaScript コンソールは配列の遅延評価を処理しますか?という質問にあります。

回避策は、console.log(JSON.stringify(obj)) を実行するなどして、オブジェクトのシリアル化されたスナップショットが常にログに記録されるようにすることです。ただし、これは非円形でかなり小さいオブジェクトに対してのみ機能します。関連項目Safari で console.log のデフォルトの動作を変更するにはどうすればよいですか? 。

より良い解決策は、デバッグにブレークポイントを使用することです。これにより、実行が完全に停止し、各ポイントで現在の値を検査できます。ロギングは、シリアル化可能かつ不変のデータに対してのみ使用してください。