どのようにしてconsole.logにオブジェクトの現在の状態を表示させることができますか？

アドオンのないSafari（実際には他のほとんどのブラウザー）では、呼び出されたconsole.logときの状態ではなく、最後の実行状態でオブジェクトが表示console.logされます。

console.logその行のオブジェクトの状態を取得するには、オブジェクトを複製して出力する必要があります。

例：

var test = {a: true}
console.log(test); // {a: false}
test.a = false; 
console.log(test); // {a: false}

あなたが探していると思いますconsole.dir()。

console.log()オブジェクトへの参照を出力し、オブジェクトを開くときに変更されるため、意図したとおりに動作しません。console.dir呼び出し時にオブジェクトのプロパティのディレクトリを出力します。

以下のJSONのアイデアは良いものです。さらに、JSON文字列を解析して、.dir（）が提供するような参照可能なオブジェクトを取得することもできます。

console.log(JSON.parse(JSON.stringify(obj)));

それがログに記録されたときの状態を確認したい場合に私が通常行うことは、JSON文字列に変換することです。

console.log(JSON.stringify(a));

バニラJS：

@evanの答えがここにあるようです。JSON.parse / stringifyを（ab）使用して、オブジェクトのコピーを効果的に作成します。

console.log(JSON.parse(JSON.stringify(test)));

jQuery固有のソリューション：

あなたは特定の時点でオブジェクトのスナップショットを作成することができます jQuery.extend

console.log($.extend({}, test));

ここで実際に起こっていることは、jQueryがtestオブジェクトのコンテンツを使用して新しいオブジェクトを作成し、それをログに記録することです（そのため、オブジェクトは変更されません）。

AngularJS（1）固有のソリューション：

Angularはcopy同じ効果に使用できる関数を提供します：angular.copy

console.log(angular.copy(test));

バニラJSラッパー関数：

これは、ラップするconsole.logがログアウトする前にオブジェクトのコピーを作成する関数です。

これは、回答の中のいくつかの類似しているが堅牢ではない関数への応答としてこれを書いたものです。これは、複数の引数をサポートし、なりませんそうでない場合は、物事をコピーしようと定期的なオブジェクト。

function consoleLogWithObjectCopy () {
  var args = [].slice.call(arguments);
  var argsWithObjectCopies = args.map(copyIfRegularObject)
  return console.log.apply(console, argsWithObjectCopies)
}

function copyIfRegularObject (o) {
  const isRegularObject = typeof o === 'object' && !(o instanceof RegExp)
  return isRegularObject ? copyObject(o) : o
}

function copyObject (o) {
  return JSON.parse(JSON.stringify(o))
}

使用例：consoleLogWithObjectCopy('obj', {foo: 'bar'}, 1, /abc/, {a: 1})

ことは> Object、コンソールでは、現在の状態のみを示していません。実際には、展開するまでオブジェクトとそのプロパティの読み取りは延期されます。

例えば、

var test = {a: true}
console.log(test);
setTimeout(function () {
    test.a = false; 
    console.log(test);
}, 4000);

次に、最初の呼び出しを展開します。2番目の呼び出しconsole.logが戻る前に行うと、正しくなります。

Xeon06のヒントを使用して、オブジェクト内の彼のJSONを解析できます。これが、オブジェクトをダンプするために使用するログ関数です。

function odump(o){
   console.log($.parseJSON(JSON.stringify(o)));
}

私はユーティリティを定義しました：

function MyLog(text) {
    console.log(JSON.stringify(text));
}

コンソールにログオンする場合は、次のようにします。

MyLog("hello console!");

とてもうまくいきます！

人間が読める方法でオブジェクトをログに記録したい場合があります。

console.log(JSON.stringify(myObject, null, 2));

これにより、オブジェクトが各レベルに2つのスペースでインデントされます。

JavaScriptを使用してJSONをきれいに出力するにはどうすればよいですか？

デバッガライブラリを使用するオプションがあります。

https://debugjs.net/

スクリプトをWebページに含めて、ログステートメントを入力するだけです。

<script src="debug.js"></script>

ロギング

var test = {a: true}
log(test); // {a: true}
test.a = false; 
log(test); // {a: false}

私はこれを示唆するために撃たれるかもしれませんが、これはさらに一歩踏み出すことができます。コンソールオブジェクト自体を直接拡張して、より明確にすることができます。

console.logObject = function(o) {
  (JSON.stringify(o));
}

これが時空の連続体である種のライブラリ衝突/核溶解/破裂を引き起こすかどうかはわかりません。しかし、それは私のqUnitテストで美しく機能します。:)

対象のページにリクエストを送信する前に、コンソールを開いた後にページを更新するか、コンソールを開いてください。

オブジェクト全体をコンソールに出力するだけです。

console.dir(object);