web-dev-qa-db-ja.com

JavaScript：エラーコンソールにメッセージを出力するにはどうすればいいですか？

できれば変数を含めて、エラーコンソールにメッセージを出力する方法を教えてください。

たとえば、次のようになります。

print('x=%d', x);
javascriptdebugging
429
Mark Harrison

Firebug をインストールすると、console.log(...)やconsole.debug(...)などを使うことができます（ ドキュメント を参照してください）。

460
Dan
console.error(message); //gives you the red errormessage
console.log(message); //gives the default message
console.warn(message); //gives the warn message with the exclamation mark in front of it
console.info(message); //gives an info message with an 'i' in front of the message

ロギングメッセージにCSSを追加することもできます。

console.log('%c My message here', "background: blue; color: black; padding-left:10px;");
306
Nicholas

例外はJavaScriptコンソールにログインしています。 Firebug disabledを維持したい場合はこれを使用できます。

function log(msg) {
    setTimeout(function() {
        throw new Error(msg);
    }, 0);
}

使用法：

log('Hello World');
log('another message');
84
Ivo Danihelka

クロスブラウザで動作するこれを実行するための1つの良い方法はで概説されています。。

55
Ian Oxley

Safari を使えば、書くことができます。

console.log("your message here");

ブラウザのコンソールに表示されます。

15
Lukas

デバッガコンソールではなく、ブラウザのエラーコンソールにメッセージを出力する方法についての文字通りの質問に対する解決策があります。 （デバッガを回避するのには正当な理由があるかもしれません。）

エラーコンソールにメッセージを表示するためにエラーをスローするという提案についてのコメントで述べたように、1つの問題はこれが実行のスレッドを中断することです。スレッドを中断したくない場合は、setTimeoutを使用して作成した別のスレッドにエラーをスローすることができます。それ故に私の解決策（これはIvo Danihelkaによるものの詳細であることが判明します）：

var startTime = (new Date()).getTime();
function logError(msg)
{
  var milliseconds = (new Date()).getTime() - startTime;
  window.setTimeout(function () {
    throw( new Error(milliseconds + ': ' + msg, "") );
  });
}
logError('testing');

タイムアウトがメッセージを見ることを期待するかもしれない順序を歪めるかもしれないので私は開始時間からのミリ秒の時間を含めます。

Errorメソッドの2番目の引数はファイル名のためのもので、これは無駄なファイル名と行番号が出力されないようにするための空の文字列です。呼び出し元の機能を取得することは可能ですが、単純なブラウザに依存しない方法では実行できません。

エラーアイコンの代わりに警告やメッセージのアイコンでメッセージを表示できればいいのですが、その方法が見つかりません。

Throwを使用する場合のもう1つの問題は、それを囲むtry-catchによってキャッチされて捨てられる可能性があることです。また、throwを別のスレッドに配置することで、その障害も回避されます。しかしながら、window.onerrorハンドラが何か違うことをするものに置き換えられるならば、エラーを捕らえることができるもう一つの方法があります。あなたを助けることはできません。

14
dlaliberte

実際に質問に答えるには：

console.error('An error occurred!');
console.error('An error occurred! ', 'My variable = ', myVar);
console.error('An error occurred! ' + 'My variable = ' + myVar);

エラーの代わりに、info、log、またはwarnを使用することもできます。

9
Yster

Firebug を使用していて、IE、Safari、またはOperaもサポートする必要がある場合、 Firebug Lite はこれらのブラウザにconsole.log（）のサポートを追加します。

8
Devon

いつものように、Internet Explorerは、単にconsole.log()を使うことをやめさせる、ローラースケートの大きな象です。

jQueryのlog は非常に簡単に調整できますが、どこにでも追加しなければならないという問題があります。 jQueryを使用している場合の1つの解決策は、最後にそれをjQueryファイルに入れることです。

function log()
{
    if (arguments.length > 0)
    {
        // Join for graceful degregation
        var args = (arguments.length > 1) ? Array.prototype.join.call(arguments, " ") : arguments[0];

        // This is the standard; Firebug and newer WebKit browsers support this.
        try {
            console.log(args);
            return true;
        } catch(e) {
            // Newer Opera browsers support posting erros to their consoles.
            try {
                opera.postError(args);
                return true;
            } 
            catch(e) 
            {
            }
        }

        // Catch all; a good old alert box.
        alert(args);
        return false;
    }
}
5
Chris S

上記の 'throw（）'についてのメモ。それはページの実行を完全に停止させるようです（私はIE8でチェックしました）、それで「進行中のプロセス」をログに記録するのにはあまり役に立ちません（特定の変数を追跡するように…）

私の提案は、おそらくあなたの文書のどこかに textarea 要素を追加し、必要に応じて情報を記録するために value を変更する（あるいは追加する）ことです...

5
Yuval A.

WebKit Web Inspectorは Firebugの console APIもサポートします（ Danの回答 にちょっとした追加）。

5
olliej

完全なコンソールAPIリファレンスについては、 https://developer.chrome.com/devtools/docs/console-api にアクセスしてください。

    console.error(object[Obj,....])\

この場合、objectはエラー文字列になります

4
devSouth555
function foo() {
  function bar() {
    console.trace("Tracing is Done here");
  }
  bar();
}

foo();
console.log(console); //to print console object
console.clear('console.clear'); //to clear console
console.log('console.log'); //to print log message
console.info('console.info'); //to print log message 
console.debug('console.debug'); //to debug message
console.warn('console.warn'); //to print Warning
console.error('console.error'); //to print Error
console.table(["car", "fruits", "color"]);//to print data in table structure
console.assert('console.assert'); //to print Error
console.dir({"name":"test"});//to print object
console.dirxml({"name":"test"});//to print object as xml formate
To Print Error:- console.error('x=%d', x);

console.log("This is the outer level");
console.group();
console.log("Level 2");
console.group();
console.log("Level 3");
console.warn("More of level 3");
console.groupEnd();
console.log("Back to level 2");
console.groupEnd();
console.log("Back to the outer level");
3
Parth Raval
console.log("your message here");

私のために働いています。私はこれを探しています。私はFirefoxを使いました。これが私のスクリプトです。

 $('document').ready(function() {
console.log('all images are loaded');
});

firefoxとChromeで動作します。

1
D.K

これを行う最も簡単な方法は次のとおりです。

console.warn("Text to print on console");
1
Kenneth John Falbous

あなたの質問に答えるためには、ES6の機能を使うことができます。

var var=10;
console.log(`var=${var}`);
0
Aniket Kulkarni

Es6構文では、次のものを使用できます。

console.log(`x = ${x}`);
0
jkordas

これはコンソールには表示されませんが、デバッグのために役立つかもしれないあなたのメッセージで警告ポップアップを開きます。

ただしてください：

alert("message");
0
mmm