Question

console.log有什么用？

请使用代码示例解释如何在JavaScript中使用它。

Answer 1

这不是jQuery功能，而是用于调试目的的功能。例如，当事情发生时，您可以将某些内容记录到控制台。例如：

$('#someButton').click(function() {
  console.log('#someButton was clicked');
  // do something
});

然后，当您点击按钮时，您会在Firebug的“控制台”标签（或其他工具的控制台 - 例如Chrome的网络检查器）中看到#someButton was clicked。

由于某些原因，控制台对象可能不可用。然后你可以检查它是否 - 这很有用，因为你在部署到生产时不必删除调试代码：

if (window.console && window.console.log) {
  // console is available
}

Answer 2

您可以查看控制台的地方！只是将它们全部放在一个答案中。

<强>火狐

http://getfirebug.com/

（您现在也可以使用Firefox的内置开发人员工具Ctrl + Shift + J（工具＆gt; Web Developer＆gt;错误控制台），但Firebug要好得多;使用Firebug）

Safari和Chrome

基本相同。

https://developers.google.com/chrome-developer-tools/docs/overview

https://developer.apple.com/technologies/safari/developer-tools.html

Internet Explorer

不要忘记您可以使用兼容模式在IE9或IE10中调试IE7和IE8

http://msdn.microsoft.com/en-us/library/ie/gg589507(v=vs.85).aspx

http://msdn.microsoft.com/en-us/library/dd565628(v=vs.85).aspx

如果您必须在IE6 for IE7中访问控制台，请使用Firebug Lite书签

http://getfirebug.com/firebuglite/寻找稳定的书签

http://en.wikipedia.org/wiki/Bookmarklet

<强>戏

http://www.opera.com/dragonfly/

<强>的iOS

适用于所有iPhone，iPod touch和iPad。

http://developer.apple.com/library/ios/ipad/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/DebuggingSafarioniPhoneContent/DebuggingSafarioniPhoneContent.html

现在使用iOS 6，如果插入设备，可以通过OS X中的Safari查看控制台。或者您可以使用模拟器完成此操作，只需打开Safari浏览器窗口并转到“开发”选项卡即可。在那里，您可以找到使Safari检查器与您的设备通信的选项。

Windows Phone，Android

这两个都没有内置的控制台，也没有bookmarklet功能。所以我们用 http://jsconsole.com/类型：listen，它会为您提供一个脚本标记以放置在HTML中。从那时起，您可以在jsconsole网站内查看您的控制台。

iOS和Android

您还可以使用http://html.adobe.com/edge/inspect/使用方便的浏览器插件访问任何设备上的Web检查器工具和控制台。

较旧的浏览器问题

如果您在代码中使用console.log并且没有同时打开开发人员工具，那么旧版本的IE将崩溃。幸运的是，这是一个简单的解决方案。使用代码顶部的以下代码段：

 if(!window.console){ window.console = {log: function(){} }; }

这将检查控制台是否存在，如果不存在，则将其设置为具有名为log的空白函数的对象。这样，window.console和window.console.log永远不会真正undefined.

Answer 3

如果使用Firebug等工具检查代码，则可以查看记录到控制台的所有消息。假设你这样做：

console.log('Testing console');

当您访问Firebug中的控制台（或您决定使用哪个工具来检查代码）时，您将看到告诉该函数记录的任何消息。当您想要查看函数是否正在执行，或者是否正在传递/分配变量时，这尤其有用。这对于弄清楚代码出了什么问题实际上非常有价值。

Answer 4

它会将一条日志消息发布到浏览器的javascript控制台，例如Firebug或开发者工具（Chrome / Safari），将显示执行它的行和文件。

此外，当您输出一个jQuery对象时，它将在DOM中包含对该元素的引用，单击它将转到Elements / HTML选项卡中的那个元素。

您可以使用各种方法，但要注意，要在Firefox中使用它，您必须打开Firebug，否则整个页面都会崩溃。无论您正在记录的是变量，数组，对象还是DOM元素，它都会为您提供完整的细分，包括对象的原型（总是很有趣，可以随时查看）。您还可以根据需要包含尽可能多的参数，它们将替换为空格。

console.log(  myvar, "Logged!");
console.info( myvar, "Logged!");
console.warn( myvar, "Logged!");
console.debug(myvar, "Logged!");
console.error(myvar, "Logged!");

这些显示每个命令的不同徽标。

您还可以使用console.profile(profileName);开始分析功能，脚本等。然后以console.profileEnd(profileName);结束它，它将显示在Chrome中的“个人资料”标签中（不知道是否为FF）

如需完整参考，请转到http://getfirebug.com/logging ，我建议您阅读。（跟踪，分组，分析，对象检查）。

希望这有帮助！

Answer 5

与jQuery没有任何关系，如果你想使用它我建议你做

if (window.console) {
    console.log("your message")
}

因此，当代码不可用时，您不会破坏代码。

根据评论中的建议，您也可以在一个地方执行该操作，然后正常使用console.log

if (!window.console) { window.console = { log: function(){} }; }

Answer 6

console.log与jQuery无关。这是调试器（包括Chrome调试器和Firebug）提供的一种常见对象/方法，它允许脚本将数据（或大多数情况下的对象）记录到JavaScript控制台。

Answer 7

console.log将调试信息记录到某些浏览器的控制台上（安装了Firebug的Firefox，Chrome，IE8，安装了Firebug Lite的任何内容）。在Firefox上，它是一个非常强大的工具，允许您检查对象或检查HTML元素的布局或其他属性。它与jQuery无关，但在与jQuery一起使用时通常会做两件事：

为Firebug安装FireQuery扩展程序。除了其他优点之外，这使得jQuery对象的日志记录看起来更好。
创建一个更符合jQuery链式代码约定的包装器。

这通常意味着：

$.fn.log = function() {
    if (window.console && console.log) {
        console.log(this);
    }
    return this;
}

然后你可以调用

$('foo.bar').find(':baz').log().hide();

轻松检查内部jQuery链。

Answer 8

有时候混淆点是使用console.log记录文本消息以及其中一个对象的内容，您必须将两者中的每一个作为不同的参数传递。这意味着您必须用逗号分隔它们，因为如果您使用+运算符来连接输出，这将隐式调用对象的.toString()方法。在大多数情况下，这并未明确覆盖，Object继承的默认实现不提供任何有用的信息。

在控制台中尝试的示例：

>>> var myObj = {foo: 'bar'}
undefined
>>> console.log('myObj is: ', myObj);
myObj is: Object { foo= "bar"}

如果您尝试将信息性文本消息与对象的内容连接起来，那么您将得到：

>>> console.log('myObj is: ' + myObj);
myObj is: [object Object]

所以请记住，console.log实际上会占用你想要的任意数量的参数。

Answer 9

console.log与jQuery无关。

它将消息记录到调试控制台，例如Firebug。

Answer 10

使用console.log向页面添加调试信息。

许多人为此目的使用alert(hasNinjas)，但console.log(hasNinjas)更容易使用。使用警报弹出一个阻止用户界面的模式对话框。

修改：我同意Baptiste Pernet和Jan Hančič，最好先检查是否先定义window.console，这样如果没有控制台，代码就不会中断可用。

Answer 11

一个例子 - 假设您想知道您能够运行程序的哪一行代码（在它崩溃之前！），只需输入

console.log("You made it to line 26. But then something went very, very wrong.")

Answer 12

您可以使用它来为Firefox Firebug或WebKit浏览器中的JavaScript控制台调试JavaScript代码。

var variable;

console.log(variable);

它将显示变量的内容，即使它是数组或对象。

与PHP的print_r($var);类似。

Answer 13

注意：在生产代码中保留对控制台的调用会导致您的网站在Internet Explorer中中断。永远不要把它打开包装。请参阅：https://web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog

Answer 14

早期JS调试是通过alert()函数执行的 - 现在它已经过时了。

console.log()是一个写消息以记录调试控制台的函数，例如Webkit或Firebug。在浏览器中，您将无法在屏幕上看到任何内容。它将消息记录到调试控制台。它仅适用于带有Firebug的Firefox和基于Webkit的浏览器（Chrome和Safari）。 It does not work well in all IE releases

控制台对象是DOM的扩展。

只有在开发和调试过程中才能在代码中使用console.log()。

有人将console.log()留在生产服务器上的javascript文件中，这被认为是不好的做法。

Answer 15

如果您的浏览器支持调试，则可以使用console.log（）方法显示JavaScript值。

使用 F12 在浏览器中激活调试，并在调试器菜单中选择“控制台”。

JavaScript中的控制台。尝试修复或“调试”一个无法运行的JavaScript程序，并使用console.log（）命令进行练习。根据您使用的浏览器，有一些快捷方式可以帮助您访问JavaScript控制台：

Chrome控制台键盘快捷键

Windows： Ctrl + Shift + J
Mac： Cmd + 选项 + J

Firefox控制台键盘快捷键

Windows： Ctrl + Shift + K
Mac： Cmd + 选项 + K

Internet Explorer控制台键盘快捷键

F12 key

Safari控制台键盘快捷键

Cmd + 选项 + C

Answer 16

当我启动console.log进行调试时，我真的觉得网页编程很容易。

var i;

如果我想检查i运行时的值..

console.log(i);

您可以在firebug的控制台选项卡中查看i的当前值。它专门用于调试。

Answer 17

console.log特别是开发人员编写代码的方法，以便不明显地通知开发人员代码正在做什么。它可用于提醒您存在问题，但在调试代码时不应取代交互式调试器。它的异步性质意味着logged values不一定代表调用方法时的值。

简而言之：使用console.log（如果可用）记录错误，然后使用您选择的调试器修复错误：Firebug，WebKit开发人员工具（内置于Safari和{ {3}}），IE Developer Tools或Visual Studio。

Answer 18

它用于记录（通过它的任何内容）到Firebug控制台。主要用途是调试JavaScript代码。

Answer 19

除了上面提到的用法之外，console.log还可以在node.js中打印到终端。使用express（例如）创建的服务器可以使用console.log写入输出记录器文件。

Answer 20

在java脚本中没有输入和输出函数。所以要调试代码console.log（）方法是使用的。它是一种记录方法。它将打印在控制台日志（开发工具）下。

在您打开IE开发工具之前，它不会出现在IE8中。

Answer 21

这与JQuary无关。 conosole.log()引用了控制台对象的日志功能，该功能提供了将信息记录到浏览器控制台的方法。这些方法仅用于调试目的，不应依赖于向最终用户提供信息。

Answer 22

Quoting MDN Docs here

console-包含许多您可以调用以执行的方法基本调试任务，通常围绕各种日志记录值添加到浏览器的Web控制台。

到目前为止，最常用的方法是console.log，记录包含在特定变量中的当前值。

如何在Javascript中使用？

let myString = 'Hello World';
console.log(myString);

还请记住，console是Web浏览器中全局window对象的一部分。因此，以下内容在技术上也是正确的，但在实际情况中不使用。

let myString = 'Hello World';
window.console.log(myString);

Answer 23

我试着用简单的方式解释：

为什么可用：

console.log() 方法将消息写入控制台并显示。

~对于测试非常有用。

~在脚本标签下/内部使用它们。

如何查看：

=>按 F12

语法：

console.log(你想显示的信息);

~接受一个参数并显示它。

使用数组：

var myArray = ["Ali", "John", "Shahrukh"];
console.log(myArray);

处理对象：

var myObject = { firstname : "Ali", lastname : "Rana" };
console.log(myObject);

处理文本：[方法 1]：

console.log("Hello StackOverflow");

处理文本：[方法 2]

var str = "Hello StackOverflow";
console.log(str);

处理数字：

var myvar = '2';
console.log(myvar);

使用函数：

function myfunction() { return (5 * 19); }
console.log(function());

显示带参数的消息：

var a = 2;
console.log("The value of a is " + a);

希望，它可能会有所帮助。

什么是console.log？

23 个答案:

如何在Javascript中使用？