什么是console.log?

2020/10/14 23:41 · javascript ·  · 0评论

有什么用console.log

请通过代码示例说明如何在JavaScript中使用它。

它不是jQuery功能,而是用于调试的功能。例如,您可以在发生某些情况时将某些内容记录到控制台。例如:

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

然后你会看到#someButton was clicked在Firebug的“控制台”选项卡(或其他工具的控制台-例如Chrome的Web检查)时,您需要点击按钮。

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

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

您可以查看控制台的地方!只是让他们都在一个答案中。

火狐浏览器

http://getfirebug.com/

(您现在也可以使用Firefox内置的开发人员工具Ctrl + Shift + J(“工具”>“ Web开发者”>“错误控制台”),但是Firebug更好;请使用Firebug)

Safari和Chrome

基本上一样。

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

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

IE浏览器

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

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

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

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

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

http://en.wikipedia.org/wiki/书签

歌剧

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

这两个都没有内置控制台,也没有书签功能。因此,我们使用
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.

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

console.log('Testing console');

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

它将日志消息发布到浏览器的JavaScript控制台,例如Firebug或开发人员工具(Chrome / Safari),并显示执行该脚本的行和文件。

此外,当您输出jQuery Object时,它将在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 ,我建议您阅读它。(跟踪,分组,概要分析,对象检查)。

希望这可以帮助!

与jQuery无关,如果您想使用它,我建议您这样做

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

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

如评论中所建议,您也可以在一处执行该命令,然后console.log按常规使用

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

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

console.log在某些浏览器(安装了Firebug的Firefox,Chrome,IE8,以及安装了Firebug Lite的任何浏览器)上将调试信息记录到控制台。在Firefox上,它是一个非常强大的工具,可让您检查对象或检查HTML元素的布局或其他属性。它与jQuery不相关,但是与jQuery结合使用时通常要完成两件事:

  • 安装FirebugFireQuery扩展。除其他优点外,这使jQuery对象的日志记录看起来更好。

  • 创建一个更符合jQuery链接代码约定的包装器。

这通常意味着:

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

然后您可以像这样调用

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

轻松检查jQuery链内部。

console.log 与jQuery无关。

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

有时,一个混淆点是,要使用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实际上接受了任意多个参数。

使用console.log添加调试信息到你的页面。

许多人alert(hasNinjas)为此目的而使用,但是console.log(hasNinjas)更易于使用。使用警报弹出窗口会弹出阻止用户界面的模式对话框。

编辑:我同意Baptiste PernetJanHančič的观点,这是一个非常好的主意,首先检查是否window.console已定义,以便在没有可用控制台的情况下不会破坏您的代码。

一个示例-假设您想知道能够运行程序的哪一行代码(在程序崩溃之前!),只需键入

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

您可以使用它通过Firefox的FirebugWebKit浏览器中的JavaScript控制台来调试JavaScript代码

var variable;

console.log(variable);

即使变量是数组或对象,它也会显示变量的内容。

这是一个类似print_r($var);PHP

当心:在生产代码中留下对控制台的调用将导致您的站点在Internet Explorer中中断。切勿将其打开。参见:https : //web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog

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

console.log()功能是编写一条消息以登录调试控制台,例如 Webkit或Firebug。在浏览器中,您将不会在屏幕上看到任何内容。它将消息记录到调试控制台。仅在带有Firebug的Firefox和基于Webkit的浏览器(Chrome和Safari)中可用。它并非在所有IE版本中都能正常工作

控制台对象是DOM的扩展。

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

有人console.log()将代码留在生产服务器上的javascript文件被视为不良做法

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

使用激活浏览器F12中的调试,然后在调试器菜单中选择“控制台”。

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

Chrome控制台键盘快捷键

Windows:Ctrl+ Shift+ J

Mac:
Cmd+ Option+J

Firefox控制台键盘快捷键

Windows:Ctrl+ Shift+ K

Mac:
Cmd+ Option+K

Internet Explorer控制台键盘快捷键

F12

Safari控制台键盘快捷键

Cmd+ Option+C

console.log具体来说,是开发人员编写代码以不显眼地告知开发人员代码正在做什么的方法。它可以用来提醒您存在问题,但是在进行代码调试时,不应代替交互式调试器。它的异步特性意味着记录的值不一定代表调用该方法时的值。

简而言之:使用console.log(如果可用)记录错误,然后使用选择的调试器修复错误:Firebug,WebKit开发人员工具(SafariChrome内置),IE开发人员工具或Visual Studio。

当我开始console.log调试时,我真的觉得Web编程很容易

var i;

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

console.log(i);

您可以i在firebug的控制台标签中检查的当前值它专门用于调试。

它用于登录(您传递的所有内容)到Firebug控制台。主要用途是调试JavaScript代码。

除了上述用法外,console.log还可以打印到终端中node.js用express创建的服务器(例如)可以console.log用来写入输出记录器文件。

在Java脚本中,没有输入和输出功能。因此要调试代码使用console.log()方法,这是一种日志记录方法。它将在控制台日志(开发工具)下打印。

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

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

在此处引用MDN文档

console -包含许多您可以调用以执行基本调试任务的方法,通常着重于将各种值记录到浏览器的Web控制台。

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

如何在Javascript中使用?

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

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

let myString = 'Hello World';
window.console.log(myString);
本文地址:http://javascript.askforanswer.com/shenmeshiconsole-log-2.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!